@asteby/storefront-react 0.0.0-stage → 0.1.1

package/dist/index.d.ts

@@ -0,0 +1,484 @@
+import * as react from 'react';
+import { ReactNode, ComponentPropsWithoutRef, ElementType, ComponentType } from 'react';
+import { StorefrontClient, Shop, StorefrontClientOptions, Cart, CartLineInput, CartLineMerchandise, CartLineUpdateInput, CartBuyerInput, AddressInput, DeliveryInput, DeliveryOptions, Image as Image$1, FormatMoneyOptions, Money as Money$1, Product, ProductVariant, Collection, Section, Theme } from '@asteby/storefront';
+
+type StorefrontContextValue = {
+    /** Client for browser-side calls (use a public `pk_` token). */
+    client: StorefrontClient | null;
+    shop: Shop | null;
+    /** BCP 47 locale used for formatting (defaults to `shop.locale`, then `es-MX`). */
+    locale: string;
+    /** ISO 4217 currency (defaults to `shop.currency_code`, then `MXN`). */
+    currency: string;
+};
+type StorefrontProviderProps = {
+    /** A ready client. Takes precedence over `config`. */
+    client?: StorefrontClient;
+    /** Options to create the browser client (use a `pk_` token). */
+    config?: StorefrontClientOptions;
+    /** Shop info loaded on the server (root loader). */
+    shop?: Shop | null;
+    locale?: string;
+    currency?: string;
+    children?: ReactNode;
+};
+/**
+ * Makes the storefront client, shop, locale and currency available to the
+ * tree. SSR-safe: creating the client does not touch `window`.
+ */
+declare function StorefrontProvider({ client, config, shop, locale, currency, children }: StorefrontProviderProps): react.JSX.Element;
+/** Storefront context. Throws outside `<StorefrontProvider>`. */
+declare function useStorefront(): StorefrontContextValue;
+/** Storefront context or `null` outside a provider (for components that work standalone). */
+declare function useOptionalStorefront(): StorefrontContextValue | null;
+/** The client from context; throws when the provider has none. */
+declare function useStorefrontClient(): StorefrontClient;
+
+/** Default name of the cookie that holds the cart id. */
+declare const CART_COOKIE_NAME = "sf_cart";
+type CartCookieOptions = {
+    /** Cookie name (default `sf_cart`). */
+    name?: string;
+    /** Lifetime in days (default 30). */
+    maxAgeDays?: number;
+    path?: string;
+    domain?: string;
+    sameSite?: 'Lax' | 'Strict' | 'None';
+    /** Defaults to true on https pages / when `sameSite` is `None`. */
+    secure?: boolean;
+};
+/**
+ * Reads the cart id from a `Cookie` header. Use it in SSR loaders:
+ * `getCartIdFromCookie(request.headers.get('Cookie'))`.
+ */
+declare function getCartIdFromCookie(cookieHeader: string | null | undefined, name?: string): string | null;
+/**
+ * Serializes the cart cookie for a `Set-Cookie` header (SSR actions) or for
+ * `document.cookie`. Pass `null` to clear it.
+ */
+declare function serializeCartCookie(cartId: string | null, options?: CartCookieOptions): string;
+/** Browser-only: writes the cart cookie. No-op on the server. */
+declare function writeCartCookie(cartId: string | null, options?: CartCookieOptions): void;
+/** Browser-only: reads the cart cookie. `null` on the server. */
+declare function readCartCookie(name?: string): string | null;
+
+type CartLineAddInput = CartLineInput & {
+    /** Variant data for an instant optimistic line (otherwise only the count updates until the server answers). */
+    merchandise?: CartLineMerchandise;
+};
+type CartStatus = 'idle' | 'loading' | 'updating';
+type CartContextValue = {
+    cart: Cart | null;
+    cartId: string | null;
+    status: CartStatus;
+    /** Last mutation error (cleared on the next successful mutation). */
+    error: Error | null;
+    totalQuantity: number;
+    /** Adds lines, creating the cart on first use. Optimistic. */
+    addLines: (lines: CartLineAddInput[]) => Promise<Cart | null>;
+    /** Sets line quantities (`0` removes). Optimistic. */
+    updateLines: (lines: CartLineUpdateInput[]) => Promise<Cart | null>;
+    /** Removes lines. Optimistic. */
+    removeLines: (lineIds: string[]) => Promise<Cart | null>;
+    setDiscountCodes: (codes: string[]) => Promise<Cart | null>;
+    setBuyer: (buyer: CartBuyerInput) => Promise<Cart | null>;
+    setShippingAddress: (address: AddressInput) => Promise<Cart | null>;
+    setDelivery: (delivery: DeliveryInput) => Promise<Cart | null>;
+    deliveryOptions: () => Promise<DeliveryOptions | null>;
+    /** Reloads the cart from the API. */
+    refresh: () => Promise<Cart | null>;
+    /** Forgets the cart (clears state and cookie), e.g. after checkout. */
+    clear: () => void;
+};
+type CartProviderProps = {
+    /** Cart loaded in the SSR loader (hydrates without a client fetch). */
+    initialCart?: Cart | null;
+    /** Cart id known on the server when `initialCart` is not loaded. */
+    cartId?: string | null;
+    /** Client override (defaults to the `StorefrontProvider` client). */
+    client?: StorefrontClient;
+    /** Cookie settings for the persisted cart id (`sf_cart`). Pass `false` to disable the cookie. */
+    cookie?: CartCookieOptions | false;
+    /** Currency for the optimistic placeholder cart (defaults to the provider currency). */
+    currency?: string;
+    onError?: (error: Error) => void;
+    onCartChange?: (cart: Cart | null) => void;
+    children?: ReactNode;
+};
+/** Pure optimistic reducers (exported for tests and custom carts). */
+declare const optimisticCart: {
+    add(cart: Cart | null, input: CartLineAddInput[], currency: string): Cart;
+    update(cart: Cart | null, input: CartLineUpdateInput[]): Cart | null;
+    remove(cart: Cart | null, lineIds: string[]): Cart | null;
+};
+/**
+ * Holds the cart and exposes optimistic mutations. Mutations run one at a
+ * time in order; a failed one is rolled back without discarding the others.
+ * The cart id is persisted in the `sf_cart` cookie (read it in loaders with
+ * `getCartIdFromCookie`). No `window`/`document` access during render.
+ */
+declare function CartProvider({ initialCart, cartId: initialCartId, client: clientProp, cookie, currency: currencyProp, onError, onCartChange, children, }: CartProviderProps): react.JSX.Element;
+/** Cart state and actions. Throws outside `<CartProvider>`. */
+declare function useCart(): CartContextValue;
+/** Cart context or `null` outside a provider. */
+declare function useOptionalCart(): CartContextValue | null;
+
+type MoneyProps<As extends ElementType = 'span'> = FormatMoneyOptions & {
+    data: Money$1;
+    /** Element to render (default `span`). */
+    as?: As;
+    /** Overrides the provider locale. */
+    locale?: string;
+} & Omit<ComponentPropsWithoutRef<As>, 'children' | 'as'>;
+/** Formats `Money` with the provider locale (or `locale`). */
+declare function Money<As extends ElementType = 'span'>({ data, as, locale, withoutTrailingZeros, withoutCurrency, currencyDisplay, ...rest }: MoneyProps<As>): react.ReactElement<any, string | react.JSXElementConstructor<any>>;
+declare const DEFAULT_IMAGE_WIDTHS: readonly [320, 480, 640, 768, 1024, 1280, 1600];
+/** Builds the URL for one srcset width. */
+type ImageLoader = (src: string, width: number, height?: number) => string;
+/**
+ * Default loader: adds `?width=<w>` (the convention of most image CDNs and of
+ * the OPS image proxy). URLs that cannot be parsed are returned unchanged.
+ */
+declare const defaultImageLoader: ImageLoader;
+type ImageProps = Omit<ComponentPropsWithoutRef<'img'>, 'src' | 'srcSet' | 'width' | 'height'> & {
+    data: Image$1;
+    /** `sizes` attribute (default `100vw`). */
+    sizes?: string;
+    /** Candidate widths for `srcset` (capped at the intrinsic width when known). */
+    widths?: readonly number[];
+    /** URL builder per width (default adds `?width=`). Pass `null` to disable srcset. */
+    loader?: ImageLoader | null;
+    /** Above-the-fold image: eager loading and `fetchpriority="high"`. */
+    priority?: boolean;
+    /** Forces an aspect ratio, e.g. `1/1` or `4/3`, used for width/height and srcset heights. */
+    aspectRatio?: string;
+};
+/** Responsive `<img>` with `srcset`, lazy by default, intrinsic size to avoid layout shift. */
+declare function Image({ data, sizes, widths, loader, priority, aspectRatio, alt, loading, decoding, ...rest }: ImageProps): react.JSX.Element;
+type ProductPriceProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'> & {
+    product?: Pick<Product, 'price_range' | 'compare_at_price_range'> | null;
+    variant?: Pick<ProductVariant, 'price' | 'compare_at_price'> | null;
+    /** Prefix shown when the product has a price range and no variant is selected (default `Desde`). */
+    fromLabel?: ReactNode;
+    /** Accessible label for the compare-at price (default `Precio anterior`). */
+    compareAtLabel?: string;
+    locale?: string;
+    withoutTrailingZeros?: boolean;
+};
+/**
+ * Price with optional compare-at (strikethrough). With a `variant` it shows
+ * that variant; otherwise the product's minimum price (prefixed with
+ * `fromLabel` when prices vary).
+ */
+declare function ProductPrice({ product, variant, fromLabel, compareAtLabel, locale, withoutTrailingZeros, ...rest }: ProductPriceProps): react.JSX.Element | null;
+
+type ProductOptionValueState = {
+    value: string;
+    /** Part of the current selection. */
+    selected: boolean;
+    /** A variant with this value (and the other selected options) exists. */
+    exists: boolean;
+    /** That variant is available for sale. */
+    available: boolean;
+    /** The variant this value would select, if it exists. */
+    variant: ProductVariant | null;
+    /** Query string (`?Talla=M&Color=Rojo`) selecting this value, preserving other params. */
+    search: string;
+};
+type ProductOptionState = {
+    name: string;
+    values: ProductOptionValueState[];
+};
+type ProductOptionsState = {
+    options: ProductOptionState[];
+    selectedOptions: Record<string, string>;
+    /** Variant matching every selected option, or `null` while incomplete. */
+    selectedVariant: ProductVariant | null;
+    setOption: (name: string, value: string) => void;
+};
+type UseProductOptionsConfig = {
+    /** Current URL search params; option names are read as keys (`?Talla=M`), plus `variant=<id>`. */
+    searchParams?: URLSearchParams | string | null;
+    /** Select the first available variant when nothing is in the URL (default true). */
+    defaultToFirstAvailable?: boolean;
+    onChange?: (variant: ProductVariant | null, selectedOptions: Record<string, string>) => void;
+};
+type ProductLike = Pick<Product, 'options' | 'variants'> & {
+    id?: string;
+};
+/**
+ * Option → values matrix with availability, the selected variant (from the
+ * URL or local state) and links for each value. Pure React: works in SSR.
+ */
+declare function useProductOptions(product: ProductLike, config?: UseProductOptionsConfig): ProductOptionsState;
+type VariantSelectorRenderProps = {
+    option: ProductOptionState;
+    selectedVariant: ProductVariant | null;
+    selectedOptions: Record<string, string>;
+    setOption: (name: string, value: string) => void;
+};
+type VariantSelectorProps = UseProductOptionsConfig & {
+    product: ProductLike;
+    /** Called once per option; render the buttons/links for `option.values`. */
+    children: (props: VariantSelectorRenderProps) => ReactNode;
+};
+/**
+ * Render-prop variant picker. Example:
+ *
+ *   <VariantSelector product={product} searchParams={searchParams}>
+ *     {({ option }) => (
+ *       <fieldset>
+ *         <legend>{option.name}</legend>
+ *         {option.values.map((v) => (
+ *           <Link key={v.value} to={v.search} replace preventScrollReset aria-current={v.selected}
+ *                 aria-disabled={!v.available}>{v.value}</Link>
+ *         ))}
+ *       </fieldset>
+ *     )}
+ *   </VariantSelector>
+ */
+declare function VariantSelector({ product, children, ...config }: VariantSelectorProps): react.JSX.Element;
+/** Builds the optimistic cart-line merchandise for a product variant. */
+declare function toMerchandise(product: Pick<Product, 'handle' | 'title' | 'featured_image'>, variant: ProductVariant): CartLineMerchandise;
+type AddToCartButtonProps = Omit<ComponentPropsWithoutRef<'button'>, 'onClick'> & {
+    variantId: string | null | undefined;
+    quantity?: number;
+    /** Variant data for an instant optimistic cart line. */
+    merchandise?: CartLineMerchandise;
+    onAdded?: () => void;
+    onClick?: ComponentPropsWithoutRef<'button'>['onClick'];
+};
+/** Adds a variant to the cart via `useCart().addLines`. Disabled without a variant or while adding. */
+declare function AddToCartButton({ variantId, quantity, merchandise, onAdded, onClick, disabled, children, type, ...rest }: AddToCartButtonProps): react.JSX.Element;
+
+/**
+ * SEO helpers: pure functions returning meta descriptors (React Router v7
+ * `meta` export shape) and schema.org JSON-LD objects (`<JsonLd>` renders them).
+ * Nothing here touches the DOM, so it is safe in loaders and SSR.
+ */
+
+/** Same shape as React Router's `MetaDescriptor`. */
+type MetaDescriptor = {
+    title: string;
+} | {
+    name: string;
+    content: string;
+} | {
+    property: string;
+    content: string;
+} | {
+    tagName: 'link';
+    rel: string;
+    href: string;
+    [attr: string]: string;
+} | {
+    'script:ld+json': JsonLdObject | JsonLdObject[];
+};
+type JsonLdObject = {
+    '@context'?: string;
+    '@type': string | string[];
+    [key: string]: unknown;
+};
+type SeoMetaInput = {
+    title?: string | null;
+    description?: string | null;
+    /** Canonical absolute URL. */
+    url?: string | null;
+    image?: Image$1 | string | null;
+    /** `og:type` (default `website`). */
+    type?: string;
+    siteName?: string | null;
+    locale?: string | null;
+    noindex?: boolean;
+    /** Appended to the title as `Title | Suffix` unless already present. */
+    titleSuffix?: string | null;
+};
+/** Generic title/description/canonical/Open Graph/Twitter descriptors. */
+declare function seoMeta(input: SeoMetaInput): MetaDescriptor[];
+/** Product page descriptors (`og:type=product` and price tags). */
+declare function productMeta(product: Product, shop: Pick<Shop, 'name' | 'locale'> | null, url: string): MetaDescriptor[];
+/** Collection page descriptors. */
+declare function collectionMeta(collection: Collection, shop: Pick<Shop, 'name' | 'locale'> | null, url: string): MetaDescriptor[];
+/** schema.org `Product` with one `Offer` per variant. */
+declare function productJsonLd(product: Product, shop: Pick<Shop, 'name' | 'domain'> | null, url: string): JsonLdObject;
+/** schema.org `Organization` for the shop (logo, contact, url). */
+declare function organizationJsonLd(shop: Shop, url?: string): JsonLdObject;
+type LocalBusinessOptions = {
+    /** schema.org type (default `Store`), e.g. `AutoPartsStore`, `ClothingStore`. */
+    type?: string;
+    /** Shop URL fallback when `shop.domain` is empty. */
+    url?: string;
+    priceRange?: string;
+};
+/** One schema.org `LocalBusiness` (default `Store`) per shop branch. */
+declare function localBusinessJsonLd(shop: Shop, options?: LocalBusinessOptions): JsonLdObject[];
+type BreadcrumbItem = {
+    name: string;
+    url: string;
+};
+declare function breadcrumbJsonLd(items: BreadcrumbItem[]): JsonLdObject;
+type FaqItem = {
+    question: string;
+    answer: string;
+};
+declare function faqJsonLd(items: FaqItem[]): JsonLdObject;
+/** schema.org `CollectionPage` with an `ItemList` of the products shown. */
+declare function collectionJsonLd(collection: Collection, products: Pick<Product, 'handle' | 'title' | 'featured_image'>[], url: string, options?: {
+    productUrl?: (handle: string) => string;
+}): JsonLdObject;
+/**
+ * Serializes JSON-LD for a `<script>` tag, escaping `<`, `>`, `&` and line
+ * separators so the payload cannot close the tag or inject markup.
+ */
+declare function serializeJsonLd(data: unknown): string;
+
+type JsonLdProps = {
+    data: JsonLdObject | JsonLdObject[] | null | undefined;
+    nonce?: string;
+};
+/** Renders `<script type="application/ld+json">` safely (works in SSR). */
+declare function JsonLd({ data, nonce }: JsonLdProps): react.JSX.Element | null;
+
+type SectionPropKind = 'text' | 'textarea' | 'richtext' | 'number' | 'boolean' | 'url' | 'image' | 'color' | 'select' | 'collection' | 'product' | 'products' | 'list';
+type SectionPropSchema = {
+    label: string;
+    kind: SectionPropKind;
+    description?: string;
+    default?: unknown;
+    required?: boolean;
+    /** `select` choices. */
+    options?: readonly {
+        value: string;
+        label: string;
+    }[];
+    /** `number` bounds. */
+    min?: number;
+    max?: number;
+    /** `list` item schema. */
+    items?: SectionSchema;
+};
+type SectionSchema = {
+    readonly [prop: string]: SectionPropSchema;
+};
+type KindType<P extends SectionPropSchema> = P['kind'] extends 'number' ? number : P['kind'] extends 'boolean' ? boolean : P['kind'] extends 'products' ? string[] : P['kind'] extends 'list' ? P['items'] extends SectionSchema ? InferSectionProps<P['items']>[] : Record<string, unknown>[] : P['kind'] extends 'select' ? P['options'] extends readonly {
+    value: infer V;
+}[] ? V : string : string;
+type RequiredKeys<S extends SectionSchema> = {
+    [K in keyof S]: S[K]['required'] extends true ? K : 'default' extends keyof S[K] ? K : never;
+}[keyof S];
+/** Props type derived from a section schema (props with `default` or `required` are non-optional). */
+type InferSectionProps<S extends SectionSchema> = {
+    [K in RequiredKeys<S>]: KindType<S[K]>;
+} & {
+    [K in Exclude<keyof S, RequiredKeys<S>>]?: KindType<S[K]>;
+};
+type SectionComponentProps<P, C = unknown> = P & {
+    section: {
+        id: string;
+        type: string;
+    };
+    /** Arbitrary data passed to `<Sections context>` (e.g. loader data). */
+    context: C;
+};
+type SectionDefinition<P = Record<string, unknown>, C = any> = {
+    type: string;
+    label?: string;
+    description?: string;
+    schema: SectionSchema;
+    component: ComponentType<SectionComponentProps<P, C>>;
+};
+/**
+ * Declares a section. Prop types are inferred from the schema:
+ *
+ *   export const hero = defineSection({
+ *     type: 'hero',
+ *     label: 'Hero',
+ *     schema: {
+ *       title: { label: 'Título', kind: 'text', required: true },
+ *       cta_url: { label: 'Enlace', kind: 'url', default: '/' },
+ *     },
+ *     component: ({ title, cta_url }) => <section><h1>{title}</h1><a href={cta_url}>Ver</a></section>,
+ *   })
+ */
+declare function defineSection<const S extends SectionSchema, C = any>(definition: {
+    type: string;
+    label?: string;
+    description?: string;
+    schema: S;
+    component: ComponentType<SectionComponentProps<InferSectionProps<S>, C>>;
+}): SectionDefinition<InferSectionProps<S>, C>;
+type SectionPropError = {
+    prop: string;
+    message: string;
+};
+/**
+ * Validates raw props against a schema: merges defaults, coerces numeric
+ * strings, drops unknown props and replaces invalid values with the default.
+ */
+declare function resolveSectionProps(schema: SectionSchema, raw: Record<string, unknown> | null | undefined, path?: string): {
+    props: Record<string, unknown>;
+    errors: SectionPropError[];
+};
+/** JSON Schema (draft 2020-12) of a section, for the OPS editor (`section.schema.json`). */
+declare function sectionJsonSchema(definition: Pick<SectionDefinition, 'type' | 'label' | 'description' | 'schema'>): Record<string, unknown>;
+/** Map of section `type` → definition. */
+declare class SectionRegistry {
+    private readonly defs;
+    constructor(definitions?: readonly SectionDefinition<any, any>[]);
+    register(definition: SectionDefinition<any, any>): this;
+    get(type: string): SectionDefinition<any, any> | undefined;
+    has(type: string): boolean;
+    types(): string[];
+    definitions(): SectionDefinition<any, any>[];
+    /** JSON Schemas of every registered section, keyed by type. */
+    toJSONSchema(): Record<string, Record<string, unknown>>;
+}
+declare function createSectionRegistry(definitions?: readonly SectionDefinition<any, any>[]): SectionRegistry;
+type SectionsProps<C = unknown> = {
+    sections: readonly Section[] | null | undefined;
+    registry: SectionRegistry;
+    /** Passed to every section component as `context`. */
+    context?: C;
+    /** Rendered for unknown types (default: nothing). */
+    renderUnknown?: (section: Section) => ReactNode;
+    /** Called with validation problems (default: `console.warn` outside production). */
+    onInvalid?: (section: Section, errors: SectionPropError[]) => void;
+};
+/**
+ * Renders sections in order. Unknown types are skipped (with a dev warning),
+ * props are validated against the schema and defaults are merged; a section
+ * missing a required prop is skipped.
+ */
+declare function Sections<C = unknown>({ sections, registry, context, renderUnknown, onInvalid }: SectionsProps<C>): react.JSX.Element | null;
+
+type ThemeCssOptions = {
+    /** Selector that receives the variables (default `:root`). */
+    selector?: string;
+    /**
+     * Variable names for color tokens:
+     * `both` (default) → `--color-<name>` and `--<name>`;
+     * `color` → only `--color-<name>` (Tailwind 4); `metacore` → only `--<name>`.
+     */
+    naming?: 'both' | 'color' | 'metacore';
+    /** Fallback stack appended to every font (default system sans-serif). */
+    fontFallback?: string;
+};
+/** `primaryForeground`, `primary_foreground`, `--color-primary-foreground` → `primary-foreground`. */
+declare function tokenName(key: string): string;
+/** Rejects values that could escape the declaration or the `<style>` element. */
+declare function isSafeCssValue(value: string): boolean;
+/** CSS declarations (`--x:value`) for a theme, without selector. */
+declare function themeToCssVariables(theme: Partial<Theme> | null | undefined, options?: ThemeCssOptions): Record<string, string>;
+/** `:root{--color-primary:#0f766e;--primary:#0f766e;...}` from a content theme. */
+declare function themeToCss(theme: Partial<Theme> | null | undefined, options?: ThemeCssOptions): string;
+/** Google Fonts stylesheet URL for the theme fonts (or `null` when there are none). */
+declare function themeFontsHref(theme: Partial<Theme> | null | undefined, weights?: number[]): string | null;
+type ThemeStyleProps = ThemeCssOptions & {
+    theme: Partial<Theme> | null | undefined;
+    nonce?: string;
+    id?: string;
+};
+/** Emits the theme variables as a `<style>` (render it in `<head>` from the root route). */
+declare function ThemeStyle({ theme, nonce, id, ...options }: ThemeStyleProps): react.JSX.Element | null;
+
+export { AddToCartButton, type AddToCartButtonProps, type BreadcrumbItem, CART_COOKIE_NAME, type CartContextValue, type CartCookieOptions, type CartLineAddInput, CartProvider, type CartProviderProps, type CartStatus, DEFAULT_IMAGE_WIDTHS, type FaqItem, Image, type ImageLoader, type ImageProps, type InferSectionProps, JsonLd, type JsonLdObject, type JsonLdProps, type LocalBusinessOptions, type MetaDescriptor, Money, type MoneyProps, type ProductOptionState, type ProductOptionValueState, type ProductOptionsState, ProductPrice, type ProductPriceProps, type SectionComponentProps, type SectionDefinition, type SectionPropError, type SectionPropKind, type SectionPropSchema, SectionRegistry, type SectionSchema, Sections, type SectionsProps, type SeoMetaInput, type StorefrontContextValue, StorefrontProvider, type StorefrontProviderProps, type ThemeCssOptions, ThemeStyle, type ThemeStyleProps, type UseProductOptionsConfig, VariantSelector, type VariantSelectorProps, type VariantSelectorRenderProps, breadcrumbJsonLd, collectionJsonLd, collectionMeta, createSectionRegistry, defaultImageLoader, defineSection, faqJsonLd, getCartIdFromCookie, isSafeCssValue, localBusinessJsonLd, optimisticCart, organizationJsonLd, productJsonLd, productMeta, readCartCookie, resolveSectionProps, sectionJsonSchema, seoMeta, serializeCartCookie, serializeJsonLd, themeFontsHref, themeToCss, themeToCssVariables, toMerchandise, tokenName, useCart, useOptionalCart, useOptionalStorefront, useProductOptions, useStorefront, useStorefrontClient, writeCartCookie };