@zappie/sdk 0.1.16 → 0.1.18

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @zappie/sdk
 
+## 0.1.18
+
+### Patch Changes
+
+- f0c08ed: Open checkout over the page. `embedCheckout()` from `@zappie/sdk/checkout/embed` frames a checkout session as a modal on desktop or a bottom sheet on mobile, and redirects in in-app browsers and framed pages. Back and Escape ask the checkout to step back or close, and once a payment has started the checkout asks the shopper before it closes. A completed result waits for the server to confirm the session, and a completed session can't be reopened. `resumeCheckout()` drops a stale checkout entry from the address without reopening it. `useCheckout()` from `@zappie/sdk/checkout/react` creates the session and opens it.
+
+## 0.1.17
+
+### Patch Changes
+
+- a151b0b: `@zappie/sdk/server` adds the menu snapshot types and helpers that edge menu reads are built on. `MenuSnapshot` wraps the SDK `Menu` that `menu.get()` returns, with the store, the branch, the API's menu version and a `contentHash`. `StoreSnapshot` wraps the SDK `Store`, and `AvailabilityPatch` lists the items, variants and choices that sold out since the menu was built.
+
+  - `canonicalJson()` writes a value with sorted keys, so equal values give the same text. `snapshotHash()` returns the first 16 hex digits of its SHA-256.
+  - `createMenuSnapshot()` builds a snapshot from a complete menu and refuses a partial one. `menuSnapshotFromPayload()` maps the API's menu payload with the same mapper `menu.get()` uses.
+  - `createStoreSnapshot()` and `createAvailabilityPatch()` build the other two. A patch's ids are sorted and unique, so equal patches hash the same.
+  - `applyAvailability()` returns the snapshot's menu with a patch applied, and ignores a patch older than the snapshot.
+  - `isMenuSnapshot()` checks a value read back from storage, and `snapshotKeys` names the storage keys.
+
+- 195a5b8: `@zappie/sdk/server` adds the building blocks for signing customers in on a site you host yourself. They use Web Crypto only, so they run in Workers and Node 20 or later.
+
+  - `createPkce()` returns a PKCE verifier and its S256 challenge. `randomToken()` returns a random URL-safe value for state, nonces and ids.
+  - `sealValue()` and `openSealedValue()` keep a JSON value in an AES-GCM sealed string. Pass several secrets to rotate: the first seals and any of them opens. A `purpose` binds the value to one use. Without one, the format matches Zappie's hosted sign-in.
+  - `createTokenVerifier({ issuer, audience })` verifies RS256 and ES256 tokens against the issuer's keys at `<issuer>/.well-known/jwks.json`, or a `jwksUrl` you set. It caches the keys for an hour, reads them again once when a token names a new key, and keeps the last good keys while the issuer is down. While the issuer is down and no keys are cached, it reads them at most every 30 seconds, and a set with no usable keys never replaces good ones. It checks the issuer (a trailing slash on either side is ignored), the audience, the expiry with 60 seconds of leeway, `nbf`, `iat`, the nonce you pass and a required `cus_` subject. `verifyIdToken(token, { nonce })` needs the nonce and a subject, and refuses a token whose `typ` names another kind, such as an access token. A refused token throws `ZappieTokenError` with a `reason`.
+  - `SessionStore` is the interface every session store implements. `cookieSessionStore({ secret })` keeps the whole session sealed in the cookie for up to 30 days. It can't end sessions from the server, so its `deleteBySub` rejects, and signing out doesn't invalidate a copied cookie before it expires.
+
 ## 0.1.16
 
 ### Patch Changes

package/README.md

@@ -50,24 +50,50 @@ Prices always come from Zappie. The cart shows a local estimate while it waits,
 
 ## Entry points
 
-| Import                                       | For                                                                    |
-| -------------------------------------------- | ---------------------------------------------------------------------- |
-| `@zappie/sdk`                                | The client, the cart, money formatting and errors                      |
-| `@zappie/sdk/react`                          | `ZappieProvider` and hooks such as `useStore`, `useMenu` and `useCart` |
-| `@zappie/sdk/checkout`                       | Opening Zappie's hosted checkout and checking it completed             |
-| `@zappie/sdk/checkout-defaults`              | The phone, address, region and time a signed-in checkout starts from   |
-| `@zappie/sdk/customer` and `/customer/react` | Signed-in customers, their orders and saved addresses                  |
-| `@zappie/sdk/integrations`                   | Public integration IDs and browser keys                                |
-| `@zappie/sdk/places`                         | Address search and delivery-zone checks                                |
-| `@zappie/sdk/pricing`                        | An item's starting price and whether to show it as "From"              |
-| `@zappie/sdk/server`                         | Server-side reads, storefront URLs and `verifyWebhook()`               |
-| `@zappie/sdk/template` and `/template/react` | Template settings and responsive images for template authors           |
-| `@zappie/sdk/testing`                        | A mock client for your tests                                           |
-| `@zappie/sdk/url`                            | Storefront URL parsing and canonical redirects                         |
-| `@zappie/sdk/redirect`                       | Same-origin validation for untrusted redirect targets                  |
+| Import                                       | For                                                                                      |
+| -------------------------------------------- | ---------------------------------------------------------------------------------------- |
+| `@zappie/sdk`                                | The client, the cart, money formatting and errors                                        |
+| `@zappie/sdk/react`                          | `ZappieProvider` and hooks such as `useStore`, `useMenu` and `useCart`                   |
+| `@zappie/sdk/checkout`                       | Opening Zappie's hosted checkout and checking it completed                               |
+| `@zappie/sdk/checkout-defaults`              | The phone, address, region and time a signed-in checkout starts from                     |
+| `@zappie/sdk/customer` and `/customer/react` | Signed-in customers, their orders and saved addresses                                    |
+| `@zappie/sdk/integrations`                   | Public integration IDs and browser keys                                                  |
+| `@zappie/sdk/places`                         | Address search and delivery-zone checks                                                  |
+| `@zappie/sdk/pricing`                        | An item's starting price and whether to show it as "From"                                |
+| `@zappie/sdk/server`                         | Server-side reads, storefront URLs, `verifyWebhook()`, menu snapshots and sign-in crypto |
+| `@zappie/sdk/template` and `/template/react` | Template settings and responsive images for template authors                             |
+| `@zappie/sdk/testing`                        | A mock client for your tests                                                             |
+| `@zappie/sdk/url`                            | Storefront URL parsing and canonical redirects                                           |
+| `@zappie/sdk/redirect`                       | Same-origin validation for untrusted redirect targets                                    |
 
 Customer sign-in runs through Zappie's site host, so `@zappie/sdk/customer` works on sites Zappie hosts. Sign-in for a site you host yourself isn't available yet.
 
+A menu snapshot is the SDK `Menu` with the facts an edge cache needs: the
+store, the branch, the API's menu version and a content hash. Build one with
+`createMenuSnapshot()` or `menuSnapshotFromPayload()` from `@zappie/sdk/server`,
+and apply a sold-out patch to it with `applyAvailability()`.
+
+`@zappie/sdk/server` has the pieces that sign-in will be built from. They use Web Crypto only, so they run in Workers and Node 20 or later:
+
+- `createPkce()` and `randomToken()` for the code challenge, state and nonce;
+- `sealValue()` and `openSealedValue()` to keep a value in an AES-GCM cookie, with secret rotation;
+- `createTokenVerifier()` to check a token's signature against the issuer's published keys, and its issuer, audience, expiry and subject. `verifyIdToken()` also needs the sign-in's nonce and refuses an access token;
+- `SessionStore` and `cookieSessionStore()` to keep a signed-in session in a sealed cookie.
+
+Make each sealing secret at least 32 random bytes, such as a value from `randomToken()`. Don't use a password or a phrase. The secret is hashed once with no stretching, so anyone holding one sealed value can test guesses offline.
+
+`cookieSessionStore()` keeps the session in the cookie, not on your server. Signing out clears the cookie in that browser only. It doesn't invalidate a copied cookie, which still opens the session until it expires 30 days after sign-in. To end every session at once, rotate the secret. To end one session from the server, use a store that keeps sessions there.
+
+```ts
+import { createTokenVerifier } from "@zappie/sdk/server";
+
+const verifier = createTokenVerifier({
+  issuer: "https://accounts.zappie.ai",
+  audience: clientId,
+});
+const claims = await verifier.verifyIdToken(idToken, { nonce });
+```
+
 Pass any redirect target read from a query parameter through `safeRedirect`.
 It keeps same-origin relative paths and returns your trusted fallback for an
 external, malformed or unsupported target.

package/dist/checkout/embed.d.ts

@@ -0,0 +1,148 @@
+import { WireLine, WireMoney } from '@zappie/sdk';
+
+/**
+ * Address fields you can send with a delivery checkout request.
+ */
+type CheckoutAddress = {
+    line1?: string;
+    city?: string;
+    place_id?: string;
+    lat?: number;
+    lng?: number;
+};
+/**
+ * Pickup or delivery details for a checkout session, including an optional schedule.
+ */
+type CheckoutFulfilment = {
+    /** Dine-in orders are not checked out through a session. */
+    type: "pickup" | "delivery";
+    address?: CheckoutAddress;
+    scheduled_for?: string | null;
+    delivery_region_id?: string;
+    instructions?: string;
+};
+/**
+ * Cart lines, branch, fulfilment and return URLs you send to open checkout.
+ */
+type CheckoutRequest = {
+    branch_id: string;
+    menu_version: string;
+    lines: WireLine[];
+    fulfilment: CheckoutFulfilment;
+    contact_phone?: string;
+    promo_code?: string;
+    return_url: string;
+    cancel_url?: string;
+    source?: string;
+    campaign?: string;
+};
+/**
+ * A checkout session returned by the service, with its amount, expiry and order status.
+ */
+type CheckoutSession = {
+    id: string;
+    status: "open" | "completed" | "expired" | "cancelled";
+    url?: string;
+    amount: WireMoney;
+    order_id: string | null;
+    return_url: string;
+    cancel_url?: string;
+    expires_at: string;
+};
+/**
+ * A checkout session with a payment URL you can use to send the shopper to checkout.
+ */
+type OpenCheckoutSession = CheckoutSession & {
+    url: string;
+};
+/**
+ * A terminal checkout result: a completed order, an expired session or a cancelled session.
+ */
+type CheckoutCompletion = (CheckoutSession & {
+    status: "completed";
+    order_id: string;
+}) | (CheckoutSession & {
+    status: "expired" | "cancelled";
+});
+/**
+ * Optional customer API base URL and fetch implementation for the checkout client.
+ */
+type CheckoutClientOptions = {
+    customerBase?: string;
+    fetch?: typeof fetch;
+};
+/**
+ * Cancellation signal and polling interval in milliseconds for awaiting checkout completion.
+ */
+type AwaitCompletionOptions = {
+    signal?: AbortSignal;
+    intervalMs?: number;
+};
+
+/**
+ * Create a client that opens checkout sessions, reads them and polls for completion.
+ *
+ * @param options - Override the default `/_zappie/api` base or fetch implementation.
+ * @returns A checkout client. Retain each idempotency key when retrying the same cart.
+ */
+declare function createCheckout(options?: CheckoutClientOptions): {
+    /** The caller retains this key and reuses it when retrying the same cart. */
+    open(body: CheckoutRequest, idempotencyKey: string): Promise<OpenCheckoutSession>;
+    session(id: string): Promise<CheckoutSession>;
+    awaitCompletion(id: string, options?: AwaitCompletionOptions): Promise<CheckoutCompletion>;
+};
+/**
+ * The session creation, lookup and completion methods returned by createCheckout.
+ */
+type CheckoutClient = ReturnType<typeof createCheckout>;
+
+/** How checkout opens. Auto redirects in in-app browsers and framed pages, else a modal on desktop and a sheet on mobile. */
+type CheckoutPresentation = "auto" | "modal" | "sheet" | "fullscreen" | "redirect";
+/** The checkout look from toCheckoutTheme in @zappie/tokens/checkout. The checkout validates it before use. */
+type CheckoutTheme = {
+    version: 1;
+    tokens: Partial<Record<`--z-${string}`, string>>;
+    logo?: {
+        url: string;
+        alt: string;
+    };
+    fonts?: {
+        family: string;
+        role: "body" | "display";
+        weights?: number[];
+    }[];
+    copy?: {
+        payButton?: string;
+        successTitle?: string;
+    };
+};
+/** Presentation, theme and step reporting for an embedded checkout. */
+type EmbedOptions = {
+    presentation?: CheckoutPresentation;
+    theme?: CheckoutTheme;
+    /** Called with each checkout step, and whether a payment has started. */
+    onStep?: (step: string, paying: boolean) => void;
+};
+/** How an embedded checkout ended. A completed result is confirmed by the server first. */
+type CheckoutResult = {
+    status: "completed";
+    orderId: string;
+} | {
+    status: "cancelled";
+    reason: string;
+} | {
+    status: "redirected";
+};
+/** Resolve auto to the presentation this browser gets. */
+declare function checkoutPresentation(presentation?: CheckoutPresentation): Exclude<CheckoutPresentation, "auto">;
+/** Ask the open checkout to close. Mid-payment it asks the shopper first. */
+declare function closeCheckout(): void;
+/** On load, drop a stale checkout entry from the address and read its session. It never reopens checkout. */
+declare function resumeCheckout(checkout: CheckoutClient): Promise<CheckoutResult | null>;
+/**
+ * Open a checkout session over the page and settle when it ends. Only Zappie's checkout, or one on this machine, is framed. Back and Escape ask the checkout to step back or
+ * close. A completed result waits for the server to confirm the session. A completed session can't be reopened.
+ */
+declare function embedCheckout(checkout: CheckoutClient, session: OpenCheckoutSession, options?: EmbedOptions): Promise<CheckoutResult>;
+
+export { type CheckoutPresentation, type CheckoutResult, type CheckoutTheme, type EmbedOptions, checkoutPresentation, closeCheckout, embedCheckout, resumeCheckout };

package/dist/checkout/embed.js

@@ -0,0 +1,240 @@
+// src/checkout/embed.ts
+import { ZappieError } from "./sdk.js";
+var PARAM = "zappie_checkout";
+var finished = /* @__PURE__ */ new Set();
+var request;
+var media = (query) => matchMedia(query).matches;
+function checkoutPresentation(presentation = "auto") {
+  if (presentation !== "auto") {
+    return presentation;
+  }
+  if (window.top !== window || /FBA[NV]|Instagram|TikTok|musical_ly|Bytedance|Line\//.test(
+    navigator.userAgent
+  )) {
+    return "redirect";
+  }
+  return media("(min-width:640px) and (pointer:fine),(min-width:1024px)") ? "modal" : "sheet";
+}
+function closeCheckout() {
+  request?.();
+}
+async function resumeCheckout(checkout) {
+  const url = new URL(location.href);
+  const id = url.searchParams.get(PARAM);
+  if (!id) {
+    return null;
+  }
+  url.searchParams.delete(PARAM);
+  history.replaceState(history.state, "", url);
+  const session = await checkout.session(id);
+  return session.status === "completed" && session.order_id ? { status: "completed", orderId: session.order_id } : null;
+}
+function embedCheckout(checkout, session, options = {}) {
+  const url = new URL(session.url);
+  if (request || session.status !== "open" || finished.has(session.id) || !(/^https:\/\/checkout\.(stg\.)?zappie\.ai$/.test(url.origin) || /^http:\/\/(localhost|127\.0\.0\.1)(:\d+)?$/.test(url.origin))) {
+    return Promise.reject(
+      new ZappieError(
+        "invalid_request",
+        "This checkout session can't be opened"
+      )
+    );
+  }
+  const shown = checkoutPresentation(options.presentation);
+  if (shown === "redirect") {
+    location.assign(session.url);
+    return Promise.resolve({ status: "redirected" });
+  }
+  url.pathname = `/embed/${encodeURIComponent(session.id)}`;
+  const doc = document;
+  const body = doc.body;
+  const root = doc.createElement("div");
+  const panel = doc.createElement("div");
+  const handle = doc.createElement("div");
+  const frame = doc.createElement("iframe");
+  const sheet = shown === "sheet";
+  const still = media("(prefers-reduced-motion:reduce)");
+  const opener = doc.activeElement;
+  const y = scrollY;
+  const bodyStyle = body.style.cssText;
+  const restoration = history.scrollRestoration;
+  const inert = [...body.children].filter(
+    (el) => !el.inert
+  );
+  const abort = new AbortController();
+  const vv = window.visualViewport;
+  let ready = false;
+  let paying = false;
+  let height = 640;
+  let settle = () => {
+  };
+  root.setAttribute("data-zappie-checkout", shown);
+  root.setAttribute("role", "dialog");
+  root.setAttribute("aria-modal", "true");
+  root.setAttribute("aria-label", "Checkout");
+  root.style.cssText = "position:fixed;inset:0;z-index:2147483647;background:var(--z-checkout-backdrop,rgb(0 0 0/.5))";
+  panel.style.cssText = `position:absolute;overflow:hidden;display:flex;flex-direction:column;background:var(--z-surface,#fff);${shown === "fullscreen" ? "inset:0" : sheet ? "left:0;right:0;border-radius:var(--z-checkout-radius,16px) var(--z-checkout-radius,16px) 0 0" : "inset:0;margin:auto;width:min(480px,100vw - 32px);border-radius:var(--z-checkout-radius,16px)"}`;
+  handle.style.cssText = "flex:none;height:24px;touch-action:none;cursor:grab;background:radial-gradient(closest-side,var(--z-border,#ccc) 99%,#0000) 50%/40px 5px no-repeat";
+  frame.title = "Checkout";
+  frame.src = url.href;
+  frame.allow = "payment 'src'; publickey-credentials-get 'src'";
+  frame.referrerPolicy = "no-referrer";
+  frame.style.cssText = "flex:1;width:100%;border:0;display:block";
+  if (sheet) {
+    panel.append(handle);
+  }
+  panel.append(frame);
+  root.append(panel);
+  const layout = () => {
+    const view = vv ?? { height: innerHeight, offsetTop: 0 };
+    if (sheet) {
+      panel.style.height = `${Math.round(view.height * 0.92)}px`;
+      panel.style.bottom = `${Math.max(0, innerHeight - view.offsetTop - view.height)}px`;
+    } else if (shown === "modal") {
+      panel.style.height = `${Math.min(height, view.height - 32)}px`;
+    }
+  };
+  const post = (type, payload = {}) => frame.contentWindow?.postMessage(
+    { source: "zappie-checkout", v: 1, session: session.id, type, payload },
+    url.origin
+  );
+  const finish = (result, popped) => {
+    abort.abort();
+    request = void 0;
+    removeEventListener("message", onMessage);
+    removeEventListener("popstate", onPop);
+    removeEventListener("keydown", onKey);
+    vv?.removeEventListener("resize", layout);
+    vv?.removeEventListener("scroll", layout);
+    root.remove();
+    inert.forEach((el) => el.inert = false);
+    body.style.cssText = bodyStyle;
+    const restore = () => {
+      scrollTo(0, y);
+      setTimeout(() => {
+        scrollTo(0, y);
+        history.scrollRestoration = restoration;
+      });
+    };
+    restore();
+    opener?.focus({ preventScroll: true });
+    if (!popped && history.state?.[PARAM] === session.id) {
+      history.scrollRestoration = "manual";
+      addEventListener("popstate", restore, { once: true });
+      history.back();
+    }
+    settle(result);
+  };
+  const close = () => ready ? post("close_request") : finish({ status: "cancelled", reason: "user" });
+  const onKey = (event) => {
+    if (event.key === "Escape") {
+      close();
+    }
+  };
+  const onPop = () => {
+    if (!ready) {
+      return finish({ status: "cancelled", reason: "user" }, true);
+    }
+    history.pushState(
+      { ...history.state, [PARAM]: session.id },
+      "",
+      location.href
+    );
+    post("close_request");
+  };
+  const onMessage = (event) => {
+    const data = event.data;
+    if (event.origin !== url.origin || event.source !== frame.contentWindow || data?.source !== "zappie-checkout" || data.v !== 1 || data.session !== session.id) {
+      return;
+    }
+    const payload = Object(data.payload);
+    if (data.type === "ready" || data.type === "step") {
+      if (data.type === "ready") {
+        ready = true;
+        frame.focus();
+        if (options.theme) {
+          post("theme", options.theme);
+        }
+      }
+      paying = payload.paying === true;
+      if (typeof payload.step === "string") {
+        options.onStep?.(payload.step, paying);
+      }
+    } else if (data.type === "resize" && Number.isFinite(payload.height)) {
+      height = payload.height;
+      layout();
+    } else if (data.type === "completed") {
+      checkout.awaitCompletion(session.id, { signal: abort.signal, intervalMs: 1500 }).then(
+        (done) => {
+          if (done.status === "completed") {
+            finished.add(session.id);
+            finish({ status: "completed", orderId: done.order_id });
+          } else {
+            finish({ status: "cancelled", reason: done.status });
+          }
+        },
+        () => {
+        }
+      );
+    } else if (data.type === "cancelled" || data.type === "error") {
+      finish({
+        status: "cancelled",
+        reason: String(payload.reason ?? payload.code ?? "user")
+      });
+    }
+  };
+  let start = 0;
+  handle.onpointerdown = (event) => {
+    if (paying) {
+      return;
+    }
+    start = event.clientY;
+    handle.setPointerCapture?.(event.pointerId);
+  };
+  handle.onpointermove = (event) => {
+    if (start) {
+      panel.style.transform = `translateY(${Math.max(0, event.clientY - start)}px)`;
+    }
+  };
+  handle.onpointerup = handle.onpointercancel = (event) => {
+    const moved = start ? event.clientY - start : 0;
+    start = 0;
+    panel.style.transform = "";
+    if (!paying && moved > panel.offsetHeight / 4) {
+      finish({ status: "cancelled", reason: "user" });
+    }
+  };
+  history.pushState(
+    { ...history.state, [PARAM]: session.id },
+    "",
+    (() => {
+      const here = new URL(location.href);
+      here.searchParams.set(PARAM, session.id);
+      return here;
+    })()
+  );
+  addEventListener("message", onMessage);
+  addEventListener("popstate", onPop);
+  addEventListener("keydown", onKey);
+  vv?.addEventListener("resize", layout);
+  vv?.addEventListener("scroll", layout);
+  inert.forEach((el) => el.inert = true);
+  history.scrollRestoration = "manual";
+  body.style.cssText += `;position:fixed;top:${-y}px;left:0;right:0;overflow:hidden`;
+  body.append(root);
+  layout();
+  if (!still) {
+    panel.animate?.(
+      sheet ? [{ transform: "translateY(100%)" }, { transform: "none" }] : [{ opacity: 0 }, { opacity: 1 }],
+      { duration: sheet ? 280 : 160, easing: "cubic-bezier(.2,.8,.2,1)" }
+    );
+  }
+  request = close;
+  return new Promise((resolve) => settle = resolve);
+}
+export {
+  checkoutPresentation,
+  closeCheckout,
+  embedCheckout,
+  resumeCheckout
+};
+//# sourceMappingURL=embed.js.map

package/dist/checkout/embed.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/checkout/embed.ts"],
+  "sourcesContent": ["import type { CheckoutClient } from \"./client\";\nimport { ZappieError } from \"./sdk\";\nimport type { OpenCheckoutSession } from \"./types\";\n\n/** How checkout opens. Auto redirects in in-app browsers and framed pages, else a modal on desktop and a sheet on mobile. */\nexport type CheckoutPresentation =\n  \"auto\" | \"modal\" | \"sheet\" | \"fullscreen\" | \"redirect\";\n\n/** The checkout look from toCheckoutTheme in @zappie/tokens/checkout. The checkout validates it before use. */\nexport type CheckoutTheme = {\n  version: 1;\n  tokens: Partial<Record<`--z-${string}`, string>>;\n  logo?: { url: string; alt: string };\n  fonts?: { family: string; role: \"body\" | \"display\"; weights?: number[] }[];\n  copy?: { payButton?: string; successTitle?: string };\n};\n\n/** Presentation, theme and step reporting for an embedded checkout. */\nexport type EmbedOptions = {\n  presentation?: CheckoutPresentation;\n  theme?: CheckoutTheme;\n  /** Called with each checkout step, and whether a payment has started. */\n  onStep?: (step: string, paying: boolean) => void;\n};\n\n/** How an embedded checkout ended. A completed result is confirmed by the server first. */\nexport type CheckoutResult =\n  | { status: \"completed\"; orderId: string }\n  | { status: \"cancelled\"; reason: string }\n  | { status: \"redirected\" };\n\nconst PARAM = \"zappie_checkout\";\nconst finished = new Set<string>();\nlet request: (() => void) | undefined;\nconst media = (query: string) => matchMedia(query).matches;\n\n/** Resolve auto to the presentation this browser gets. */\nexport function checkoutPresentation(\n  presentation: CheckoutPresentation = \"auto\",\n): Exclude<CheckoutPresentation, \"auto\"> {\n  if (presentation !== \"auto\") {\n    return presentation;\n  }\n  if (\n    window.top !== window ||\n    /FBA[NV]|Instagram|TikTok|musical_ly|Bytedance|Line\\//.test(\n      navigator.userAgent,\n    )\n  ) {\n    return \"redirect\";\n  }\n  return media(\"(min-width:640px) and (pointer:fine),(min-width:1024px)\")\n    ? \"modal\"\n    : \"sheet\";\n}\n\n/** Ask the open checkout to close. Mid-payment it asks the shopper first. */\nexport function closeCheckout(): void {\n  request?.();\n}\n\n/** On load, drop a stale checkout entry from the address and read its session. It never reopens checkout. */\nexport async function resumeCheckout(\n  checkout: CheckoutClient,\n): Promise<CheckoutResult | null> {\n  const url = new URL(location.href);\n  const id = url.searchParams.get(PARAM);\n  if (!id) {\n    return null;\n  }\n  url.searchParams.delete(PARAM);\n  history.replaceState(history.state, \"\", url);\n  const session = await checkout.session(id);\n  return session.status === \"completed\" && session.order_id\n    ? { status: \"completed\", orderId: session.order_id }\n    : null;\n}\n\n/**\n * Open a checkout session over the page and settle when it ends. Only Zappie's checkout, or one on this machine, is framed. Back and Escape ask the checkout to step back or\n * close. A completed result waits for the server to confirm the session. A completed session can't be reopened.\n */\nexport function embedCheckout(\n  checkout: CheckoutClient,\n  session: OpenCheckoutSession,\n  options: EmbedOptions = {},\n): Promise<CheckoutResult> {\n  const url = new URL(session.url);\n  if (\n    request ||\n    session.status !== \"open\" ||\n    finished.has(session.id) ||\n    !(\n      /^https:\\/\\/checkout\\.(stg\\.)?zappie\\.ai$/.test(url.origin) ||\n      /^http:\\/\\/(localhost|127\\.0\\.0\\.1)(:\\d+)?$/.test(url.origin)\n    )\n  ) {\n    return Promise.reject(\n      new ZappieError(\n        \"invalid_request\",\n        \"This checkout session can't be opened\",\n      ),\n    );\n  }\n  const shown = checkoutPresentation(options.presentation);\n  if (shown === \"redirect\") {\n    location.assign(session.url);\n    return Promise.resolve({ status: \"redirected\" });\n  }\n  url.pathname = `/embed/${encodeURIComponent(session.id)}`;\n  const doc = document;\n  const body = doc.body;\n  const root = doc.createElement(\"div\");\n  const panel = doc.createElement(\"div\");\n  const handle = doc.createElement(\"div\");\n  const frame = doc.createElement(\"iframe\");\n  const sheet = shown === \"sheet\";\n  const still = media(\"(prefers-reduced-motion:reduce)\");\n  const opener = doc.activeElement as HTMLElement | null;\n  const y = scrollY;\n  const bodyStyle = body.style.cssText;\n  const restoration = history.scrollRestoration;\n  const inert = [...body.children].filter(\n    (el): el is HTMLElement => !(el as HTMLElement).inert,\n  );\n  const abort = new AbortController();\n  const vv = window.visualViewport;\n  let ready = false;\n  let paying = false;\n  let height = 640;\n  let settle: (result: CheckoutResult) => void = () => {};\n\n  root.setAttribute(\"data-zappie-checkout\", shown);\n  root.setAttribute(\"role\", \"dialog\");\n  root.setAttribute(\"aria-modal\", \"true\");\n  root.setAttribute(\"aria-label\", \"Checkout\");\n  root.style.cssText =\n    \"position:fixed;inset:0;z-index:2147483647;background:var(--z-checkout-backdrop,rgb(0 0 0/.5))\";\n  panel.style.cssText = `position:absolute;overflow:hidden;display:flex;flex-direction:column;background:var(--z-surface,#fff);${\n    shown === \"fullscreen\"\n      ? \"inset:0\"\n      : sheet\n        ? \"left:0;right:0;border-radius:var(--z-checkout-radius,16px) var(--z-checkout-radius,16px) 0 0\"\n        : \"inset:0;margin:auto;width:min(480px,100vw - 32px);border-radius:var(--z-checkout-radius,16px)\"\n  }`;\n  handle.style.cssText =\n    \"flex:none;height:24px;touch-action:none;cursor:grab;background:radial-gradient(closest-side,var(--z-border,#ccc) 99%,#0000) 50%/40px 5px no-repeat\";\n  frame.title = \"Checkout\";\n  frame.src = url.href;\n  frame.allow = \"payment 'src'; publickey-credentials-get 'src'\";\n  frame.referrerPolicy = \"no-referrer\";\n  frame.style.cssText = \"flex:1;width:100%;border:0;display:block\";\n  if (sheet) {\n    panel.append(handle);\n  }\n  panel.append(frame);\n  root.append(panel);\n\n  const layout = () => {\n    const view = vv ?? { height: innerHeight, offsetTop: 0 };\n    if (sheet) {\n      panel.style.height = `${Math.round(view.height * 0.92)}px`;\n      panel.style.bottom = `${Math.max(0, innerHeight - view.offsetTop - view.height)}px`;\n    } else if (shown === \"modal\") {\n      panel.style.height = `${Math.min(height, view.height - 32)}px`;\n    }\n  };\n  const post = (type: string, payload: object = {}) =>\n    frame.contentWindow?.postMessage(\n      { source: \"zappie-checkout\", v: 1, session: session.id, type, payload },\n      url.origin,\n    );\n  const finish = (result: CheckoutResult, popped?: boolean) => {\n    abort.abort();\n    request = undefined;\n    removeEventListener(\"message\", onMessage);\n    removeEventListener(\"popstate\", onPop);\n    removeEventListener(\"keydown\", onKey);\n    vv?.removeEventListener(\"resize\", layout);\n    vv?.removeEventListener(\"scroll\", layout);\n    root.remove();\n    inert.forEach((el) => (el.inert = false));\n    body.style.cssText = bodyStyle;\n    // WebKit scrolls the page again after popstate, so the scroll is set once more a task later.\n    const restore = () => {\n      scrollTo(0, y);\n      setTimeout(() => {\n        scrollTo(0, y);\n        history.scrollRestoration = restoration;\n      });\n    };\n    restore();\n    opener?.focus({ preventScroll: true });\n    if (!popped && history.state?.[PARAM] === session.id) {\n      history.scrollRestoration = \"manual\";\n      addEventListener(\"popstate\", restore, { once: true });\n      history.back();\n    }\n    settle(result);\n  };\n  const close = () =>\n    ready\n      ? post(\"close_request\")\n      : finish({ status: \"cancelled\", reason: \"user\" });\n  const onKey = (event: KeyboardEvent) => {\n    if (event.key === \"Escape\") {\n      close();\n    }\n  };\n  const onPop = () => {\n    if (!ready) {\n      return finish({ status: \"cancelled\", reason: \"user\" }, true);\n    }\n    history.pushState(\n      { ...history.state, [PARAM]: session.id },\n      \"\",\n      location.href,\n    );\n    post(\"close_request\");\n  };\n  const onMessage = (event: MessageEvent) => {\n    const data = event.data;\n    if (\n      event.origin !== url.origin ||\n      event.source !== frame.contentWindow ||\n      data?.source !== \"zappie-checkout\" ||\n      data.v !== 1 ||\n      data.session !== session.id\n    ) {\n      return;\n    }\n    const payload = Object(data.payload);\n    if (data.type === \"ready\" || data.type === \"step\") {\n      if (data.type === \"ready\") {\n        ready = true;\n        frame.focus();\n        if (options.theme) {\n          post(\"theme\", options.theme);\n        }\n      }\n      paying = payload.paying === true;\n      if (typeof payload.step === \"string\") {\n        options.onStep?.(payload.step, paying);\n      }\n    } else if (data.type === \"resize\" && Number.isFinite(payload.height)) {\n      height = payload.height;\n      layout();\n    } else if (data.type === \"completed\") {\n      checkout\n        .awaitCompletion(session.id, { signal: abort.signal, intervalMs: 1500 })\n        .then(\n          (done) => {\n            if (done.status === \"completed\") {\n              finished.add(session.id);\n              finish({ status: \"completed\", orderId: done.order_id });\n            } else {\n              finish({ status: \"cancelled\", reason: done.status });\n            }\n          },\n          () => {},\n        );\n    } else if (data.type === \"cancelled\" || data.type === \"error\") {\n      finish({\n        status: \"cancelled\",\n        reason: String(payload.reason ?? payload.code ?? \"user\"),\n      });\n    }\n  };\n\n  let start = 0;\n  handle.onpointerdown = (event) => {\n    if (paying) {\n      return;\n    }\n    start = event.clientY;\n    handle.setPointerCapture?.(event.pointerId);\n  };\n  handle.onpointermove = (event) => {\n    if (start) {\n      panel.style.transform = `translateY(${Math.max(0, event.clientY - start)}px)`;\n    }\n  };\n  handle.onpointerup = handle.onpointercancel = (event) => {\n    const moved = start ? event.clientY - start : 0;\n    start = 0;\n    panel.style.transform = \"\";\n    if (!paying && moved > panel.offsetHeight / 4) {\n      finish({ status: \"cancelled\", reason: \"user\" });\n    }\n  };\n\n  history.pushState(\n    { ...history.state, [PARAM]: session.id },\n    \"\",\n    (() => {\n      const here = new URL(location.href);\n      here.searchParams.set(PARAM, session.id);\n      return here;\n    })(),\n  );\n  addEventListener(\"message\", onMessage);\n  addEventListener(\"popstate\", onPop);\n  addEventListener(\"keydown\", onKey);\n  vv?.addEventListener(\"resize\", layout);\n  vv?.addEventListener(\"scroll\", layout);\n  inert.forEach((el) => (el.inert = true));\n  history.scrollRestoration = \"manual\";\n  body.style.cssText += `;position:fixed;top:${-y}px;left:0;right:0;overflow:hidden`;\n  body.append(root);\n  layout();\n  if (!still) {\n    panel.animate?.(\n      sheet\n        ? [{ transform: \"translateY(100%)\" }, { transform: \"none\" }]\n        : [{ opacity: 0 }, { opacity: 1 }],\n      { duration: sheet ? 280 : 160, easing: \"cubic-bezier(.2,.8,.2,1)\" },\n    );\n  }\n  request = close;\n  return new Promise((resolve) => (settle = resolve));\n}\n"],
+  "mappings": "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",
+  "names": []
+}