@replohq/sdk 2.5.0 → 2.7.0

package/_vendor/replo-utils/lib/object.mjs

@@ -1,4 +1,4 @@
-export { deepEqual, filterUndefined, forEachPrimitiveValue, omit, shallowEqual, toNullableIfDefined } from '../../../chunk-O4QBR4QC.mjs';
-import '../../../chunk-OPKMOW43.mjs';
-import '../../../chunk-ZPDXVFCR.mjs';
+export { deepEqual, filterUndefined, forEachPrimitiveValue, omit, shallowEqual, toNullableIfDefined } from '../../../chunk-DMJ5VUD6.mjs';
+import '../../../chunk-GNIXARC7.mjs';
+import '../../../chunk-JBCOJHZN.mjs';
 import '../../../chunk-UJCSKKID.mjs';

package/_vendor/schemas/contentCollection.d.ts

@@ -86,6 +86,7 @@ export declare const contentCollectionFieldTypeSchema: z.ZodEnum<{
 }>;
 export type ContentCollectionFieldType = z.infer<typeof contentCollectionFieldTypeSchema>;
 export declare const contentCollectionColorSchema: z.ZodEnum<{
+    blue: "blue";
     seashell: "seashell";
     yellow: "yellow";
     lightGreen: "lightGreen";
@@ -93,7 +94,6 @@ export declare const contentCollectionColorSchema: z.ZodEnum<{
     lightPink: "lightPink";
     magenta: "magenta";
     purple: "purple";
-    blue: "blue";
 }>;
 export declare const contentCollectionFieldSchema: z.ZodObject<{
     id: z.ZodString;
@@ -125,6 +125,7 @@ export declare const contentCollectionFileSchema: z.ZodObject<{
     description: z.ZodString;
     icon: z.ZodString;
     color: z.ZodEnum<{
+        blue: "blue";
         seashell: "seashell";
         yellow: "yellow";
         lightGreen: "lightGreen";
@@ -132,7 +133,6 @@ export declare const contentCollectionFileSchema: z.ZodObject<{
         lightPink: "lightPink";
         magenta: "magenta";
         purple: "purple";
-        blue: "blue";
     }>;
     tags: z.ZodArray<z.ZodString>;
     fields: z.ZodArray<z.ZodObject<{

package/_vendor/schemas/contentEntry.mjs

@@ -1,5 +1,5 @@
-export { CONTENT_MANAGED_ENTRY_VALUE_KEYS, contentEntryFrontmatterSchema, convertLegacyContentEntryDocument, getContentEntryFieldValidationIssues, getContentRenderableEntryValues, parseContentEntryDocument, serializeContentEntryDocument } from '../../chunk-TTEBDCWT.mjs';
+export { CONTENT_MANAGED_ENTRY_VALUE_KEYS, contentEntryFrontmatterSchema, convertLegacyContentEntryDocument, getContentEntryFieldValidationIssues, getContentRenderableEntryValues, parseContentEntryDocument, serializeContentEntryDocument } from '../../chunk-4YTXURVN.mjs';
 import '../../chunk-RQ76VK3L.mjs';
-import '../../chunk-XWWFRIXV.mjs';
-import '../../chunk-ZPDXVFCR.mjs';
+import '../../chunk-N4WC2Z43.mjs';
+import '../../chunk-JBCOJHZN.mjs';
 import '../../chunk-UJCSKKID.mjs';

package/_vendor/schemas/contentManifest.mjs

@@ -1,10 +1,10 @@
-import { parseContentEntryDocument, getContentRenderableEntryValues, getContentEntryFieldValidationIssues } from '../../chunk-TTEBDCWT.mjs';
+import { parseContentEntryDocument, getContentRenderableEntryValues, getContentEntryFieldValidationIssues } from '../../chunk-4YTXURVN.mjs';
 import { isValidContentSlug, CONTENT_COLLECTION_SCHEMA_FILENAME, CONTENT_ENTRY_FILE_EXTENSION, contentCollectionFileSchema, CONTENT_ENTRY_PUBLISHED_FILE_EXTENSION } from '../../chunk-RQ76VK3L.mjs';
-import '../../chunk-XWWFRIXV.mjs';
-import { parseJsonOrNull } from '../../chunk-PSYP2DYM.mjs';
-import '../../chunk-O4QBR4QC.mjs';
-import '../../chunk-OPKMOW43.mjs';
-import '../../chunk-ZPDXVFCR.mjs';
+import '../../chunk-N4WC2Z43.mjs';
+import { parseJsonOrNull } from '../../chunk-QYGRVXWQ.mjs';
+import '../../chunk-DMJ5VUD6.mjs';
+import '../../chunk-GNIXARC7.mjs';
+import '../../chunk-JBCOJHZN.mjs';
 import '../../chunk-UJCSKKID.mjs';
 import * as z from 'zod';
 

package/_vendor/schemas/routing/locale.d.ts

@@ -1,4 +1,4 @@
-import { ReploError } from "../errors";
+import { ReploError } from "../reploError";
 import * as z from "zod";
 export declare class LocaleRoutingValidationError extends ReploError {
 }

package/_vendor/schemas/routing/locale.mjs

@@ -1,9 +1,4 @@
-import '../../../chunk-XSMYSAKY.mjs';
 import { ReploError } from '../../../chunk-AE5H7AJS.mjs';
-import '../../../chunk-XGXJOHUY.mjs';
-import '../../../chunk-XWWFRIXV.mjs';
-import '../../../chunk-OPKMOW43.mjs';
-import '../../../chunk-ZPDXVFCR.mjs';
 import '../../../chunk-UJCSKKID.mjs';
 import * as z from 'zod';
 

package/_vendor/schemas/routing/rules.d.ts

@@ -1,4 +1,4 @@
-import { ReploError } from "../errors";
+import { ReploError } from "../reploError";
 import * as z from "zod";
 export declare class RedirectRuleValidationError extends ReploError {
 }

package/_vendor/schemas/routing/rules.mjs

@@ -1,10 +1,5 @@
 import { getParamSegment, getRouteParams, hasRouteParam, matchSource } from '../../../chunk-VPEVERWE.mjs';
-import '../../../chunk-XSMYSAKY.mjs';
 import { ReploError } from '../../../chunk-AE5H7AJS.mjs';
-import '../../../chunk-XGXJOHUY.mjs';
-import '../../../chunk-XWWFRIXV.mjs';
-import '../../../chunk-OPKMOW43.mjs';
-import '../../../chunk-ZPDXVFCR.mjs';
 import '../../../chunk-UJCSKKID.mjs';
 import * as z from 'zod';
 

package/analytics/pixel-meta.d.ts

@@ -0,0 +1,14 @@
+import * as v from "valibot";
+/** Name of the `<meta>` the published site worker appends with the pixel config. */
+export declare const PIXEL_META_NAME = "replo:pixel";
+declare const pixelConfigSchema: v.ObjectSchema<{
+    readonly pixelUrl: v.SchemaWithPipe<readonly [v.StringSchema<undefined>, v.MinLengthAction<string, 1, undefined>]>;
+    readonly apiUrl: v.SchemaWithPipe<readonly [v.StringSchema<undefined>, v.MinLengthAction<string, 1, undefined>]>;
+    readonly projectId: v.SchemaWithPipe<readonly [v.StringSchema<undefined>, v.MinLengthAction<string, 1, undefined>]>;
+    readonly siteVersion: v.SchemaWithFallback<v.OptionalSchema<v.SchemaWithPipe<readonly [v.StringSchema<undefined>, v.MinLengthAction<string, 1, undefined>]>, undefined>, undefined>;
+}, undefined>;
+export type PixelConfig = v.InferOutput<typeof pixelConfigSchema>;
+/** Parses the meta's JSON content; anything malformed means no pixel. */
+export declare function parsePixelMetaContent(content: string | null): PixelConfig | null;
+export declare function readPixelMetaContent(): string | null;
+export {};

package/analytics/pixel-meta.js

@@ -0,0 +1,28 @@
+import { parseJsonOrNull } from "../_vendor/replo-utils/lib/json.mjs";
+import * as v from "valibot";
+const PIXEL_META_NAME = "replo:pixel";
+const optionalNonEmptyString = v.fallback(
+  v.optional(v.pipe(v.string(), v.minLength(1))),
+  void 0
+);
+const pixelConfigSchema = v.object({
+  pixelUrl: v.pipe(v.string(), v.minLength(1)),
+  apiUrl: v.pipe(v.string(), v.minLength(1)),
+  projectId: v.pipe(v.string(), v.minLength(1)),
+  siteVersion: optionalNonEmptyString
+});
+function parsePixelMetaContent(content) {
+  if (!content) {
+    return null;
+  }
+  const result = v.safeParse(pixelConfigSchema, parseJsonOrNull(content));
+  return result.success ? result.output : null;
+}
+function readPixelMetaContent() {
+  return document.querySelector(`meta[name="${PIXEL_META_NAME}"]`)?.getAttribute("content") ?? null;
+}
+export {
+  PIXEL_META_NAME,
+  parsePixelMetaContent,
+  readPixelMetaContent
+};

package/analytics/replo-first-party-pixel.d.ts

@@ -5,8 +5,9 @@
  * first-party pixel automatically — mirroring how `ReploSink` is an always-on
  * sink that is never authored in the layout or editable in the miniapp.
  *
- * Renders nothing when the analytics pipeline isn't wired (e.g. lean local dev,
- * where `REPLO_ANALYTICS_PIXEL_URL` / `ANALYTICS_FIRE_API_URL` are unset),
- * mirroring the self-disabling consent action.
+ * Static pages are prerendered at build time, before the publish sets these
+ * vars, so without them it defers to `ReploPixelFromMeta`, which reads the
+ * config the published site worker adds to the served HTML. With neither (e.g.
+ * lean local dev) nothing loads, mirroring the self-disabling consent action.
  */
-export declare function ReploFirstPartyPixel(): Promise<import("react/jsx-runtime").JSX.Element | null>;
+export declare function ReploFirstPartyPixel(): Promise<import("react/jsx-runtime").JSX.Element>;

package/analytics/replo-first-party-pixel.js

@@ -1,27 +1,31 @@
 import { jsx } from "react/jsx-runtime";
 import { getEnv } from "../env";
+import { ReploPixelFromMeta } from "./replo-pixel-from-meta";
 import { ReploPixelScript } from "./replo-pixel-script";
 async function ReploFirstPartyPixel() {
   let pixelUrl;
   let apiUrl;
   let projectId;
+  let siteVersion;
   try {
     const env = await getEnv();
     pixelUrl = env.REPLO_ANALYTICS_PIXEL_URL;
     apiUrl = env.ANALYTICS_FIRE_API_URL;
     projectId = env.PROJECT_ID;
+    siteVersion = env.REPLO_SITE_VERSION;
   } catch {
-    return null;
+    return /* @__PURE__ */ jsx(ReploPixelFromMeta, {});
   }
   if (!pixelUrl || !apiUrl || !projectId) {
-    return null;
+    return /* @__PURE__ */ jsx(ReploPixelFromMeta, {});
   }
   return /* @__PURE__ */ jsx(
     ReploPixelScript,
     {
       pixelUrl,
       apiUrl,
-      projectId
+      projectId,
+      siteVersion
     }
   );
 }

package/analytics/replo-pixel-from-meta.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Client fallback for `ReploFirstPartyPixel` on pages prerendered without the
+ * pixel config: mounts the same consent-gated pixel from the `replo:pixel` meta
+ * the published site worker adds at serve time. Renders nothing during SSR and
+ * hydration, so server and client markup match.
+ */
+export declare function ReploPixelFromMeta(): import("react/jsx-runtime").JSX.Element | null;

package/analytics/replo-pixel-from-meta.js

@@ -0,0 +1,27 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useSyncExternalStore } from "react";
+import { parsePixelMetaContent, readPixelMetaContent } from "./pixel-meta";
+import { ReploPixelScript } from "./replo-pixel-script";
+function subscribeToNothing() {
+  return () => {
+  };
+}
+function getServerSnapshot() {
+  return null;
+}
+function ReploPixelFromMeta() {
+  const content = useSyncExternalStore(
+    subscribeToNothing,
+    readPixelMetaContent,
+    getServerSnapshot
+  );
+  const config = parsePixelMetaContent(content);
+  if (!config) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(ReploPixelScript, { ...config });
+}
+export {
+  ReploPixelFromMeta
+};

package/analytics/replo-pixel-script.d.ts

@@ -10,8 +10,10 @@
  * stamps the blocking attributes at mount time, since delegation is not yet
  * set here.
  */
-export declare function ReploPixelScript({ pixelUrl, apiUrl, projectId, }: {
+export declare function ReploPixelScript({ pixelUrl, apiUrl, projectId, siteVersion, }: {
     pixelUrl: string;
     apiUrl: string;
     projectId: string;
+    /** Publish id of the running site; absent on unpublished or older deploys. */
+    siteVersion?: string;
 }): import("react/jsx-runtime").JSX.Element | null;

package/analytics/replo-pixel-script.js

@@ -7,7 +7,8 @@ const PIXEL_REQUIRED_CONSENT = ["analytics"];
 function ReploPixelScript({
   pixelUrl,
   apiUrl,
-  projectId
+  projectId,
+  siteVersion
 }) {
   const isBlockedByNativeConsent = useIsBlockedByNativeConsent(
     PIXEL_REQUIRED_CONSENT
@@ -21,7 +22,8 @@ function ReploPixelScript({
       src: `${pixelUrl}/latest.js`,
       attributes: {
         "data-api-url": apiUrl,
-        "data-project-id": projectId
+        "data-project-id": projectId,
+        ...siteVersion ? { "data-site-version": siteVersion } : {}
       }
     }
   ];

package/cart/buy-now-action.d.ts

@@ -1,5 +1,6 @@
 import type { StorefrontCountryCode } from "../loaders/markets";
 import type { CartLineAttribute } from "./cart-types";
+import type { StripeCheckoutOutcome } from "./start-stripe-checkout";
 /**
  * Server action that handles the full buy-now flow:
  * 1. For Shopify: creates a cart via the canopy-api-backed gateway, returns checkoutUrl.
@@ -33,16 +34,4 @@ export declare function buyNowWithRecoveryAction(input: {
         value: string;
     }[];
     pageUrl: string;
-}): Promise<{
-    result: "created";
-    redirectUrl: string;
-} | {
-    result: "restartCheckout";
-    message: string;
-} | {
-    result: "outOfStock";
-    variants: {
-        variantId: string;
-        available: number;
-    }[];
-}>;
+}): Promise<StripeCheckoutOutcome>;

package/cart/buy-now-action.js

@@ -1,14 +1,12 @@
 "use server";
 import { headers } from "next/headers";
-import { v4 as uuidv4 } from "uuid";
-import * as z from "zod";
 import { getEnv } from "../env";
 import { CanopyError } from "../lib/canopy-error";
 import { getCheckoutProvider } from "../lib/integration-utils";
-import { buildBaseUrl } from "../lib/url-utils";
 import { createCartAction } from "./cart-actions";
 import { REPLO_ATTRIBUTION_PROPERTY } from "./cart-types";
 import { getReturnUrls } from "./return-urls";
+import { startStripeCheckout } from "./start-stripe-checkout";
 const REPLO_PROJECT_ID_KEY = "rpid";
 class BuyNowError extends CanopyError {
 }
@@ -23,19 +21,27 @@ async function buyNowAction(input) {
 }
 async function buyNowWithRecoveryAction(input) {
   const { lineItems, discountCodes, pageUrl } = input;
+  if (await getCheckoutProvider() === "stripe") {
+    return await startStripeCheckout({
+      checkoutAttemptId: input.checkoutAttemptId ?? null,
+      lineItems,
+      discountCodes,
+      pageUrl,
+      ui: { mode: "hosted" }
+    });
+  }
   const headersList = await headers();
   const host = headersList.get("host");
   if (!host) {
     throw new BuyNowError({ message: "Missing host header" });
   }
-  const { origin, cancelUrl } = getReturnUrls({
+  const { origin } = getReturnUrls({
     host,
     forwardedHost: headersList.get("x-forwarded-host"),
     forwardedProto: headersList.get("x-forwarded-proto"),
     requestOrigin: headersList.get("origin"),
     pageUrl
   });
-  const checkoutProvider = await getCheckoutProvider();
   const cartLines = lineItems.map((item) => {
     const hasReploAttribution = item.properties.some(
       (prop) => prop.key === REPLO_ATTRIBUTION_PROPERTY.key
@@ -48,76 +54,6 @@ async function buyNowWithRecoveryAction(input) {
       properties
     };
   });
-  if (checkoutProvider === "stripe") {
-    if (discountCodes.length > 0 || lineItems.some((lineItem) => Boolean(lineItem.sellingPlanId))) {
-      console.warn(
-        "[Replo] Stripe buy now does not support selling plans or discount codes; those options were ignored."
-      );
-    }
-    const env2 = await getEnv();
-    const temporaryCartId = input.checkoutAttemptId ?? uuidv4();
-    const body = {
-      cartId: temporaryCartId,
-      checkoutAttemptId: temporaryCartId,
-      lines: cartLines.map((line) => ({
-        variantId: line.id,
-        quantity: line.quantity,
-        properties: line.properties
-      })),
-      projectId: env2.PROJECT_ID,
-      successUrl: `${origin}/checkout/success`,
-      cancelUrl
-    };
-    const canopyApiUrl = `${buildBaseUrl(env2.CANOPY_API_HOST)}/api/v1/stripe-checkout/create-session`;
-    const response = await fetch(canopyApiUrl, {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify(body)
-    });
-    if (!response.ok) {
-      if (response.status === 409) {
-        const terminalAttempt = z.object({
-          error: z.literal("checkoutUnavailable"),
-          retry: z.literal("newAttempt"),
-          message: z.string().min(1)
-        }).safeParse(await response.json());
-        if (terminalAttempt.success) {
-          return {
-            result: "restartCheckout",
-            message: terminalAttempt.data.message
-          };
-        }
-      }
-      throw new BuyNowCartCreationError({
-        message: "Failed to create Stripe checkout session for buy now",
-        additionalData: {
-          status: response.status,
-          statusText: response.statusText
-        }
-      });
-    }
-    const payload = await response.json();
-    const outOfStock = z.object({
-      result: z.literal("outOfStock"),
-      variants: z.array(
-        z.object({
-          variantId: z.string(),
-          available: z.number().int().min(0)
-        })
-      )
-    }).safeParse(payload);
-    if (outOfStock.success) {
-      return { result: "outOfStock", variants: outOfStock.data.variants };
-    }
-    const created = z.object({ url: z.string() }).safeParse(payload);
-    if (!created.success) {
-      throw new BuyNowCartCreationError({
-        message: "Stripe checkout session response missing redirect URL",
-        cause: created.error
-      });
-    }
-    return { result: "created", redirectUrl: created.data.url };
-  }
   const cart = await createCartAction({
     lines: cartLines,
     skipStoringCart: true,

package/cart/checkout-actions.d.ts

@@ -0,0 +1,34 @@
+import type { CrossSell } from "../gateways/canopy-api";
+import type { CartLineAttribute } from "./cart-types";
+import type { StripeCheckoutOutcome } from "./start-stripe-checkout";
+/**
+ * Starts Stripe checkout on the site's own page: the outcome's `redirectUrl`
+ * opens `paymentPagePath` (a page built on `<CheckoutSessionProvider>` and
+ * `<StripePaymentForm />`) with the session in the URL fragment. Where canopy can't serve embedded checkout it
+ * returns Stripe's hosted page instead, and a store that doesn't check out
+ * through Stripe gets `buyNowWithRecoveryAction`'s redirect. Same outcomes as
+ * `buyNowWithRecoveryAction`, which keeps redirecting to the hosted page.
+ */
+export declare function createCheckoutSessionAction(input: {
+    checkoutAttemptId: string | null;
+    lineItems: {
+        variantId: string;
+        quantity: number;
+        sellingPlanId: string | null;
+        properties: CartLineAttribute[];
+    }[];
+    discountCodes: string[];
+    pageUrl: string;
+    /** Site path of the embedded checkout page, e.g. "/checkout/pay". */
+    paymentPagePath: string;
+}): Promise<StripeCheckoutOutcome>;
+/**
+ * Up to three live products from the store that aren't in the cart, newest
+ * first. Pass the cart's variant ids from a cart drawer, or the session id
+ * from embedded checkout (which also leaves out items that session can't
+ * take). Empty when the store isn't checking out through Stripe.
+ */
+export declare function getCrossSellsAction(input: {
+    excludeVariantIds: string[];
+    sessionId: string | null;
+}): Promise<CrossSell[]>;

package/cart/checkout-actions.js

@@ -0,0 +1,27 @@
+"use server";
+import { getCanopyApiGateway } from "../gateways/canopy-api";
+import { getCheckoutProvider } from "../lib/integration-utils";
+import { buyNowWithRecoveryAction } from "./buy-now-action";
+import { startStripeCheckout } from "./start-stripe-checkout";
+async function createCheckoutSessionAction(input) {
+  if (await getCheckoutProvider() !== "stripe") {
+    return await buyNowWithRecoveryAction({
+      ...input,
+      checkoutAttemptId: input.checkoutAttemptId ?? void 0
+    });
+  }
+  return await startStripeCheckout({
+    ...input,
+    ui: { mode: "form", paymentPagePath: input.paymentPagePath }
+  });
+}
+async function getCrossSellsAction(input) {
+  if (await getCheckoutProvider() !== "stripe") {
+    return [];
+  }
+  return await (await getCanopyApiGateway()).findCrossSells(input);
+}
+export {
+  createCheckoutSessionAction,
+  getCrossSellsAction
+};

package/cart/checkout-appearance.d.ts

@@ -0,0 +1,35 @@
+import type { Appearance, CssFontSource } from "@stripe/stripe-js";
+/**
+ * Stripe's Checkout Form takes Appearance variables only (it ignores
+ * `rules`), and its color variables reject oklch, rgba and var(). Sites
+ * built from Replo templates define their palette as oklch CSS custom
+ * properties, so these helpers read the computed tokens and hand Stripe hex.
+ */
+type Rgb = {
+    red: number;
+    green: number;
+    blue: number;
+    alpha: number;
+};
+export declare function rgbToHex({ red, green, blue }: Rgb): string;
+export declare function blendOver(color: Rgb, background: Rgb): Rgb;
+export declare function relativeLuminance({ red, green, blue }: Rgb): number;
+/**
+ * The site's first named font as a Google Fonts stylesheet. Stripe's form runs
+ * in its own frame, so it can only use a font it can load from a URL; a font
+ * that isn't on Google Fonts falls back to Stripe's system stack.
+ */
+export declare function googleFontSource(fontFamily: string): {
+    family: string;
+    source: CssFontSource;
+} | null;
+/**
+ * Stripe Appearance built from the site's design tokens (--primary,
+ * --background, --foreground, --muted-foreground, --destructive, --border,
+ * --radius) and body font, so the form looks like the rest of the store.
+ */
+export declare function readSiteCheckoutAppearance(): {
+    appearance: Appearance;
+    fonts: CssFontSource[];
+};
+export {};

package/cart/checkout-appearance.js

@@ -0,0 +1,131 @@
+const GENERIC_FONT_FAMILIES = /* @__PURE__ */ new Set([
+  "serif",
+  "sans-serif",
+  "monospace",
+  "cursive",
+  "fantasy",
+  "system-ui",
+  "ui-sans-serif",
+  "ui-serif",
+  "ui-monospace",
+  "-apple-system",
+  "blinkmacsystemfont"
+]);
+function toHexByte(value) {
+  return Math.round(value).toString(16).padStart(2, "0");
+}
+function rgbToHex({ red, green, blue }) {
+  return `#${toHexByte(red)}${toHexByte(green)}${toHexByte(blue)}`;
+}
+function blendOver(color, background) {
+  const alpha = color.alpha;
+  return {
+    red: color.red * alpha + background.red * (1 - alpha),
+    green: color.green * alpha + background.green * (1 - alpha),
+    blue: color.blue * alpha + background.blue * (1 - alpha),
+    alpha: 1
+  };
+}
+function relativeLuminance({ red, green, blue }) {
+  const channel = (value) => {
+    const scaled = value / 255;
+    return scaled <= 0.03928 ? scaled / 12.92 : ((scaled + 0.055) / 1.055) ** 2.4;
+  };
+  return 0.2126 * channel(red) + 0.7152 * channel(green) + 0.0722 * channel(blue);
+}
+function googleFontSource(fontFamily) {
+  const family = fontFamily.split(",").map((name) => name.trim().replace(/^["']|["']$/g, "")).find((name) => {
+    return name.length > 0 && !name.startsWith("__") && !name.toLowerCase().endsWith(" fallback") && !GENERIC_FONT_FAMILIES.has(name.toLowerCase());
+  });
+  if (!family) {
+    return null;
+  }
+  const query = encodeURIComponent(family).replace(/%20/g, "+");
+  return {
+    family,
+    source: {
+      cssSrc: `https://fonts.googleapis.com/css2?family=${query}:wght@400;500;600&display=swap`
+    }
+  };
+}
+const UNPARSED_SENTINEL = "#010203";
+function parseCssColor(value, context) {
+  if (!value) {
+    return null;
+  }
+  context.clearRect(0, 0, 1, 1);
+  context.fillStyle = UNPARSED_SENTINEL;
+  context.fillStyle = value;
+  if (context.fillStyle === UNPARSED_SENTINEL && value.trim().toLowerCase() !== UNPARSED_SENTINEL) {
+    return null;
+  }
+  context.fillRect(0, 0, 1, 1);
+  const [red = 0, green = 0, blue = 0, alpha = 0] = context.getImageData(
+    0,
+    0,
+    1,
+    1
+  ).data;
+  return { red, green, blue, alpha: alpha / 255 };
+}
+function cssLengthToPixels(value, rootFontSizePx) {
+  const match = /^(-?\d*\.?\d+)(rem|px)?$/.exec(value.trim());
+  if (!match) {
+    return null;
+  }
+  const amount = Number(match[1]);
+  return match[2] === "rem" ? amount * rootFontSizePx : amount;
+}
+function readSiteCheckoutAppearance() {
+  const root = document.documentElement;
+  const styles = getComputedStyle(root);
+  const canvas = document.createElement("canvas");
+  canvas.width = 1;
+  canvas.height = 1;
+  const context = canvas.getContext("2d", { willReadFrequently: true });
+  const token = (name) => styles.getPropertyValue(name).trim();
+  const background = context ? parseCssColor(token("--background"), context) : null;
+  const opaqueBackground = background ? blendOver(background, { red: 255, green: 255, blue: 255, alpha: 1 }) : { red: 255, green: 255, blue: 255, alpha: 1 };
+  const hex = (name) => {
+    const color = context ? parseCssColor(token(name), context) : null;
+    return color ? rgbToHex(blendOver(color, opaqueBackground)) : void 0;
+  };
+  const rootFontSizePx = Number.parseFloat(styles.fontSize) || 16;
+  const radiusPx = cssLengthToPixels(token("--radius"), rootFontSizePx);
+  const font = googleFontSource(getComputedStyle(document.body).fontFamily);
+  const colors = [
+    ["colorPrimary", hex("--primary")],
+    ["buttonColorBackground", hex("--primary")],
+    ["buttonColorText", hex("--primary-foreground")],
+    ["colorBackground", rgbToHex(opaqueBackground)],
+    ["colorText", hex("--foreground")],
+    ["colorTextSecondary", hex("--muted-foreground")],
+    ["colorDanger", hex("--destructive")],
+    ["inputColorBorder", hex("--border")]
+  ];
+  const variables = {
+    fontSizeBase: "16px",
+    ...radiusPx === null ? {} : { borderRadius: `${radiusPx}px` },
+    ...font ? { fontFamily: `${font.family}, system-ui, sans-serif` } : {}
+  };
+  for (const [name, value] of colors) {
+    if (value !== void 0) {
+      variables[name] = value;
+    }
+  }
+  return {
+    appearance: {
+      theme: relativeLuminance(opaqueBackground) < 0.4 ? "night" : "stripe",
+      inputs: "spaced",
+      variables
+    },
+    fonts: font ? [font.source] : []
+  };
+}
+export {
+  blendOver,
+  googleFontSource,
+  readSiteCheckoutAppearance,
+  relativeLuminance,
+  rgbToHex
+};