@shopify/hydrogen 0.1.0

package/dist/node/foundation/Hydration/ServerComponentResponse.server.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ServerComponentResponse = void 0;
+const server_1 = require("react-dom/server");
+class ServerComponentResponse extends Response {
+    constructor() {
+        super(...arguments);
+        this.wait = false;
+        /**
+         * Allow custom body to be a string or a Promise.
+         */
+        this.customBody = '';
+    }
+    /**
+     * Buffer the current response until all queries have resolved,
+     * and prevent it from streaming back early.
+     */
+    doNotStream() {
+        this.wait = true;
+    }
+    canStream() {
+        return !this.wait;
+    }
+    /**
+     * Send the response from a Server Component. Renders React components to string,
+     * and returns `null` to make React happy.
+     */
+    send(body) {
+        if (typeof body === 'object' &&
+            body.$$typeof === Symbol.for('react.element')) {
+            this.customBody = server_1.renderToString(body);
+        }
+        else {
+            this.customBody = body;
+        }
+        return null;
+    }
+}
+exports.ServerComponentResponse = ServerComponentResponse;

package/dist/node/foundation/Hydration/react-utils.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Iterate through each prop in an object and render it to an object.
+ */
+export declare function renderReactProps(props: any): Record<string, any>;
+export declare function parseReactFromString(input: string, options?: any): string | JSX.Element | JSX.Element[];

package/dist/node/foundation/Hydration/react-utils.js

@@ -0,0 +1,63 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseReactFromString = exports.renderReactProps = void 0;
+const server_1 = require("react-dom/server");
+/**
+ * Load `domToReact` from within the library so it doesn't try to load `htmlToDom`
+ * which seems to always resolve to the client version, even though we want server.
+ */
+const dom_to_react_1 = __importDefault(require("html-react-parser/lib/dom-to-react"));
+const html_dom_parser_1 = __importDefault(require("html-dom-parser"));
+/**
+ * Iterate through each prop in an object and render it to an object.
+ */
+function renderReactProps(props) {
+    return Object.entries(props).reduce((memo, [key, prop]) => {
+        if (prop instanceof Array) {
+            memo[key] = prop.map((p) => renderReactProp(p));
+        }
+        else {
+            memo[key] = renderReactProp(prop);
+        }
+        return memo;
+    }, {});
+}
+exports.renderReactProps = renderReactProps;
+/**
+ * If a prop is a React element (determined by the `$$typeof` property),
+ * check to see if it's a Function and call it. Otherwise, recursively
+ * render React props to support nested components.
+ */
+function renderReactProp(prop) {
+    if (typeof prop === 'object' &&
+        prop['$$typeof'] === Symbol.for('react.element')) {
+        if (prop.type instanceof Function) {
+            /**
+             * We can't simply call prop.type(), since this does funky things
+             * with hooks, etc. Instead, we render it to string and convert
+             * it to a React object. This *still* isn't a perfect approach
+             * because the component isn't wrapped in the same context
+             * that the developer may have intended. However, we can
+             * set expectations as thus when passing components as
+             * props within Server Components.
+             */
+            return parseReactFromString(server_1.renderToString(prop));
+        }
+        else {
+            return {
+                ...prop,
+                props: renderReactProps(prop.props),
+            };
+        }
+    }
+    return prop;
+}
+function parseReactFromString(input, options = {}) {
+    return dom_to_react_1.default(
+    // @ts-ignore
+    html_dom_parser_1.default(input, { lowerCaseAttributeNames: false }), options);
+}
+exports.parseReactFromString = parseReactFromString;

package/dist/node/foundation/Router/DefaultRoutes.d.ts

@@ -0,0 +1,20 @@
+import { ReactElement } from 'react';
+export declare type ImportGlobEagerOutput = Record<string, Record<'default', any>>;
+/**
+ * Build a set of default Hydrogen routes based on the output provided by Vite's
+ * import.meta.globEager method.
+ *
+ * @see https://vitejs.dev/guide/features.html#glob-import
+ */
+export declare function DefaultRoutes({ pages, serverState, fallback, }: {
+    pages: ImportGlobEagerOutput;
+    serverState: Record<string, any>;
+    fallback?: ReactElement;
+}): JSX.Element;
+interface HydrogenRoute {
+    component: any;
+    path: string;
+    exact: boolean;
+}
+export declare function createRoutesFromPages(pages: ImportGlobEagerOutput, topLevelPath?: string): HydrogenRoute[];
+export {};

package/dist/node/foundation/Router/DefaultRoutes.js

@@ -0,0 +1,78 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createRoutesFromPages = exports.DefaultRoutes = void 0;
+const react_1 = __importStar(require("react"));
+const react_router_dom_1 = require("react-router-dom");
+/**
+ * Build a set of default Hydrogen routes based on the output provided by Vite's
+ * import.meta.globEager method.
+ *
+ * @see https://vitejs.dev/guide/features.html#glob-import
+ */
+function DefaultRoutes({ pages, serverState, fallback, }) {
+    const { path } = react_router_dom_1.useRouteMatch();
+    const routes = react_1.useMemo(() => createRoutesFromPages(pages, path), [pages, path]);
+    return (react_1.default.createElement(react_router_dom_1.Switch, null,
+        routes.map((route) => (react_1.default.createElement(react_router_dom_1.Route, { key: route.path, exact: route.exact, path: route.path },
+            react_1.default.createElement(route.component, { ...serverState })))),
+        fallback && react_1.default.createElement(react_router_dom_1.Route, { path: "*" }, fallback)));
+}
+exports.DefaultRoutes = DefaultRoutes;
+function createRoutesFromPages(pages, topLevelPath = '*') {
+    const topLevelPrefix = topLevelPath.replace('*', '').replace(/\/$/, '');
+    const routes = Object.keys(pages).map((key) => {
+        const path = key
+            .replace('./pages', '')
+            .replace(/\.server\.(t|j)sx?$/, '')
+            /**
+             * Replace /index with /
+             */
+            .replace(/\/index$/i, '/')
+            /**
+             * Only lowercase the first letter. This allows the developer to use camelCase
+             * dynamic paths while ensuring their standard routes are normalized to lowercase.
+             */
+            .replace(/\b[A-Z]/, (firstLetter) => firstLetter.toLowerCase())
+            /**
+             * Convert /[handle].jsx and /[...handle].jsx to /:handle.jsx for react-router-dom
+             */
+            .replace(/\[(?:[.]{3})?(\w+?)\]/g, (_match, param) => `:${param}`);
+        /**
+         * Catch-all routes [...handle].jsx don't need an exact match
+         * https://reactrouter.com/core/api/Route/exact-bool
+         */
+        const exact = !/\[(?:[.]{3})(\w+?)\]/.test(key);
+        return {
+            path: topLevelPrefix + path,
+            component: pages[key].default,
+            exact,
+        };
+    });
+    /**
+     * Place static paths BEFORE dynamic paths to grant priority.
+     */
+    return [
+        ...routes.filter((route) => !route.path.includes(':')),
+        ...routes.filter((route) => route.path.includes(':')),
+    ];
+}
+exports.createRoutesFromPages = createRoutesFromPages;

package/dist/node/foundation/Router/index.d.ts

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

package/dist/node/foundation/Router/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DefaultRoutes = void 0;
+var DefaultRoutes_1 = require("./DefaultRoutes");
+Object.defineProperty(exports, "DefaultRoutes", { enumerable: true, get: function () { return DefaultRoutes_1.DefaultRoutes; } });

package/dist/node/foundation/ShopifyProvider/ShopifyContext.d.ts

@@ -0,0 +1 @@
+export declare const ShopifyContext: import("react").Context<import("../../types").ShopifyConfig | null>;

package/dist/node/foundation/ShopifyProvider/ShopifyContext.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ShopifyContext = void 0;
+const react_1 = require("react");
+exports.ShopifyContext = react_1.createContext(null);

package/dist/node/foundation/ShopifyProvider/ShopifyProvider.d.ts

@@ -0,0 +1,3 @@
+import { ShopifyProviderProps } from './types';
+export declare const DEFAULT_API_VERSION = "2021-10";
+export declare function ShopifyProvider({ shopifyConfig, children, }: ShopifyProviderProps): JSX.Element;

package/dist/node/foundation/ShopifyProvider/ShopifyProvider.js

@@ -0,0 +1,34 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ShopifyProvider = exports.DEFAULT_API_VERSION = void 0;
+const react_1 = __importStar(require("react"));
+const ShopifyContext_1 = require("./ShopifyContext");
+exports.DEFAULT_API_VERSION = '2021-10';
+function ShopifyProvider({ shopifyConfig, children, }) {
+    const shopifyProviderValue = react_1.useMemo(() => ({
+        locale: 'en-us',
+        graphqlApiVersion: exports.DEFAULT_API_VERSION,
+        ...shopifyConfig,
+    }), [shopifyConfig]);
+    return (react_1.default.createElement(ShopifyContext_1.ShopifyContext.Provider, { value: shopifyProviderValue }, children));
+}
+exports.ShopifyProvider = ShopifyProvider;

package/dist/node/foundation/ShopifyProvider/ShopifyServerProvider.server.d.ts

@@ -0,0 +1,8 @@
+import { ReactElement } from 'react';
+import { ShopifyConfig } from '../../types';
+import { ReactQueryHydrationContext } from './types';
+export declare function ShopifyServerProvider({ children, shopifyConfig, hydrationContext, }: {
+    children: ReactElement;
+    shopifyConfig: ShopifyConfig;
+    hydrationContext: ReactQueryHydrationContext;
+}): JSX.Element;

package/dist/node/foundation/ShopifyProvider/ShopifyServerProvider.server.js

@@ -0,0 +1,14 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ShopifyServerProvider = void 0;
+const react_1 = __importDefault(require("react"));
+const ShopifyProvider_1 = require("./ShopifyProvider");
+const useQuery_1 = require("../../hooks/useQuery");
+function ShopifyServerProvider({ children, shopifyConfig, hydrationContext, }) {
+    return (react_1.default.createElement(ShopifyProvider_1.ShopifyProvider, { shopifyConfig: shopifyConfig },
+        react_1.default.createElement(useQuery_1.QueryProvider, { hydrationContext: hydrationContext }, children)));
+}
+exports.ShopifyServerProvider = ShopifyServerProvider;

package/dist/node/foundation/ShopifyProvider/hooks.d.ts

@@ -0,0 +1,2 @@
+import { ShopifyProviderValue } from './types';
+export declare function useShop(): ShopifyProviderValue;

package/dist/node/foundation/ShopifyProvider/hooks.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useShop = void 0;
+const react_1 = require("react");
+const ShopifyContext_1 = require("./ShopifyContext");
+function useShop() {
+    const context = react_1.useContext(ShopifyContext_1.ShopifyContext);
+    if (!context) {
+        throw new Error('No Shopify Context found');
+    }
+    return context;
+}
+exports.useShop = useShop;

package/dist/node/foundation/ShopifyProvider/index.d.ts

@@ -0,0 +1,2 @@
+export { ShopifyProvider, DEFAULT_API_VERSION } from './ShopifyProvider';
+export { useShop } from './hooks';

package/dist/node/foundation/ShopifyProvider/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useShop = exports.DEFAULT_API_VERSION = exports.ShopifyProvider = void 0;
+var ShopifyProvider_1 = require("./ShopifyProvider");
+Object.defineProperty(exports, "ShopifyProvider", { enumerable: true, get: function () { return ShopifyProvider_1.ShopifyProvider; } });
+Object.defineProperty(exports, "DEFAULT_API_VERSION", { enumerable: true, get: function () { return ShopifyProvider_1.DEFAULT_API_VERSION; } });
+var hooks_1 = require("./hooks");
+Object.defineProperty(exports, "useShop", { enumerable: true, get: function () { return hooks_1.useShop; } });

package/dist/node/foundation/ShopifyProvider/types.d.ts

@@ -0,0 +1,12 @@
+import type { QueryClient } from 'react-query';
+import { ShopifyConfig } from '../../types';
+export declare type ShopifyProviderValue = ShopifyConfig;
+export declare type ShopifyProviderProps = {
+    shopifyConfig: ShopifyConfig;
+    children?: React.ReactNode;
+    manager?: any;
+};
+export interface ReactQueryHydrationContext {
+    queryClient?: QueryClient;
+    dehydratedState?: any;
+}

package/dist/node/foundation/ShopifyProvider/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/node/foundation/index.d.ts

@@ -0,0 +1,4 @@
+export { ShopifyProvider, useShop, DEFAULT_API_VERSION } from './ShopifyProvider';
+export { ShopifyServerProvider } from './ShopifyProvider/ShopifyServerProvider.server';
+export { DefaultRoutes } from './Router';
+export { ClientMarker } from './ClientMarker';

package/dist/node/foundation/index.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ClientMarker = exports.DefaultRoutes = exports.ShopifyServerProvider = exports.DEFAULT_API_VERSION = exports.useShop = exports.ShopifyProvider = void 0;
+var ShopifyProvider_1 = require("./ShopifyProvider");
+Object.defineProperty(exports, "ShopifyProvider", { enumerable: true, get: function () { return ShopifyProvider_1.ShopifyProvider; } });
+Object.defineProperty(exports, "useShop", { enumerable: true, get: function () { return ShopifyProvider_1.useShop; } });
+Object.defineProperty(exports, "DEFAULT_API_VERSION", { enumerable: true, get: function () { return ShopifyProvider_1.DEFAULT_API_VERSION; } });
+var ShopifyServerProvider_server_1 = require("./ShopifyProvider/ShopifyServerProvider.server");
+Object.defineProperty(exports, "ShopifyServerProvider", { enumerable: true, get: function () { return ShopifyServerProvider_server_1.ShopifyServerProvider; } });
+var Router_1 = require("./Router");
+Object.defineProperty(exports, "DefaultRoutes", { enumerable: true, get: function () { return Router_1.DefaultRoutes; } });
+var ClientMarker_1 = require("./ClientMarker");
+Object.defineProperty(exports, "ClientMarker", { enumerable: true, get: function () { return ClientMarker_1.ClientMarker; } });

package/dist/node/framework/graphiql.d.ts

@@ -0,0 +1 @@
+export declare function graphiqlHtml(shop: string, token: string, apiVersion?: string): string;

package/dist/node/framework/graphiql.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.graphiqlHtml = void 0;
+const foundation_1 = require("../foundation");
+function graphiqlHtml(shop, token, apiVersion = foundation_1.DEFAULT_API_VERSION) {
+    return `<html>
+  <head>
+    <title>Shopify Storefront API</title>
+    <link href="https://unpkg.com/graphiql/graphiql.min.css" rel="stylesheet" />
+  </head>
+  <body style="margin: 0;">
+    <div id="graphiql" style="height: 100vh;"></div>
+    <script
+      crossorigin
+      src="https://unpkg.com/react/umd/react.production.min.js"
+    ></script>
+    <script
+      crossorigin
+      src="https://unpkg.com/react-dom/umd/react-dom.production.min.js"
+    ></script>
+    <script
+      crossorigin
+      src="https://unpkg.com/graphiql/graphiql.min.js"
+    ></script>
+    <script>
+      const fetcher = GraphiQL.createFetcher({
+        url: 'https://${shop}/api/${apiVersion}/graphql.json',
+        headers: {
+          Accept: 'application/json',
+          'Content-Type': 'application/graphql',
+          'X-Shopify-Storefront-Access-Token': '${token}'
+        }
+      });
+      ReactDOM.render(
+        React.createElement(GraphiQL, { fetcher: fetcher }),
+        document.getElementById('graphiql'),
+      );
+    </script>
+  </body>
+</html>
+`;
+}
+exports.graphiqlHtml = graphiqlHtml;

package/dist/node/framework/middleware.d.ts

@@ -0,0 +1,17 @@
+import { IncomingMessage, NextFunction } from 'connect';
+import http from 'http';
+import { ViteDevServer } from 'vite';
+import { ShopifyConfig } from '../types';
+declare type HydrogenMiddlewareArgs = {
+    dev?: boolean;
+    shopifyConfig?: ShopifyConfig;
+    indexTemplate: string | ((url: string) => Promise<string>);
+    getServerEntrypoint: () => Record<string, any> | Promise<Record<string, any>>;
+    devServer?: ViteDevServer;
+};
+/**
+ * Provides middleware to Node.js Express-like servers. Used by the Hydrogen
+ * Vite dev server plugin as well as production Node.js implementation.
+ */
+export default function hydrogenMiddleware({ dev, shopifyConfig, indexTemplate, getServerEntrypoint, devServer, }: HydrogenMiddlewareArgs): (request: IncomingMessage, response: http.ServerResponse, next: NextFunction) => Promise<void>;
+export {};

package/dist/node/framework/middleware.js

@@ -0,0 +1,141 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const graphiql_1 = require("./graphiql");
+const handle_event_1 = __importDefault(require("../handle-event"));
+/**
+ * Provides middleware to Node.js Express-like servers. Used by the Hydrogen
+ * Vite dev server plugin as well as production Node.js implementation.
+ */
+function hydrogenMiddleware({ dev, shopifyConfig, indexTemplate, getServerEntrypoint, devServer, }) {
+    return async function (request, response, next) {
+        const graphiqlRequest = dev && isGraphiqlRequest(request);
+        if (graphiqlRequest) {
+            return respondWithGraphiql(response, shopifyConfig);
+        }
+        const url = new URL('http://' + request.headers.host + request.originalUrl);
+        const isReactHydrationRequest = url.pathname === '/react';
+        /**
+         * If it's a dev environment, it's assumed that Vite's dev server is handling
+         * any static or JS requests, so we need to ensure that we don't try to handle them.
+         *
+         * If it's a product environment, it's assumed that the developer is handling
+         * static requests with e.g. static middleware.
+         */
+        if (dev && !shouldInterceptRequest(request, isReactHydrationRequest)) {
+            return next();
+        }
+        try {
+            /**
+             * We're running in the Node.js runtime without access to `fetch`,
+             * which is needed for proxy requests and server-side API requests.
+             */
+            if (!globalThis.fetch) {
+                const fetch = await Promise.resolve().then(() => __importStar(require('node-fetch')));
+                // @ts-ignore
+                globalThis.fetch = fetch.default;
+                // @ts-ignore
+                globalThis.Request = fetch.Request;
+                // @ts-ignore
+                globalThis.Response = fetch.Response;
+                // @ts-ignore
+                globalThis.Headers = fetch.Headers;
+            }
+            /**
+             * Dynamically import ServerComponentResponse after the `fetch`
+             * polyfill has loaded above.
+             */
+            const { ServerComponentRequest } = await Promise.resolve().then(() => __importStar(require('../foundation/Hydration/ServerComponentRequest.server')));
+            const eventResponse = await handle_event_1.default(
+            /**
+             * Mimic a `FetchEvent`
+             */
+            {}, {
+                request: new ServerComponentRequest(request),
+                entrypoint: await getServerEntrypoint(),
+                indexTemplate,
+                streamableResponse: response,
+                dev,
+            });
+            /**
+             * If a `Response` was returned, that means it was not streamed.
+             * Convert the response into a proper Node.js response.
+             */
+            if (eventResponse) {
+                eventResponse.headers.forEach((value, key) => {
+                    response.setHeader(key, value);
+                });
+                response.statusCode = eventResponse.status;
+                response.end(eventResponse.body);
+            }
+        }
+        catch (e) {
+            if (dev && devServer)
+                devServer.ssrFixStacktrace(e);
+            console.log(e.stack);
+            response.statusCode = 500;
+            /**
+             * Attempt to print the error stack within the template.
+             * This allows the react-refresh plugin and other Vite runtime helpers
+             * to display the error and auto-refresh when the error is fixed, instead
+             * of a white screen that needs a manual refresh.
+             */
+            try {
+                const template = typeof indexTemplate === 'function'
+                    ? await indexTemplate(url.toString())
+                    : indexTemplate;
+                const html = template.replace(`<div id="root"></div>`, `<div id="root"><pre><code>${e.stack}</code></pre></div>`);
+                response.write(html);
+                next(e);
+            }
+            catch (_e) {
+                // If template loading is the culprit, give up and just return the error stack.
+                response.write(e.stack);
+                next(e);
+            }
+        }
+    };
+}
+exports.default = hydrogenMiddleware;
+function shouldInterceptRequest(request, isReactHydrationRequest) {
+    var _a;
+    return ((((_a = request.headers['accept']) === null || _a === void 0 ? void 0 : _a.includes('text/html')) ||
+        isReactHydrationRequest) &&
+        request.method === 'GET' &&
+        request.url !== '/favicon.ico');
+}
+/**
+ * /graphiql and /___graphql are supported
+ */
+function isGraphiqlRequest(request) {
+    return /^\/(?:_{3})?graphi?ql/.test(request.url || '');
+}
+async function respondWithGraphiql(response, shopifyConfig) {
+    if (!shopifyConfig) {
+        throw new Error("You must provide shopifyConfig to Hydrogen's Vite middleware");
+    }
+    const { storeDomain, storefrontToken, graphqlApiVersion } = shopifyConfig;
+    response.setHeader('Content-Type', 'text/html');
+    response.end(graphiql_1.graphiqlHtml(storeDomain, storefrontToken, graphqlApiVersion));
+}

package/dist/node/framework/plugin.d.ts

@@ -0,0 +1,3 @@
+import { ShopifyConfig } from '../types';
+declare const _default: (shopifyConfig: ShopifyConfig) => ("" | import("vite").Plugin | import("vite").PluginOption[] | undefined)[];
+export default _default;

package/dist/node/framework/plugin.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const vite_plugin_hydrogen_config_1 = __importDefault(require("./plugins/vite-plugin-hydrogen-config"));
+const vite_plugin_hydrogen_middleware_1 = __importDefault(require("./plugins/vite-plugin-hydrogen-middleware"));
+const vite_plugin_react_server_components_shim_1 = __importDefault(require("./plugins/vite-plugin-react-server-components-shim"));
+const vite_plugin_inspect_1 = __importDefault(require("vite-plugin-inspect"));
+const plugin_react_1 = __importDefault(require("@vitejs/plugin-react"));
+exports.default = (shopifyConfig) => {
+    return [
+        process.env.VITE_INSPECT && vite_plugin_inspect_1.default(),
+        vite_plugin_hydrogen_config_1.default(),
+        vite_plugin_hydrogen_middleware_1.default(shopifyConfig),
+        vite_plugin_react_server_components_shim_1.default(),
+        plugin_react_1.default(),
+    ];
+};

package/dist/node/framework/plugins/vite-plugin-hydrogen-config.d.ts

@@ -0,0 +1,3 @@
+import type { Plugin } from 'vite';
+declare const _default: () => Plugin;
+export default _default;

package/dist/node/framework/plugins/vite-plugin-hydrogen-config.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = () => {
+    return {
+        name: 'vite-plugin-hydrogen-config',
+        config: () => ({
+            resolve: {
+                alias: {
+                    /**
+                     * For some reason, when building in a worker, Vite always
+                     * pulls the client version instead of the server version of these
+                     * dependencies. We intentially force it to load the server versions.
+                     */
+                    'html-dom-parser': process.env.WORKER
+                        ? 'html-dom-parser/lib/server/html-to-dom'
+                        : 'html-dom-parser',
+                },
+            },
+            build: {
+                sourcemap: true,
+            },
+            ssr: {
+                external: ['isomorphic-dompurify'],
+                /**
+                 * Tell Vite to bundle everything when we're building for Workers.
+                 */
+                noExternal: Boolean(process.env.WORKER),
+                target: process.env.WORKER ? 'webworker' : 'node',
+            },
+            optimizeDeps: {
+                /**
+                 * Additionally, the following dependencies have trouble loading the
+                 * correct version of the dependency (server vs client). This tells Vite to take the
+                 * server versions and optimize them for ESM.
+                 */
+                include: [
+                    'html-dom-parser',
+                    'html-react-parser',
+                    'focus-trap-react',
+                    'react-helmet-async',
+                ],
+            },
+        }),
+    };
+};