@shopify/hydrogen 1.6.5 → 2.0.0-alpha.1

package/dist/esnext/utilities/log/log.d.ts

@@ -1,28 +0,0 @@
-import { HydrogenRequest } from '../../foundation/HydrogenRequest/HydrogenRequest.server.js';
-/** 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.
- */
-declare type LoggerMethod = (...args: Array<any>) => void | Promise<any>;
-export interface Logger {
-    trace: LoggerMethod;
-    debug: LoggerMethod;
-    warn: LoggerMethod;
-    error: LoggerMethod;
-    fatal: LoggerMethod;
-    options: () => LoggerOptions;
-}
-export declare type LoggerOptions = {
-    showCacheControlHeader?: boolean;
-    showCacheApiStatus?: boolean;
-    showQueryTiming?: boolean;
-    showUnusedQueryProperties?: boolean;
-};
-export declare type LoggerConfig = Partial<Exclude<Logger, 'options'>> & LoggerOptions;
-export declare type RenderType = 'str' | 'rsc' | 'ssr' | 'api';
-export declare function getLoggerWithContext(context: Partial<HydrogenRequest>): Logger;
-export declare const log: Logger;
-export declare function setLogger(config?: LoggerConfig): void;
-export declare function logServerResponse(type: RenderType, request: HydrogenRequest, responseStatus: number, didError: boolean): void;
-export {};

package/dist/esnext/utilities/log/log.js

@@ -1,89 +0,0 @@
-import { yellow, red, green, italic, lightBlue } from 'kolorist';
-import { getTime } from '../timing.js';
-import { parseUrl } from './utils.js';
-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, error, ...extra) {
-        const url = context ? ` ${context.url}` : '';
-        if (error instanceof Error) {
-            console.error(red(`Error processing route:${url}\n${error.stack}`));
-        }
-        else {
-            console.error(red(`Error:${url} ${error}`));
-        }
-    },
-    fatal(context, ...args) {
-        console.error(red('FATAL: '), ...args);
-    },
-    options: () => ({}),
-};
-let currentLogger = defaultLogger;
-function doLog(method, request, ...args) {
-    try {
-        const maybePromise = currentLogger[method](request, ...args);
-        if (maybePromise instanceof Promise) {
-            request?.ctx?.runtime?.waitUntil?.(maybePromise.catch((e) => {
-                const message = e instanceof Error ? e.stack : e;
-                defaultLogger.error(`Promise error from the custom logging implementation for logger.${method} failed:\n${message}`);
-            }));
-        }
-    }
-    catch (e) {
-        const message = e instanceof Error ? e.stack : e;
-        defaultLogger.error(`The custom logging implementation for logger.${method} failed:\n${message}`);
-    }
-}
-export function getLoggerWithContext(context) {
-    return {
-        trace: (...args) => doLog('trace', context, ...args),
-        debug: (...args) => doLog('debug', context, ...args),
-        warn: (...args) => doLog('warn', context, ...args),
-        error: (...args) => doLog('error', context, ...args),
-        fatal: (...args) => doLog('fatal', context, ...args),
-        options: () => currentLogger.options(),
-    };
-}
-export const log = getLoggerWithContext({});
-export function setLogger(config) {
-    if (!config) {
-        currentLogger = defaultLogger;
-        return;
-    }
-    const options = {};
-    currentLogger = { ...defaultLogger, ...config, options: () => options };
-    for (const key of Object.keys(config)) {
-        if (!(key in defaultLogger)) {
-            delete currentLogger[key];
-            options[key] = config[key];
-        }
-    }
-}
-const SERVER_RESPONSE_MAP = {
-    str: 'streaming SSR',
-    rsc: 'Server Components',
-    ssr: 'buffered SSR',
-};
-export function logServerResponse(type, request, responseStatus, didError) {
-    const log = getLoggerWithContext(request);
-    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(fullType.padEnd(17));
-    const paddedTiming = ((getTime() - request.time).toFixed(2) + ' ms').padEnd(10);
-    const url = parseUrl(type, request.url);
-    log.debug(`${request.method} ${styledType} ${coloredResponseStatus} ${didError || responseStatus >= 400 ? red('error') : green('ok   ')} ${paddedTiming} ${url}`);
-}

package/dist/esnext/utilities/log/utils.d.ts

@@ -1,3 +0,0 @@
-import type { RenderType } from './log.js';
-export declare function findQueryName(key: string): string;
-export declare function parseUrl(type: RenderType, url: string): string;

package/dist/esnext/utilities/log/utils.js

@@ -1,11 +0,0 @@
-export function findQueryName(key) {
-    if (key.length < 100) {
-        return key.replace(__HYDROGEN_CACHE_ID__, '').replace(/"/g, '');
-    }
-    return key.match(/query\s+([^\s({]+)/)?.[1] || '<unknown>';
-}
-export function parseUrl(type, url) {
-    return type === 'rsc'
-        ? decodeURIComponent(url.substring(url.indexOf('=') + 1))
-        : url;
-}

package/dist/esnext/utilities/matchPath.d.ts

@@ -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/esnext/utilities/matchPath.js

@@ -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/esnext/utilities/measurement.d.ts

@@ -1,3 +0,0 @@
-import { Measurement } from '../types.js';
-export declare function getMeasurementAsString(measurement: Measurement, locale?: string, options?: Intl.NumberFormatOptions): string;
-export declare function getMeasurementAsParts(measurement: Measurement, locale?: string, options?: Intl.NumberFormatOptions): Intl.NumberFormatPart[];

package/dist/esnext/utilities/measurement.js

@@ -1,98 +0,0 @@
-const UNIT_MAPPING = {
-    // Dimension
-    mm: 'millimeter',
-    cm: 'centimeter',
-    m: 'meter',
-    in: 'inch',
-    ft: 'foot',
-    yd: 'yard',
-    // Volume
-    ml: 'milliliter',
-    l: 'liter',
-    us_fl_oz: 'fluid-ounce',
-    us_gal: 'gallon',
-    // Weight
-    kg: 'kilogram',
-    g: 'gram',
-    lb: 'pound',
-    oz: 'ounce',
-};
-export function getMeasurementAsString(measurement, locale = 'en-us', options = {}) {
-    let measure = {
-        value: measurement.value,
-        unit: UNIT_MAPPING[measurement.unit],
-    };
-    if (measure.unit == null) {
-        measure = convertToSupportedUnit(measurement.value, measurement.unit);
-    }
-    return new Intl.NumberFormat(locale, {
-        ...options,
-        unit: measure.unit,
-        style: 'unit',
-    }).format(measure.value);
-}
-export function getMeasurementAsParts(measurement, locale = 'en-us', options = {}) {
-    let measure = {
-        value: measurement.value,
-        unit: UNIT_MAPPING[measurement.unit],
-    };
-    if (measure.unit == null) {
-        measure = convertToSupportedUnit(measurement.value, measurement.unit);
-    }
-    return new Intl.NumberFormat(locale, {
-        ...options,
-        unit: measure.unit,
-        style: 'unit',
-    }).formatToParts(measure.value);
-}
-function convertToSupportedUnit(value, unit) {
-    switch (unit) {
-        case 'cl':
-            return {
-                value: value / 1000,
-                unit: 'liter',
-            };
-        case 'm3':
-            return {
-                value: value * 1000,
-                unit: 'liter',
-            };
-        case 'us_pt':
-            return {
-                value: value * 0.125,
-                unit: 'gallon',
-            };
-        case 'us_qt':
-            return {
-                value: value * 0.5,
-                unit: 'gallon',
-            };
-        case 'us_oz':
-            return {
-                value: value / 128,
-                unit: 'gallon',
-            };
-        case 'imp_pt':
-            return {
-                value: value / 6.661,
-                unit: 'gallon',
-            };
-        case 'imp_qt':
-            return {
-                value: value / 3.331,
-                unit: 'gallon',
-            };
-        case 'imp_gal':
-            return {
-                value: value / 1.201,
-                unit: 'gallon',
-            };
-        case 'imp_fl_oz':
-            return {
-                value: value * 0.96076,
-                unit: 'fluid-ounce',
-            };
-        default:
-            throw new Error(`Unit not supported: ${unit}`);
-    }
-}

package/dist/esnext/utilities/object.d.ts

@@ -1,5 +0,0 @@
-declare type Descriptor = Parameters<typeof Object.defineProperty>[2];
-export declare function createObject<T extends {} = object>(properties: T, { prototype, ...descriptor }?: {
-    prototype?: any;
-} & Exclude<Descriptor, 'value'>): T;
-export {};

package/dist/esnext/utilities/object.js

@@ -1,7 +0,0 @@
-// Create objects with null prototypes for faster access
-export function createObject(properties, { prototype = null, ...descriptor } = {}) {
-    return Object.create(prototype, Object.entries(properties).reduce((acc, [key, value]) => {
-        acc[key] = { enumerable: true, ...descriptor, value };
-        return acc;
-    }, {}));
-}

package/dist/esnext/utilities/parse.d.ts

@@ -1,2 +0,0 @@
-export declare function parseJSON(json: any): any;
-export declare function parseState(url: URL): Record<string, any> | undefined;

package/dist/esnext/utilities/parse.js

@@ -1,28 +0,0 @@
-import { RSC_PATHNAME } from '../constants.js';
-export function parseJSON(json) {
-    if (String(json).includes('__proto__'))
-        return JSON.parse(json, noproto);
-    return JSON.parse(json);
-}
-function noproto(k, v) {
-    if (k !== '__proto__')
-        return v;
-}
-export function parseState(url) {
-    try {
-        const { pathname, search } = url;
-        const stateParam = url.searchParams.get('state');
-        const state = pathname === RSC_PATHNAME
-            ? stateParam
-                ? parseJSON(decodeURIComponent(stateParam))
-                : {}
-            : {
-                pathname: decodeURIComponent(pathname),
-                search: decodeURIComponent(search),
-            };
-        return state;
-    }
-    catch {
-        // Do not throw to prevent unhandled errors
-    }
-}

package/dist/esnext/utilities/parseMetafield/index.d.ts

@@ -1 +0,0 @@
-export { parseMetafield, parseMetafieldValue } from './parseMetafield.js';

package/dist/esnext/utilities/parseMetafield/index.js

@@ -1 +0,0 @@
-export { parseMetafield, parseMetafieldValue } from './parseMetafield.js';

package/dist/esnext/utilities/parseMetafield/parseMetafield.d.ts

@@ -1,15 +0,0 @@
-import type { Metafield } from '../../storefront-api-types.js';
-import type { ParsedMetafield } from '../../types.js';
-import type { PartialDeep } from 'type-fest';
-/**
- * The `parseMetafield` utility transforms a [Metafield](https://shopify.dev/api/storefront/reference/common-objects/Metafield)
- * into a new object whose `values` have been parsed according to the metafield `type`.
- * If the metafield is `null`, then it returns `null` back.
- */
-export declare function parseMetafield(
-/** A [Metafield](https://shopify.dev/api/storefront/reference/common-objects/Metafield) or null */
-metafield: PartialDeep<Metafield> | null): PartialDeep<ParsedMetafield> | null;
-/**
- * The `parseMetafieldValue` function parses a [Metafield](https://shopify.dev/api/storefront/reference/common-objects/metafield)'s `value` from a string into a sensible type corresponding to the [Metafield](https://shopify.dev/api/storefront/reference/common-objects/metafield)'s `type`.
- */
-export declare function parseMetafieldValue(metafield: PartialDeep<Metafield> | null): ParsedMetafield['value'];

package/dist/esnext/utilities/parseMetafield/parseMetafield.js

@@ -1,62 +0,0 @@
-import { parseJSON } from '../parse.js';
-/**
- * The `parseMetafield` utility transforms a [Metafield](https://shopify.dev/api/storefront/reference/common-objects/Metafield)
- * into a new object whose `values` have been parsed according to the metafield `type`.
- * If the metafield is `null`, then it returns `null` back.
- */
-export function parseMetafield(
-/** A [Metafield](https://shopify.dev/api/storefront/reference/common-objects/Metafield) or null */
-metafield) {
-    if (!metafield) {
-        return null;
-    }
-    if (__HYDROGEN_DEV__ &&
-        (metafield.value === null || metafield.value === undefined)) {
-        console.warn(`'parseMetafield()' was passed ${metafield.value} for 'metafield.value'`);
-    }
-    return {
-        ...metafield,
-        value: parseMetafieldValue(metafield),
-    };
-}
-/**
- * The `parseMetafieldValue` function parses a [Metafield](https://shopify.dev/api/storefront/reference/common-objects/metafield)'s `value` from a string into a sensible type corresponding to the [Metafield](https://shopify.dev/api/storefront/reference/common-objects/metafield)'s `type`.
- */
-export function parseMetafieldValue(metafield) {
-    if (!metafield) {
-        return null;
-    }
-    if (metafield.value === null || metafield.value === undefined) {
-        if (__HYDROGEN_DEV__) {
-            console.warn(`'parseMetafieldValue()' was passed ${metafield.value} for 'metafield.value'`);
-        }
-        return metafield.value;
-    }
-    switch (metafield.type) {
-        case 'boolean':
-            return metafield.value === 'true';
-        case 'number_integer':
-            return parseInt(metafield.value);
-        case 'number_decimal':
-            return parseFloat(metafield.value);
-        case 'date':
-        case 'date_time':
-            return new Date(metafield.value);
-        case 'json':
-        case 'weight':
-        case 'dimension':
-        case 'volume':
-        case 'rating':
-            return parseJSON(metafield.value);
-        case 'color':
-        case 'single_line_text_field':
-        case 'multi_line_text_field':
-        case 'product_reference':
-        case 'page_reference':
-        case 'variant_reference':
-        case 'file_reference':
-        case 'url':
-        default:
-            return metafield.value;
-    }
-}

package/dist/esnext/utilities/random.d.ts

@@ -1 +0,0 @@
-export declare function generateUUID(): string;

package/dist/esnext/utilities/random.js

@@ -1,11 +0,0 @@
-/*
- * Generate a UUID using crypto and fallback to Math.random if crypto is not available.
- */
-export function generateUUID() {
-    if (typeof crypto !== 'undefined' && !!crypto.randomUUID) {
-        return crypto.randomUUID();
-    }
-    else {
-        return `weak-${Math.random().toString(16).substring(2)}`;
-    }
-}

package/dist/esnext/utilities/storefrontApi.d.ts

@@ -1,8 +0,0 @@
-export declare function getStorefrontApiRequestHeaders({ buyerIp, publicStorefrontToken, privateStorefrontToken, storefrontId, }: {
-    buyerIp?: string | null;
-    publicStorefrontToken: string;
-    privateStorefrontToken: string | undefined;
-    storefrontId: string | undefined;
-}): Record<string, any>;
-export declare function getOxygenVariable(key: string): any;
-export declare function getOnlineStorefrontHeaders(request: Request, origin: string): Headers;

package/dist/esnext/utilities/storefrontApi.js

@@ -1,63 +0,0 @@
-/* global Oxygen */
-import { OXYGEN_SECRET_TOKEN_ENVIRONMENT_VARIABLE, STOREFRONT_API_SECRET_TOKEN_HEADER, STOREFRONT_API_PUBLIC_TOKEN_HEADER, STOREFRONT_API_BUYER_IP_HEADER, SHOPIFY_STOREFRONT_ID_VARIABLE, SHOPIFY_STOREFRONT_ID_HEADER, } from '../constants.js';
-import { log } from './log/log.js';
-let secretTokenWarned = false;
-let storefrontIdWarned = false;
-export function getStorefrontApiRequestHeaders({ buyerIp, publicStorefrontToken, privateStorefrontToken, storefrontId, }) {
-    const headers = {};
-    if (!privateStorefrontToken) {
-        privateStorefrontToken = getOxygenVariable(OXYGEN_SECRET_TOKEN_ENVIRONMENT_VARIABLE);
-        if (!secretTokenWarned) {
-            secretTokenWarned = true;
-            if (!privateStorefrontToken && !__HYDROGEN_DEV__) {
-                log.error('No secret Shopify storefront API token was defined. This means your app will be rate limited!\nSee how to add the token: ');
-            }
-            else if (privateStorefrontToken) {
-                log.warn('The private shopify storefront API token was loaded implicitly by an environment variable. This is deprecated, and instead the variable should be defined directly in the Hydrogen Config.\nFor more information: https://shopify.dev/custom-storefronts/hydrogen/configuration');
-            }
-        }
-    }
-    if (!storefrontId) {
-        storefrontId = getOxygenVariable(SHOPIFY_STOREFRONT_ID_VARIABLE);
-        if (!storefrontIdWarned) {
-            storefrontIdWarned = true;
-            if (storefrontId) {
-                log.warn('The storefrontId was loaded implicitly by an environment variable. This is deprecated, and instead the variable should be defined directly in the Hydrogen Config.\nFor more information: https://shopify.dev/custom-storefronts/hydrogen/configuration');
-            }
-        }
-    }
-    /**
-     * Only pass one type of storefront token at a time.
-     */
-    if (privateStorefrontToken) {
-        headers[STOREFRONT_API_SECRET_TOKEN_HEADER] = privateStorefrontToken;
-    }
-    else {
-        headers[STOREFRONT_API_PUBLIC_TOKEN_HEADER] = publicStorefrontToken;
-    }
-    if (buyerIp) {
-        headers[STOREFRONT_API_BUYER_IP_HEADER] = buyerIp;
-    }
-    if (storefrontId) {
-        headers[SHOPIFY_STOREFRONT_ID_HEADER] = storefrontId;
-    }
-    return headers;
-}
-export function getOxygenVariable(key) {
-    return typeof Oxygen !== 'undefined' ? Oxygen?.env?.[key] : null;
-}
-export function getOnlineStorefrontHeaders(request, origin) {
-    const clientIP = request.headers.get('X-Shopify-Client-IP');
-    const clientIPSig = request.headers.get('X-Shopify-Client-IP-Sig');
-    const headers = new Headers();
-    for (const [key, value] of request.headers.entries()) {
-        headers.append(key, swapHostname(value, { hostname: new URL(request.url).host, origin }));
-    }
-    if (!__HYDROGEN_DEV__ && (!clientIP || !clientIPSig)) {
-        log.warn('Proxying the online store is only available in Oxygen. This request is likely to be throttled.');
-    }
-    return headers;
-}
-function swapHostname(str, { hostname, origin }) {
-    return str.replaceAll(hostname, origin);
-}

package/dist/esnext/utilities/suspense.d.ts

@@ -1,12 +0,0 @@
-import { QueryKey } from '../types.js';
-/**
- * Wrap the fetch promise in a way that React Suspense understands.
- * Essentially, keep throwing something until you have legit data.
- */
-export declare function wrapPromise<T>(promise: Promise<T>): {
-    read: () => T;
-};
-declare type Await<T> = T extends Promise<infer V> ? V : never;
-export declare const suspendFunction: <Fn extends () => Promise<unknown>>(key: QueryKey, fn: Fn) => Await<ReturnType<Fn>>;
-export declare const preloadFunction: (key: QueryKey, fn: () => Promise<unknown>) => unknown;
-export {};

package/dist/esnext/utilities/suspense.js

@@ -1,58 +0,0 @@
-import { hashKey } from './hash.js';
-/**
- * Wrap the fetch promise in a way that React Suspense understands.
- * Essentially, keep throwing something until you have legit data.
- */
-export function wrapPromise(promise) {
-    let status = 'pending';
-    let response;
-    const suspender = promise.then((res) => {
-        status = 'success';
-        response = res;
-    }, (err) => {
-        status = 'error';
-        response = err;
-    });
-    const read = () => {
-        switch (status) {
-            case 'pending':
-                throw suspender;
-            case 'error':
-                throw response;
-            default:
-                return response;
-        }
-    };
-    return { read };
-}
-const browserCache = {};
-/**
- * Perform an async function in a synchronous way for Suspense support.
- * To be used only in the client.
- * Inspired by https://github.com/pmndrs/suspend-react
- */
-function query(key, fn, preload = false) {
-    const stringKey = hashKey(key);
-    if (browserCache[stringKey]) {
-        const entry = browserCache[stringKey];
-        if (preload)
-            return undefined;
-        if (entry.error)
-            throw entry.error;
-        if (entry.response)
-            return entry.response;
-        if (!preload)
-            throw entry.promise;
-    }
-    const entry = {
-        promise: fn()
-            .then((response) => (entry.response = response))
-            .catch((error) => (entry.error = error)),
-    };
-    browserCache[stringKey] = entry;
-    if (!preload)
-        throw entry.promise;
-    return undefined;
-}
-export const suspendFunction = (key, fn) => query(key, fn);
-export const preloadFunction = (key, fn) => query(key, fn, true);

package/dist/esnext/utilities/template.d.ts

@@ -1,10 +0,0 @@
-export declare function getTemplate(indexTemplate: string | ((url: string) => Promise<string | {
-    default: string;
-}>), url?: URL): Promise<{
-    noScriptTemplate: string;
-    bootstrapScripts: string[];
-    bootstrapModules: string[];
-    raw: string;
-    linkHeader: string;
-}>;
-export declare type TemplateParts = Awaited<ReturnType<typeof getTemplate>>;