npm - @shopify/hydrogen - Versions diffs - 0.11.0-experimental.1 → 0.11.1-experimental.0 - Mend

@shopify/hydrogen 0.11.0-experimental.1 → 0.11.1-experimental.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (264) hide show

package/dist/worker/handle-event.d.ts DELETED Viewed

@@ -1,23 +0,0 @@
-/// <reference types="@types/node" />
-import { ServerResponse } from 'http';
-import type { ServerComponentRequest } from './framework/Hydration/ServerComponentRequest.server';
-import { RuntimeContext } from './framework/runtime';
-interface HydrogenFetchEvent {
-    /**
-     * Hydrogen only cares about a single property, since we pass `request` as a separate option.
-     */
-    waitUntil?: (callback: Promise<void>) => void;
-}
-export interface HandleEventOptions {
-    request: ServerComponentRequest;
-    entrypoint: any;
-    indexTemplate: string | ((url: string) => Promise<string>);
-    assetHandler?: (event: HydrogenFetchEvent, url: URL) => Promise<Response>;
-    cache?: Cache;
-    streamableResponse?: ServerResponse;
-    dev?: boolean;
-    context?: RuntimeContext;
-    nonce?: string;
-}
-export default function handleEvent(event: HydrogenFetchEvent, { request, entrypoint, indexTemplate, assetHandler, streamableResponse, dev, cache, context, nonce, }: HandleEventOptions): Promise<void | Response>;
-export {};

package/dist/worker/handle-event.js DELETED Viewed

@@ -1,132 +0,0 @@
-import { setContext, setCache } from './framework/runtime';
-import { setConfig } from './framework/config';
-import { renderApiRoute } from './utilities/apiRoutes';
-import { RSC_PATHNAME } from './constants';
-export default async function handleEvent(event, { request, entrypoint, indexTemplate, assetHandler, streamableResponse, dev, cache, context, nonce, }) {
-    const url = new URL(request.url);
-    /**
-     * Inject the cache & context into the module loader so we can pull it out for subrequests.
-     */
-    setCache(cache);
-    setContext(context);
-    setConfig({ dev });
-    const isReactHydrationRequest = url.pathname === RSC_PATHNAME;
-    const template = typeof indexTemplate === 'function'
-        ? await indexTemplate(url.toString())
-        : indexTemplate;
-    /**
-     * If this is a request for an asset, and an asset handler is present, call it.
-     */
-    if (/\.(png|jpe?g|gif|css|js|svg|ico|map)$/i.test(url.pathname) &&
-        assetHandler) {
-        return assetHandler(event, url);
-    }
-    const { render, hydrate, stream, getApiRoute, log } = entrypoint.default || entrypoint;
-    // @ts-ignore
-    if (dev && !(render && hydrate && stream && getApiRoute)) {
-        throw new Error(`entry-server.jsx could not be loaded. This likely occurred because of a Vite compilation error.\n` +
-            `Please check your server logs for more information.`);
-    }
-    if (!isReactHydrationRequest) {
-        const apiRoute = getApiRoute(url);
-        // The API Route might have a default export, making it also a server component
-        // If it does, only render the API route if the request method is GET
-        if (apiRoute &&
-            (!apiRoute.hasServerComponent || request.method !== 'GET')) {
-            return renderApiRoute(request, apiRoute, log);
-        }
-    }
-    const isStreamable = !isBotUA(url, request.headers.get('user-agent')) &&
-        (!!streamableResponse || supportsReadableStream());
-    if (isReactHydrationRequest) {
-        return hydrate(url, {
-            request,
-            response: streamableResponse,
-            isStreamable,
-            dev,
-        });
-    }
-    /**
-     * Stream back real-user responses, but for bots/etc,
-     * use `render` instead. This is because we need to inject <head>
-     * things for SEO reasons.
-     */
-    if (isStreamable) {
-        return stream(url, {
-            request,
-            response: streamableResponse,
-            template,
-            nonce,
-            dev,
-        });
-    }
-    return render(url, {
-        request,
-        template,
-        nonce,
-        dev,
-    });
-}
-/**
- * Determines if the request is from a bot, using the URL and User Agent
- */
-function isBotUA(url, userAgent) {
-    return (url.searchParams.has('_bot') || (!!userAgent && botUARegex.test(userAgent)));
-}
-/**
- * An alphabetized list of User Agents of known bots, combined from lists found at:
- * https://github.com/vercel/next.js/blob/d87dc2b5a0b3fdbc0f6806a47be72bad59564bd0/packages/next/server/utils.ts#L18-L22
- * https://github.com/GoogleChrome/rendertron/blob/6f681688737846b28754fbfdf5db173846a826df/middleware/src/middleware.ts#L24-L41
- */
-const botUserAgents = [
-    'AdsBot-Google',
-    'applebot',
-    'Baiduspider',
-    'baiduspider',
-    'bingbot',
-    'Bingbot',
-    'BingPreview',
-    'bitlybot',
-    'Discordbot',
-    'DuckDuckBot',
-    'Embedly',
-    'facebookcatalog',
-    'facebookexternalhit',
-    'Google-PageRenderer',
-    'Googlebot',
-    'googleweblight',
-    'ia_archive',
-    'LinkedInBot',
-    'Mediapartners-Google',
-    'outbrain',
-    'pinterest',
-    'quora link preview',
-    'redditbot',
-    'rogerbot',
-    'showyoubot',
-    'SkypeUriPreview',
-    'Slackbot',
-    'Slurp',
-    'sogou',
-    'Storebot-Google',
-    'TelegramBot',
-    'tumblr',
-    'Twitterbot',
-    'vkShare',
-    'W3C_Validator',
-    'WhatsApp',
-    'yandex',
-];
-/**
- * Creates a regex based on the botUserAgents array
- */
-const botUARegex = new RegExp(botUserAgents.join('|'), 'i');
-function supportsReadableStream() {
-    try {
-        new ReadableStream();
-        return true;
-    }
-    catch (_) {
-        return false;
-    }
-}

package/dist/worker/handle-worker-event.d.ts DELETED Viewed

@@ -1,11 +0,0 @@
-import { HandleEventOptions } from './handle-event';
-interface FetchEvent {
-    request: Request;
-    waitUntil?: (callback: Promise<void>) => void;
-}
-/**
- * This is a wrapper around `handleEvent` that upgrades Request to ServerComponentRequest,
- * so the rest of the application downstream has access to things like `request.cookies`, etc.
- */
-export default function handleWorkerEvent(event: FetchEvent, options: HandleEventOptions): Promise<void | Response>;
-export {};

package/dist/worker/handle-worker-event.js DELETED Viewed

@@ -1,14 +0,0 @@
-import { ServerComponentRequest } from './framework/Hydration/ServerComponentRequest.server';
-import handleEvent from './handle-event';
-/**
- * This is a wrapper around `handleEvent` that upgrades Request to ServerComponentRequest,
- * so the rest of the application downstream has access to things like `request.cookies`, etc.
- */
-export default async function handleWorkerEvent(event, options) {
-    const request = new ServerComponentRequest(event.request);
-    /**
-     * Note: We need to pass `request` as a separate option since Cloudflare (and other Worker
-     * runtimes, presumably) does not like when `event` is mutated.
-     */
-    return handleEvent(event, { ...options, request });
-}

package/dist/worker/types.d.ts DELETED Viewed

@@ -1,96 +0,0 @@
-/// <reference types="@types/node" />
-import { ServerResponse } from 'http';
-import type { ServerComponentRequest } from './framework/Hydration/ServerComponentRequest.server';
-import type { Metafield, Image, MediaContentType } from './graphql/types/types';
-import { ApiRouteMatch } from './utilities/apiRoutes';
-import { Logger } from './utilities/log/log';
-export declare type Renderer = (url: URL, options: {
-    request: ServerComponentRequest;
-    template: string;
-    nonce?: string;
-    dev?: boolean;
-}) => Promise<Response>;
-export declare type Streamer = (url: URL, options: {
-    request: ServerComponentRequest;
-    response?: ServerResponse;
-    template: string;
-    nonce?: string;
-    dev?: boolean;
-}) => void;
-export declare type Hydrator = (url: URL, options: {
-    request: ServerComponentRequest;
-    response?: ServerResponse;
-    isStreamable: boolean;
-    dev?: boolean;
-}) => void;
-export declare type EntryServerHandler = {
-    render: Renderer;
-    stream: Streamer;
-    hydrate: Hydrator;
-    getApiRoute: (url: URL) => ApiRouteMatch | null;
-    log: Logger;
-};
-export declare type ShopifyConfig = {
-    defaultLocale?: string;
-    storeDomain: string;
-    storefrontToken: string;
-    storefrontApiVersion: string;
-};
-export declare type Hook = (params: {
-    url: URL;
-} & Record<string, any>) => any | Promise<any>;
-export declare type ImportGlobEagerOutput = Record<string, Record<'default' | 'api', any>>;
-export declare type ServerHandlerConfig = {
-    pages?: ImportGlobEagerOutput;
-    shopifyConfig: ShopifyConfig;
-};
-export declare type ClientHandlerConfig = {
-    shopifyConfig: ShopifyConfig;
-};
-export declare type ServerHandler = (App: any, config: ServerHandlerConfig) => EntryServerHandler;
-export declare type ClientHandler = (App: any, config: ClientHandlerConfig) => Promise<void>;
-export interface GraphQLConnection<T> {
-    edges?: {
-        node: T;
-    }[];
-}
-export interface MediaImage {
-    __typename?: string;
-    id?: string;
-    mediaContentType?: MediaContentType;
-    image?: Pick<Image, 'altText' | 'url' | 'id' | 'width' | 'height'>;
-}
-interface ProductVariant {
-    __typename?: string;
-}
-interface Product {
-    __typename?: string;
-}
-export declare type RawMetafield = Omit<Partial<Metafield>, 'reference'> & {
-    reference?: MediaImage | ProductVariant | Product | null;
-};
-export declare type ParsedMetafield = Omit<Partial<Metafield>, 'value' | 'reference'> & {
-    value?: string | number | boolean | Record<any, string> | Date | Rating | Measurement;
-    reference?: MediaImage | ProductVariant | Product | null;
-};
-export interface Rating {
-    value: number;
-    scale_min: number;
-    scale_max: number;
-}
-export interface Measurement {
-    unit: string;
-    value: number;
-}
-export declare type QueryKey = string | readonly unknown[];
-export interface CacheOptions {
-    private?: boolean;
-    maxAge?: number;
-    staleWhileRevalidate?: number;
-    noStore?: boolean;
-}
-export interface HydrogenVitePluginOptions {
-    devCache?: boolean;
-    purgeQueryCacheOnBuild?: boolean;
-}
-export {};

package/dist/worker/utilities/apiRoutes.d.ts DELETED Viewed

@@ -1,21 +0,0 @@
-import { ImportGlobEagerOutput } from '../types';
-import { Logger } from '../utilities/log/log';
-declare type RouteParams = Record<string, string>;
-declare type RequestOptions = {
-    params: RouteParams;
-};
-declare type ResourceGetter = (request: Request, requestOptions: RequestOptions) => Promise<Response | Object | String>;
-interface HydrogenApiRoute {
-    path: string;
-    resource: ResourceGetter;
-    hasServerComponent: boolean;
-}
-export declare type ApiRouteMatch = {
-    resource: ResourceGetter;
-    hasServerComponent: boolean;
-    params: RouteParams;
-};
-export declare function getApiRoutesFromPages(pages: ImportGlobEagerOutput | undefined, topLevelPath?: string): Array<HydrogenApiRoute>;
-export declare function getApiRouteFromURL(url: URL, routes: Array<HydrogenApiRoute>): ApiRouteMatch | null;
-export declare function renderApiRoute(request: Request, route: ApiRouteMatch, log: Logger): Promise<Response>;
-export {};

package/dist/worker/utilities/apiRoutes.js DELETED Viewed

@@ -1,87 +0,0 @@
-import { matchPath } from './matchPath';
-import { logServerResponse } from '../utilities/log/log';
-let memoizedRoutes = [];
-let memoizedPages = {};
-export function getApiRoutesFromPages(pages, topLevelPath = '*') {
-    if (!pages || memoizedPages === pages)
-        return memoizedRoutes;
-    const topLevelPrefix = topLevelPath.replace('*', '').replace(/\/$/, '');
-    const routes = Object.keys(pages)
-        .filter((key) => pages[key].api)
-        .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,
-            resource: pages[key].api,
-            hasServerComponent: !!pages[key].default,
-            exact,
-        };
-    });
-    memoizedRoutes = [
-        ...routes.filter((route) => !route.path.includes(':')),
-        ...routes.filter((route) => route.path.includes(':')),
-    ];
-    memoizedPages = pages;
-    return memoizedRoutes;
-}
-export function getApiRouteFromURL(url, routes) {
-    let foundRoute, foundRouteDetails;
-    for (let i = 0; i < routes.length; i++) {
-        foundRouteDetails = matchPath(url.pathname, routes[i]);
-        if (foundRouteDetails) {
-            foundRoute = routes[i];
-            break;
-        }
-    }
-    if (!foundRoute)
-        return null;
-    return {
-        resource: foundRoute.resource,
-        params: foundRouteDetails.params,
-        hasServerComponent: foundRoute.hasServerComponent,
-    };
-}
-export async function renderApiRoute(request, route, log) {
-    let response;
-    try {
-        response = await route.resource(request, { params: route.params });
-        if (!(response instanceof Response)) {
-            if (typeof response === 'string' || response instanceof String) {
-                response = new Response(response);
-            }
-            else if (typeof response === 'object') {
-                response = new Response(JSON.stringify(response), {
-                    headers: {
-                        'Content-Type': 'application/json',
-                    },
-                });
-            }
-        }
-    }
-    catch (e) {
-        log.error(e);
-        response = new Response('Error processing: ' + request.url, { status: 500 });
-    }
-    logServerResponse('api', log, request, response.status);
-    return response;
-}

package/dist/worker/utilities/log/log.d.ts DELETED Viewed

@@ -1,18 +0,0 @@
-import { ServerComponentRequest } from '../../framework/Hydration/ServerComponentRequest.server';
-/** The `log` utility is a function that's used for logging debugging, warning, and error information about the application.
- * Use this utility by importing `log` from `@shopify/hydrogen`, or by using a `log` prop passed to each page
- * component. We recommend using the `log` prop passed to each page because it will associated your log to the
- * current request in progress.
- */
-export interface Logger {
-    trace: (...args: Array<any>) => void;
-    debug: (...args: Array<any>) => void;
-    warn: (...args: Array<any>) => void;
-    error: (...args: Array<any>) => void;
-    fatal: (...args: Array<any>) => void;
-}
-export declare function getLoggerFromContext(context: any): Logger;
-export declare function setLogger(newLogger: Logger): void;
-export declare function resetLogger(): void;
-export declare const log: Logger;
-export declare function logServerResponse(type: 'str' | 'rsc' | 'ssr' | 'api', log: Logger, request: ServerComponentRequest, responseStatus: number): void;

package/dist/worker/utilities/log/log.js DELETED Viewed

@@ -1,77 +0,0 @@
-import { yellow, red, green, italic, lightBlue } from 'kolorist';
-import { getTime } from '../timing';
-const defaultLogger = {
-    trace(context, ...args) {
-        // Re-enable following line to show trace debugging information
-        // console.log(context.id, ...args);
-    },
-    debug(context, ...args) {
-        console.log(...args);
-    },
-    warn(context, ...args) {
-        console.warn(yellow('WARN: '), ...args);
-    },
-    error(context, ...args) {
-        console.error(red('ERROR: '), ...args);
-    },
-    fatal(context, ...args) {
-        console.error(red('FATAL: '), ...args);
-    },
-};
-let logger = defaultLogger;
-export function getLoggerFromContext(context) {
-    return {
-        trace: (...args) => logger.trace(context, ...args),
-        debug: (...args) => logger.debug(context, ...args),
-        warn: (...args) => logger.warn(context, ...args),
-        error: (...args) => logger.error(context, ...args),
-        fatal: (...args) => logger.fatal(context, ...args),
-    };
-}
-export function setLogger(newLogger) {
-    logger = newLogger;
-}
-export function resetLogger() {
-    logger = defaultLogger;
-}
-export const log = {
-    trace(...args) {
-        return logger.trace({}, ...args);
-    },
-    debug(...args) {
-        return logger.debug({}, ...args);
-    },
-    warn(...args) {
-        return logger.warn({}, ...args);
-    },
-    error(...args) {
-        return logger.error({}, ...args);
-    },
-    fatal(...args) {
-        return logger.fatal({}, ...args);
-    },
-};
-const SERVER_RESPONSE_MAP = {
-    str: 'streaming SSR',
-    rsc: 'Server Components',
-    ssr: 'buffered SSR',
-};
-export function logServerResponse(type, log, request, responseStatus) {
-    const coloredResponseStatus = responseStatus >= 500
-        ? red(responseStatus)
-        : responseStatus >= 400
-            ? yellow(responseStatus)
-            : responseStatus >= 300
-                ? lightBlue(responseStatus)
-                : green(responseStatus);
-    const fullType = SERVER_RESPONSE_MAP[type] || type;
-    const styledType = italic(pad(fullType, '                 '));
-    const paddedTiming = pad((getTime() - request.time).toFixed(2) + ' ms', '          ');
-    const url = type === 'rsc'
-        ? decodeURIComponent(request.url.substring(request.url.indexOf('=') + 1))
-        : request.url;
-    log.debug(`${request.method} ${styledType} ${coloredResponseStatus} ${paddedTiming} ${url}`);
-}
-function pad(str, _pad) {
-    return (str + _pad).substring(0, _pad.length);
-}

package/dist/worker/utilities/matchPath.d.ts DELETED Viewed

@@ -1,10 +0,0 @@
-import { TokensToRegexpOptions } from 'path-to-regexp';
-interface MatchPathOptions extends TokensToRegexpOptions {
-    path?: string;
-    exact?: boolean;
-}
-/**
- * Public API for matching a URL pathname to a path.
- */
-export declare function matchPath(pathname: string, options?: MatchPathOptions): any;
-export {};

package/dist/worker/utilities/matchPath.js DELETED Viewed

@@ -1,54 +0,0 @@
-import { pathToRegexp } from 'path-to-regexp';
-// Modified from React Router v5
-// https://github.com/remix-run/react-router/blob/v5/packages/react-router/modules/matchPath.js
-const cache = {};
-const cacheLimit = 10000;
-let cacheCount = 0;
-function compilePath(path, options) {
-    const cacheKey = `${options.end}${options.strict}${options.sensitive}`;
-    const pathCache = cache[cacheKey] || (cache[cacheKey] = {});
-    if (pathCache[path])
-        return pathCache[path];
-    const keys = [];
-    const regexp = pathToRegexp(path, keys, options);
-    const result = { regexp, keys };
-    if (cacheCount < cacheLimit) {
-        pathCache[path] = result;
-        cacheCount++;
-    }
-    return result;
-}
-/**
- * Public API for matching a URL pathname to a path.
- */
-export function matchPath(pathname, options = {}) {
-    const { path, exact = false, strict = false, sensitive = false } = options;
-    const paths = [].concat(path);
-    return paths.reduce((matched, path) => {
-        if (!path && path !== '')
-            return null;
-        if (matched)
-            return matched;
-        const { regexp, keys } = compilePath(path, {
-            end: exact,
-            strict,
-            sensitive,
-        });
-        const match = regexp.exec(pathname);
-        if (!match)
-            return null;
-        const [url, ...values] = match;
-        const isExact = pathname === url;
-        if (exact && !isExact)
-            return null;
-        return {
-            path,
-            url: path === '/' && url === '' ? '/' : url,
-            isExact,
-            params: keys.reduce((memo, key, index) => {
-                memo[key.name] = values[index];
-                return memo;
-            }, {}),
-        };
-    }, null);
-}

package/dist/worker/utilities/timing.d.ts DELETED Viewed

@@ -1,7 +0,0 @@
-/**
- * Not all environments have access to Performance.now(). This is to prevent
- * timing side channel attacks.
- *
- * See: https://community.cloudflare.com/t/cloudflare-workers-how-do-i-measure-execution-time-of-my-method/69672
- */
-export declare function getTime(): number;

package/dist/worker/utilities/timing.js DELETED Viewed

@@ -1,14 +0,0 @@
-/**
- * Not all environments have access to Performance.now(). This is to prevent
- * timing side channel attacks.
- *
- * See: https://community.cloudflare.com/t/cloudflare-workers-how-do-i-measure-execution-time-of-my-method/69672
- */
-export function getTime() {
-    if (typeof performance !== 'undefined' && performance.now) {
-        return performance.now();
-    }
-    else {
-        return Date.now();
-    }
-}

package/worker.js DELETED Viewed

	@@ -1 +0,0 @@
1	- export {default} from './dist/worker/handle-worker-event';