@mesub/react 0.0.0-stage → 0.1.2

package/dist/index.js

@@ -0,0 +1,2955 @@
+'use client';
+
+// src/provider.tsx
+import { useCallback as useCallback2, useEffect as useEffect6, useMemo, useRef as useRef5, useState as useState6 } from "react";
+
+// src/errors.ts
+var MesubClientError = class extends Error {
+  name = "MesubClientError";
+  status;
+  code;
+  // Seconds, from Retry-After: on a 429, and on a 503 `unavailable` (Mesub-io/backend#505).
+  retryAfter;
+  constructor(message, status, code = null, options = {}) {
+    super(message, options);
+    this.status = status;
+    this.code = code;
+    this.retryAfter = options.retryAfter ?? null;
+  }
+};
+
+// src/api.ts
+var REQUEST_TIMEOUT_MS = 15e3;
+var CHAIN_TIMEOUT_MS = 9e4;
+var deadlines = /* @__PURE__ */ new WeakMap();
+function deadlineOf(answer) {
+  return deadlines.get(answer) ?? null;
+}
+function dyingAt(expiresAt, served, received) {
+  const at = typeof expiresAt === "string" ? Date.parse(expiresAt) : Number.NaN;
+  if (Number.isNaN(at)) return null;
+  const now = served === null ? Number.NaN : Date.parse(served);
+  const until = Number.isNaN(now) ? at : received + (at - now) - 1e3;
+  return until > received ? until : null;
+}
+var isObject = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+var LISTED_AT_MOST = 5;
+function paidOf(answer) {
+  const read = (value) => isObject(value) && typeof value.count === "number" ? { count: value.count, amount: typeof value.amount === "string" ? value.amount : null } : null;
+  const total = read(answer.paid);
+  if (total) return total;
+  const whole = Array.isArray(answer.payments) && answer.payments.length < LISTED_AT_MOST;
+  return whole ? read(answer.listed_paid) : null;
+}
+function createApi(options) {
+  const base = options.endpoint.replace(/\/+$/, "");
+  const doFetch = options.fetch ?? ((input, init) => globalThis.fetch(input, init));
+  async function request(method, path, body, timeout) {
+    const headers = { Accept: "application/json" };
+    if (method === "POST") headers["Content-Type"] = "application/json";
+    const late = `No answer within ${timeout / 1e3} seconds.`;
+    const controller = new AbortController();
+    let timer;
+    const deadline = new Promise((_, reject) => {
+      timer = setTimeout(() => {
+        reject(new MesubClientError(late, null, "timeout"));
+        controller.abort();
+      }, timeout);
+    });
+    async function send() {
+      let response;
+      try {
+        response = await doFetch(`${base}${path}`, {
+          method,
+          headers,
+          ...method === "POST" && { body: JSON.stringify(body ?? {}) },
+          // The merchant's own session cookie says who is asking.
+          credentials: "include",
+          signal: controller.signal
+        });
+      } catch (error) {
+        if (controller.signal.aborted) throw new MesubClientError(late, null, "timeout");
+        throw new MesubClientError("Could not reach the server.", null, "network", {
+          cause: error
+        });
+      }
+      let answer;
+      try {
+        answer = await response.json();
+      } catch {
+        answer = void 0;
+      }
+      if (!response.ok) throw refusal(response, answer);
+      if (!isObject(answer)) {
+        throw new MesubClientError(
+          `${base}${path} did not answer as the @mesub/node routes do.`,
+          response.status,
+          "bad_response"
+        );
+      }
+      const until = dyingAt(
+        answer.transaction_expires_at,
+        response.headers.get("Date"),
+        Date.now()
+      );
+      if (until !== null) deadlines.set(answer, until);
+      return answer;
+    }
+    try {
+      return await Promise.race([send(), deadline]);
+    } finally {
+      clearTimeout(timer);
+    }
+  }
+  const at = (id) => `/subscriptions/${encodeURIComponent(id)}`;
+  return {
+    plan: async (slug) => await request(
+      "GET",
+      `/plans/${encodeURIComponent(slug)}`,
+      void 0,
+      REQUEST_TIMEOUT_MS
+    ),
+    subscriptions: async () => {
+      const answer = await request("GET", "/subscriptions", void 0, REQUEST_TIMEOUT_MS);
+      return Array.isArray(answer.subscriptions) ? answer.subscriptions : [];
+    },
+    subscription: async (id) => {
+      const answer = await request("GET", at(id), void 0, REQUEST_TIMEOUT_MS);
+      return {
+        subscription: answer.subscription,
+        upcoming: Array.isArray(answer.upcoming) ? answer.upcoming : [],
+        payments: Array.isArray(answer.payments) ? answer.payments : null,
+        paid: paidOf(answer)
+      };
+    },
+    prepare: async (plan, wallet) => await request(
+      "POST",
+      "/subscriptions",
+      { plan, wallet },
+      REQUEST_TIMEOUT_MS
+    ),
+    transaction: async (id) => await request(
+      "POST",
+      `${at(id)}/transaction`,
+      {},
+      REQUEST_TIMEOUT_MS
+    ),
+    submit: async (id, signed) => await request(
+      "POST",
+      `${at(id)}/submit`,
+      { transaction: signed.transaction, terms_signature: signed.terms_signature },
+      CHAIN_TIMEOUT_MS
+    ),
+    build: async (action, id) => await request(
+      "POST",
+      `${at(id)}/${action}`,
+      {},
+      REQUEST_TIMEOUT_MS
+    ),
+    payNow: async (id) => {
+      const answer = await request("POST", `${at(id)}/retry`, {}, REQUEST_TIMEOUT_MS);
+      return answer.subscription;
+    },
+    confirm: async (action, id, signature) => await request(
+      "POST",
+      `${at(id)}/${action}/confirm`,
+      { signature },
+      CHAIN_TIMEOUT_MS
+    )
+  };
+}
+function refusal(response, answer) {
+  const error = isObject(answer) && isObject(answer.error) ? answer.error : null;
+  const message = typeof error?.message === "string" && error.message !== "" ? error.message : `The server answered ${response.status}.`;
+  const seconds2 = Number(response.headers.get("Retry-After"));
+  return new MesubClientError(
+    message,
+    response.status,
+    typeof error?.code === "string" ? error.code : null,
+    { retryAfter: Number.isFinite(seconds2) && seconds2 > 0 ? seconds2 : null }
+  );
+}
+function unreachable(error) {
+  return error instanceof MesubClientError && error.status === null;
+}
+function busyFor(error) {
+  if (!(error instanceof MesubClientError)) return null;
+  if (error.status !== 503 || error.code !== "unavailable") return null;
+  return error.retryAfter;
+}
+function signedOut(error) {
+  return error instanceof MesubClientError && error.status === 401;
+}
+function routeMissing(error) {
+  if (!(error instanceof MesubClientError)) return false;
+  return error.status === 405 || error.status === 404 && error.code !== "subscription_not_found";
+}
+
+// src/checkout.tsx
+import { useWallets } from "@wallet-standard/react";
+import { useEffect as useEffect2, useId, useRef as useRef2, useState as useState2 } from "react";
+
+// src/context.ts
+import { createContext, useContext } from "react";
+var MesubContext = createContext(null);
+function useMesubInternal() {
+  const value = useContext(MesubContext);
+  if (!value) throw new Error("@mesub/react must be used inside <MesubProvider>");
+  return value;
+}
+
+// src/dialog.tsx
+import { Fragment, useEffect, useLayoutEffect, useRef } from "react";
+
+// src/brand.tsx
+import { jsx } from "react/jsx-runtime";
+var MARK = "M68 0h12v1h-12zM64 1h19v1h-19zM62 2h24v1h-24zM60 3h28v1h-28zM58 4h32v1h-32zM56 5h35v1h-35zM55 6h38v1h-38zM54 7h40v1h-40zM52 8h43v1h-43zM51 9h18v1h-18zM78 9h18v1h-18zM50 10h16v1h-16zM82 10h15v1h-15zM50 11h13v1h-13zM84 11h14v1h-14zM49 12h13v1h-13zM86 12h12v1h-12zM48 13h12v1h-12zM87 13h12v1h-12zM47 14h12v1h-12zM88 14h12v1h-12zM47 15h11v1h-11zM89 15h11v1h-11zM46 16h11v1h-11zM90 16h11v1h-11zM46 17h10v1h-10zM91 17h10v1h-10zM45 18h10v1h-10zM92 18h10v1h-10zM45 19h10v1h-10zM92 19h10v1h-10zM44 20h10v1h-10zM93 20h10v1h-10zM44 21h9v1h-9zM93 21h10v1h-10zM43 22h10v1h-10zM94 22h10v1h-10zM43 23h9v1h-9zM94 23h11v1h-11zM27 24h4v1h-4zM43 24h9v1h-9zM72 24h2v1h-2zM95 24h10v1h-10zM22 25h15v1h-15zM43 25h9v1h-9zM70 25h6v1h-6zM96 25h10v1h-10zM19 26h20v1h-20zM43 26h8v1h-8zM69 26h8v1h-8zM96 26h10v1h-10zM17 27h24v1h-24zM42 27h9v1h-9zM69 27h8v1h-8zM97 27h10v1h-10zM15 28h36v1h-36zM69 28h9v1h-9zM97 28h10v1h-10zM14 29h37v1h-37zM69 29h9v1h-9zM98 29h10v1h-10zM12 30h39v1h-39zM69 30h10v1h-10zM98 30h10v1h-10zM11 31h40v1h-40zM69 31h10v1h-10zM99 31h10v1h-10zM10 32h41v1h-41zM70 32h10v1h-10zM99 32h10v1h-10zM9 33h19v1h-19zM31 33h20v1h-20zM70 33h10v1h-10zM100 33h10v1h-10zM8 34h15v1h-15zM35 34h16v1h-16zM71 34h10v1h-10zM101 34h10v1h-10zM7 35h14v1h-14zM38 35h13v1h-13zM71 35h11v1h-11zM101 35h10v1h-10zM6 36h13v1h-13zM39 36h13v1h-13zM72 36h10v1h-10zM102 36h10v1h-10zM6 37h12v1h-12zM40 37h12v1h-12zM73 37h10v1h-10zM102 37h10v1h-10zM5 38h11v1h-11zM42 38h10v1h-10zM73 38h10v1h-10zM103 38h10v1h-10zM4 39h11v1h-11zM43 39h10v1h-10zM74 39h10v1h-10zM103 39h10v1h-10zM4 40h10v1h-10zM43 40h10v1h-10zM74 40h10v1h-10zM104 40h10v1h-10zM3 41h11v1h-11zM44 41h10v1h-10zM75 41h10v1h-10zM104 41h10v1h-10zM3 42h10v1h-10zM45 42h10v1h-10zM75 42h10v1h-10zM105 42h10v1h-10zM2 43h10v1h-10zM45 43h10v1h-10zM76 43h10v1h-10zM106 43h9v1h-9zM2 44h10v1h-10zM46 44h10v1h-10zM76 44h10v1h-10zM106 44h10v1h-10zM2 45h9v1h-9zM46 45h10v1h-10zM77 45h10v1h-10zM107 45h10v1h-10zM1 46h10v1h-10zM47 46h10v1h-10zM78 46h9v1h-9zM107 46h10v1h-10zM1 47h9v1h-9zM47 47h10v1h-10zM78 47h10v1h-10zM108 47h10v1h-10zM1 48h9v1h-9zM48 48h10v1h-10zM79 48h10v1h-10zM108 48h10v1h-10zM0 49h10v1h-10zM48 49h10v1h-10zM79 49h10v1h-10zM109 49h10v1h-10zM0 50h9v1h-9zM27 50h4v1h-4zM49 50h10v1h-10zM80 50h10v1h-10zM109 50h10v1h-10zM0 51h9v1h-9zM25 51h7v1h-7zM49 51h10v1h-10zM80 51h10v1h-10zM110 51h10v1h-10zM0 52h9v1h-9zM25 52h8v1h-8zM50 52h10v1h-10zM81 52h10v1h-10zM111 52h9v1h-9zM0 53h9v1h-9zM25 53h8v1h-8zM51 53h10v1h-10zM81 53h10v1h-10zM111 53h10v1h-10zM0 54h9v1h-9zM25 54h9v1h-9zM51 54h10v1h-10zM82 54h10v1h-10zM112 54h9v1h-9zM0 55h9v1h-9zM25 55h10v1h-10zM52 55h10v1h-10zM82 55h10v1h-10zM112 55h10v1h-10zM0 56h9v1h-9zM25 56h10v1h-10zM52 56h10v1h-10zM83 56h10v1h-10zM113 56h10v1h-10zM0 57h9v1h-9zM26 57h10v1h-10zM53 57h10v1h-10zM84 57h9v1h-9zM113 57h10v1h-10zM0 58h9v1h-9zM26 58h10v1h-10zM53 58h10v1h-10zM84 58h10v1h-10zM114 58h10v1h-10zM1 59h9v1h-9zM27 59h10v1h-10zM54 59h10v1h-10zM85 59h10v1h-10zM114 59h10v1h-10zM1 60h9v1h-9zM27 60h10v1h-10zM54 60h10v1h-10zM85 60h10v1h-10zM115 60h10v1h-10zM1 61h9v1h-9zM28 61h10v1h-10zM55 61h10v1h-10zM86 61h10v1h-10zM115 61h10v1h-10zM1 62h10v1h-10zM28 62h10v1h-10zM56 62h9v1h-9zM86 62h10v1h-10zM116 62h10v1h-10zM2 63h9v1h-9zM29 63h10v1h-10zM56 63h10v1h-10zM87 63h10v1h-10zM116 63h10v1h-10zM2 64h10v1h-10zM29 64h10v1h-10zM57 64h9v1h-9zM87 64h10v1h-10zM117 64h10v1h-10zM2 65h10v1h-10zM30 65h10v1h-10zM57 65h10v1h-10zM88 65h10v1h-10zM118 65h9v1h-9zM3 66h10v1h-10zM30 66h10v1h-10zM58 66h10v1h-10zM88 66h10v1h-10zM118 66h10v1h-10zM3 67h10v1h-10zM31 67h10v1h-10zM58 67h10v1h-10zM89 67h10v1h-10zM119 67h9v1h-9zM4 68h10v1h-10zM32 68h9v1h-9zM59 68h10v1h-10zM89 68h10v1h-10zM119 68h10v1h-10zM5 69h10v1h-10zM32 69h10v1h-10zM59 69h10v1h-10zM90 69h10v1h-10zM120 69h10v1h-10zM5 70h10v1h-10zM33 70h10v1h-10zM60 70h10v1h-10zM91 70h9v1h-9zM120 70h10v1h-10zM6 71h10v1h-10zM33 71h10v1h-10zM60 71h10v1h-10zM91 71h10v1h-10zM121 71h10v1h-10zM6 72h10v1h-10zM34 72h10v1h-10zM61 72h10v1h-10zM92 72h9v1h-9zM121 72h10v1h-10zM7 73h10v1h-10zM34 73h10v1h-10zM61 73h10v1h-10zM92 73h10v1h-10zM122 73h10v1h-10zM7 74h10v1h-10zM35 74h10v1h-10zM62 74h10v1h-10zM93 74h10v1h-10zM123 74h9v1h-9zM8 75h10v1h-10zM35 75h10v1h-10zM63 75h9v1h-9zM93 75h10v1h-10zM123 75h10v1h-10zM8 76h10v1h-10zM36 76h10v1h-10zM63 76h10v1h-10zM94 76h10v1h-10zM124 76h9v1h-9zM9 77h10v1h-10zM36 77h10v1h-10zM64 77h9v1h-9zM94 77h10v1h-10zM124 77h10v1h-10zM9 78h10v1h-10zM37 78h10v1h-10zM64 78h10v1h-10zM95 78h10v1h-10zM125 78h9v1h-9zM10 79h10v1h-10zM37 79h10v1h-10zM65 79h10v1h-10zM95 79h10v1h-10zM125 79h10v1h-10zM11 80h10v1h-10zM38 80h10v1h-10zM65 80h10v1h-10zM96 80h10v1h-10zM126 80h10v1h-10zM11 81h10v1h-10zM39 81h9v1h-9zM66 81h10v1h-10zM97 81h9v1h-9zM126 81h10v1h-10zM12 82h10v1h-10zM39 82h10v1h-10zM66 82h10v1h-10zM97 82h10v1h-10zM127 82h10v1h-10zM12 83h10v1h-10zM40 83h9v1h-9zM67 83h10v1h-10zM98 83h9v1h-9zM127 83h10v1h-10zM13 84h10v1h-10zM40 84h10v1h-10zM67 84h10v1h-10zM98 84h10v1h-10zM128 84h10v1h-10zM13 85h10v1h-10zM41 85h9v1h-9zM68 85h10v1h-10zM99 85h9v1h-9zM129 85h9v1h-9zM14 86h10v1h-10zM41 86h10v1h-10zM68 86h10v1h-10zM99 86h10v1h-10zM129 86h10v1h-10zM14 87h10v1h-10zM42 87h10v1h-10zM69 87h10v1h-10zM99 87h10v1h-10zM130 87h9v1h-9zM15 88h37v1h-37zM70 88h40v1h-40zM130 88h10v1h-10zM16 89h37v1h-37zM70 89h40v1h-40zM131 89h9v1h-9zM16 90h37v1h-37zM71 90h40v1h-40zM131 90h10v1h-10zM17 91h37v1h-37zM71 91h40v1h-40zM132 91h10v1h-10zM17 92h37v1h-37zM72 92h40v1h-40zM132 92h10v1h-10zM18 93h37v1h-37zM72 93h40v1h-40zM133 93h10v1h-10zM18 94h37v1h-37zM73 94h40v1h-40zM133 94h10v1h-10zM19 95h37v1h-37zM73 95h40v1h-40zM134 95h10v1h-10z";
+function MesubMark({ width, height }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width,
+      height,
+      viewBox: "0 0 144 96",
+      fill: "currentColor",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("path", { d: MARK })
+    }
+  );
+}
+var INSTALL_ICONS = {
+  Phantom: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHJ4PSI2IiBmaWxsPSIjM2EzZDQ3Ii8+PHBhdGggZD0iTTggMTZWOGg0LjVhMi41IDIuNSAwIDAgMSAwIDVIOCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+",
+  Solflare: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHJ4PSI2IiBmaWxsPSIjNWE1ZjZiIi8+PHBhdGggZD0iTTE1LjUgOS4yQzE1IDguNSAxMy45IDggMTIuNSA4IDEwLjggOCA5LjUgOC44IDkuNSAxMHMxLjIgMS43IDMgMiAzIC44IDMgMi0xLjMgMi0zIDJjLTEuNCAwLTIuNS0uNS0zLTEuMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+"
+};
+
+// src/dialog.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var FIRST_CONTROL = "[data-mesub-wallets] button:not(:disabled), [data-mesub-submit], [data-mesub-done], [data-mesub-install], [data-mesub-reload], [data-mesub-cancel]";
+function MesubDialog({
+  screen,
+  titleId,
+  onClose
+}) {
+  const { theme } = useMesubInternal();
+  const dialog = useRef(null);
+  useLayoutEffect(() => {
+    const node = dialog.current;
+    if (node && !node.open) {
+      if (typeof node.showModal === "function") node.showModal();
+      else node.setAttribute("open", "");
+    }
+  }, []);
+  useEffect(() => {
+    const node = dialog.current;
+    const control = node?.querySelector(FIRST_CONTROL);
+    (control ?? node?.querySelector("[data-mesub-close]"))?.focus();
+  }, [screen.view]);
+  return /* @__PURE__ */ jsxs(
+    "dialog",
+    {
+      ref: dialog,
+      "aria-labelledby": titleId,
+      "aria-modal": "true",
+      "data-mesub-dialog": "",
+      "data-mesub-step": screen.step,
+      "data-mesub-theme": theme,
+      onCancel: (event) => {
+        event.preventDefault();
+        onClose();
+      },
+      onClick: (event) => {
+        if (event.target !== event.currentTarget) return;
+        const box = event.currentTarget.getBoundingClientRect();
+        const inside = event.clientX >= box.left && event.clientX <= box.right && event.clientY >= box.top && event.clientY <= box.bottom;
+        if (!inside) onClose();
+      },
+      onKeyDown: (event) => {
+        if (event.key === "Escape") {
+          event.preventDefault();
+          onClose();
+        }
+      },
+      children: [
+        screen.onBack ? /* @__PURE__ */ jsx2(
+          "button",
+          {
+            type: "button",
+            "data-mesub-back": "",
+            "aria-label": "Back",
+            onClick: screen.onBack
+          }
+        ) : null,
+        /* @__PURE__ */ jsx2("button", { type: "button", "data-mesub-close": "", "aria-label": "Close", onClick: onClose }),
+        /* @__PURE__ */ jsxs("div", { "data-mesub-brand": "", children: [
+          /* @__PURE__ */ jsx2(MesubMark, { width: 27, height: 18 }),
+          "mesub.io"
+        ] }),
+        /* @__PURE__ */ jsx2(Fragment, { children: screen.body }, screen.view)
+      ]
+    }
+  );
+}
+
+// src/format.ts
+function formatAmount(amount, decimals) {
+  const units = BigInt(amount);
+  const scale = 10n ** BigInt(decimals);
+  const whole = (units / scale).toString();
+  const fraction = (units % scale).toString().padStart(decimals, "0").replace(/0+$/, "");
+  return fraction ? `${whole}.${fraction}` : whole;
+}
+function grouped(display) {
+  const [whole = "", fraction] = display.split(".");
+  if (!/^\d+$/.test(whole)) return display;
+  const spaced = whole.replace(/\B(?=(\d{3})+$)/g, ",");
+  return fraction === void 0 ? spaced : `${spaced}.${fraction}`;
+}
+function formatUsd(value) {
+  if (typeof value !== "string" || !/^\d+(\.\d+)?$/.test(value)) return null;
+  const dollars = Number(value);
+  if (!Number.isFinite(dollars) || dollars >= 1e15) return null;
+  if (dollars < 0.01) return "less than $0.01";
+  return `$${grouped(dollars.toFixed(2))}`;
+}
+function aboutUsd(value) {
+  const usd = formatUsd(value);
+  if (!usd) return null;
+  return usd.startsWith("less") ? usd : `about ${usd}`;
+}
+var SYMBOL_MAX = 12;
+var NAME_MAX = 32;
+var VOUCHED = /* @__PURE__ */ new Set(["USDC", "USDT", "PYUSD"]);
+function clean(text, max) {
+  if (typeof text !== "string") return null;
+  const plain = text.replace(/[\p{Cc}\p{Cf}]/gu, " ").replace(/\s+/g, " ").trim();
+  if (!plain) return null;
+  const letters = Array.from(plain);
+  return letters.length > max ? `${letters.slice(0, max).join("")}\u2026` : plain;
+}
+function httpsUrl(value) {
+  if (typeof value !== "string") return null;
+  try {
+    return new URL(value).protocol === "https:" ? value : null;
+  } catch {
+    return null;
+  }
+}
+function tokenOf(plan) {
+  const token = typeof plan.token === "object" && plan.token !== null ? plan.token : null;
+  const vouched = typeof plan.symbol === "string" && plan.symbol !== "";
+  const verified = vouched || token?.verified === true;
+  const unverified = token !== null && !verified;
+  const shortMint = shortAddress(plan.mint);
+  let symbol = clean(token?.symbol, SYMBOL_MAX) ?? (vouched ? clean(plan.symbol, SYMBOL_MAX) : null);
+  let name = clean(token?.name, NAME_MAX);
+  if (unverified && symbol && VOUCHED.has(symbol.toUpperCase())) symbol = null;
+  if (unverified && name && VOUCHED.has(name.toUpperCase())) name = null;
+  return {
+    unit: symbol ?? shortMint,
+    named: symbol !== null,
+    name,
+    logo: verified ? httpsUrl(token?.logo_url) : null,
+    unverified,
+    vouched,
+    shortMint
+  };
+}
+function priceOf(plan) {
+  return `${grouped(plan.amount_display)} ${tokenOf(plan).unit}`;
+}
+var UNITS = ["K", "M", "B", "T"];
+function short(display) {
+  if (!/^\d+$/.test(display)) return null;
+  const digits = display.replace(/^0+(?=\d)/, "");
+  if (digits.length < 5 || digits.length > 15) return null;
+  const unit = Math.floor((digits.length - 1) / 3);
+  const cut = digits.length - unit * 3;
+  const rest = digits.slice(cut);
+  if (/[1-9]/.test(rest.slice(2))) return null;
+  const decimals = rest.slice(0, 2).replace(/0+$/, "");
+  return `${digits.slice(0, cut)}${decimals ? `.${decimals}` : ""}${UNITS[unit - 1]}`;
+}
+function brief(display, vouched, unit = "") {
+  const full = `${grouped(display)}${unit}`;
+  const cut = vouched ? null : short(display);
+  return cut ? { text: `${cut}${unit}`, title: full } : { text: full, title: void 0 };
+}
+function briefPrice(plan) {
+  const token = tokenOf(plan);
+  return brief(plan.amount_display, token.vouched, ` ${token.unit}`);
+}
+function fit(text) {
+  const length = Array.from(text).length;
+  if (length > 30) return "4";
+  if (length > 18) return "3";
+  return length > 14 ? "2" : void 0;
+}
+function planUsd(plan) {
+  return tokenOf(plan).vouched ? null : aboutUsd(plan.amount_usd);
+}
+function unverifiedNote(plan) {
+  const token = tokenOf(plan);
+  if (!token.unverified) return null;
+  return token.name ? `Unverified token: ${token.name}, mint ${token.shortMint}` : `Unverified token, mint ${token.shortMint}`;
+}
+var NAMED = { 24: "day", 168: "week", 720: "month", 8760: "year" };
+function cadence(hours) {
+  const named = NAMED[hours];
+  if (named) return `every ${named}`;
+  if (hours % 24 === 0) return `every ${hours / 24} days`;
+  return hours === 1 ? "every hour" : `every ${hours} hours`;
+}
+function formatDate(date) {
+  return date.toLocaleDateString(void 0, { month: "short", day: "numeric", year: "numeric" });
+}
+function day(iso) {
+  if (!iso) return null;
+  const date = new Date(iso);
+  return Number.isNaN(date.getTime()) ? null : formatDate(date);
+}
+var CLOSE_MS = 48 * 36e5;
+function written(iso, far, now) {
+  if (!iso) return null;
+  const date = new Date(iso);
+  if (Number.isNaN(date.getTime())) return null;
+  if (Math.abs(date.getTime() - now) >= CLOSE_MS) return date.toLocaleDateString(void 0, far);
+  return date.toLocaleString(void 0, {
+    ...far,
+    hour: "numeric",
+    minute: "2-digit",
+    // The subscriber's own zone, named: an hour alone could be anyone's.
+    timeZoneName: "short"
+  });
+}
+function moment(iso, now = Date.now()) {
+  return written(iso, { month: "short", day: "numeric", year: "numeric" }, now);
+}
+function shortMoment(iso, now = Date.now()) {
+  return written(iso, { month: "short", day: "numeric" }, now);
+}
+var MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+var two = (n) => String(n).padStart(2, "0");
+function planEnd(iso) {
+  if (!iso) return null;
+  const date = new Date(iso);
+  if (Number.isNaN(date.getTime())) return null;
+  return `${MONTHS[date.getUTCMonth()]} ${date.getUTCDate()}, ${date.getUTCFullYear()}, ${two(date.getUTCHours())}:${two(date.getUTCMinutes())} UTC`;
+}
+function shortAddress(address) {
+  return `${address.slice(0, 4)}\u2026${address.slice(-4)}`;
+}
+function explorerUrl(signature, chain) {
+  const cluster = chain === "solana:mainnet" ? "" : `?cluster=${chain.slice("solana:".length)}`;
+  return `https://explorer.solana.com/tx/${signature}${cluster}`;
+}
+function termsLines(message) {
+  return message.split("\n").filter((line) => line.trim() !== "").map((line, index) => {
+    const named = index === 0 ? null : /^([A-Za-z][A-Za-z ]{0,30}): (.+)$/.exec(line);
+    return named ? { label: named[1], value: named[2] } : { label: null, value: line };
+  });
+}
+var CANCEL_LABEL = "Cancel any time";
+function termsCancelUrl(message) {
+  const line = termsLines(message).find((each) => each.label === CANCEL_LABEL);
+  return line && /^https?:\/\/\S+$/.test(line.value) ? line.value : null;
+}
+function termsSingleCharge(message) {
+  const lines = termsLines(message);
+  const amount = lines.find((each) => each.label === "Amount");
+  if (amount) return amount.value.endsWith(", a single charge");
+  return lines.some((each) => each.label === "Single charge") ? true : null;
+}
+var END_MARGIN_MS = 12e4;
+function noChargeAt(dueMs, endsAt) {
+  const end = endsAt ? Date.parse(endsAt) : NaN;
+  return !Number.isNaN(end) && dueMs + END_MARGIN_MS > end;
+}
+function chargedOnce(plan, now = Date.now()) {
+  return noChargeAt(now - END_MARGIN_MS + plan.period_hours * 36e5, plan.ends_at);
+}
+function manageLink(yours, fromTerms) {
+  if (yours === null) return null;
+  if (typeof yours === "string") {
+    if (/^\/(?!\/)\S*$/.test(yours)) return { href: yours, external: false };
+    if (/^https?:\/\/\S+$/.test(yours)) return { href: yours, external: true };
+  }
+  return fromTerms ? { href: fromTerms, external: true } : null;
+}
+var NOT_SHOWN = /* @__PURE__ */ new Set([
+  // Also on a single charge: its own line says it, in full.
+  "Amount",
+  "Plan",
+  "Plan details",
+  "Wallet",
+  "Nonce",
+  "Expires",
+  // The merchant may change where it is paid: not a term a subscriber holds them to.
+  "Paid to",
+  // Shown as a button under the list.
+  CANCEL_LABEL
+]);
+var ADDRESS = /[1-9A-HJ-NP-Za-km-z]{32,44}/;
+var escaped = (text) => text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+function repriced(value, plan) {
+  const units = ["tokens", ...plan.symbol ? [escaped(plan.symbol)] : []].join("|");
+  const said2 = new RegExp(
+    `(^|[^\\d.,])${escaped(plan.amount_display)} (?:${units})(?![\\w.])`,
+    "g"
+  );
+  const price = tokenOf(plan).named ? priceOf(plan) : `${grouped(plan.amount_display)} tokens`;
+  return value.replace(said2, (_, before) => `${before}${price}`);
+}
+function jupiterUrl(mint) {
+  return `https://jup.ag/tokens/${mint}`;
+}
+function termsFacts(message, plan) {
+  const token = plan ? tokenOf(plan) : null;
+  const note = token?.unverified ? { note: "Unverified token" } : {};
+  return termsLines(message).filter((line) => line.label !== null).filter((line) => !NOT_SHOWN.has(line.label)).map(({ label, value }) => {
+    const named = /^(.+), mint ([1-9A-HJ-NP-Za-km-z]{32,44})$/.exec(value);
+    if (named) {
+      return {
+        label,
+        value: named[1],
+        full: value,
+        href: jupiterUrl(named[2]),
+        ...label === "Token" && note
+      };
+    }
+    const address = ADDRESS.exec(value)?.[0];
+    if (address) {
+      const short2 = value.replace(address, shortAddress(address));
+      const known = label === "Token" && token?.named && address === plan?.mint;
+      return {
+        label,
+        value: known ? `${token.unit}, ${short2}` : short2,
+        full: value,
+        // A mint with no name is still a token to get.
+        ...label === "Token" && { href: jupiterUrl(address), ...note }
+      };
+    }
+    const trimmed = value.replace(/, in the transaction you sign next$/, "").replace(/^https?:\/\//, "");
+    const shown = plan ? repriced(trimmed, plan) : trimmed;
+    return shown === value ? { label, value } : { label, value: shown, full: value };
+  });
+}
+
+// src/screens.tsx
+import { useState } from "react";
+
+// src/wallet.ts
+import { getBase58Decoder } from "@solana/kit";
+import { getWalletFeature } from "@wallet-standard/react";
+var NEEDS = {
+  subscribe: ["solana:signMessage", "solana:signTransaction"],
+  manage: ["solana:signAndSendTransaction"]
+};
+var IN_WORDS = {
+  "solana:signMessage": "sign a message",
+  "solana:signTransaction": "sign a transaction without sending it",
+  "solana:signAndSendTransaction": "send a transaction"
+};
+var isSolana = (chain) => chain.startsWith("solana:");
+function isSolanaWallet(wallet) {
+  return wallet.chains.some(isSolana) && wallet.features.includes("standard:connect");
+}
+function lacking(wallet, purpose) {
+  return NEEDS[purpose].filter((feature) => !wallet.features.includes(feature)).map((feature) => IN_WORDS[feature]);
+}
+function usable(wallet, purpose) {
+  return isSolanaWallet(wallet) && lacking(wallet, purpose).length === 0;
+}
+var WalletError = class extends Error {
+  constructor(message, wallet) {
+    super(message);
+    this.wallet = wallet;
+  }
+  wallet;
+};
+var said = (wallet, refusal2) => `${wallet.name} said: ${refusal2 instanceof Error ? refusal2.message : String(refusal2)}`;
+var fromBase64 = (text) => Uint8Array.from(atob(text), (char) => char.charCodeAt(0));
+function toBase64(bytes) {
+  let binary = "";
+  for (const byte of bytes) binary += String.fromCharCode(byte);
+  return btoa(binary);
+}
+async function connectAccounts(wallet, silent = false) {
+  const feature = getWalletFeature(wallet, "standard:connect");
+  const { accounts } = await feature.connect(silent ? { silent: true } : void 0);
+  return accounts.filter((account) => account.chains.some(isSolana));
+}
+async function findConnected(wallets, address, purpose) {
+  const shows = (wallet) => wallet.accounts.some((entry) => entry.address === address);
+  const capable = wallets.filter((wallet) => usable(wallet, purpose)).sort((a, b) => Number(shows(b)) - Number(shows(a)));
+  for (const wallet of capable) {
+    const accounts = await connectAccounts(wallet, true).catch(() => []);
+    const account = accounts.find((entry) => entry.address === address);
+    if (account) return { wallet, account };
+  }
+  return null;
+}
+async function signText({ wallet, account }, text) {
+  const feature = getWalletFeature(wallet, "solana:signMessage");
+  let output;
+  try {
+    [output] = await feature.signMessage({ account, message: new TextEncoder().encode(text) });
+  } catch (refusal2) {
+    throw new WalletError(said(wallet, refusal2), wallet.name);
+  }
+  if (!output) throw new WalletError(`${wallet.name} returned no signature.`, wallet.name);
+  return getBase58Decoder().decode(output.signature);
+}
+async function signOnly({ wallet, account }, chain, transaction) {
+  const feature = getWalletFeature(wallet, "solana:signTransaction");
+  let output;
+  try {
+    [output] = await feature.signTransaction({
+      account,
+      chain,
+      transaction: fromBase64(transaction)
+    });
+  } catch (refusal2) {
+    throw new WalletError(said(wallet, refusal2), wallet.name);
+  }
+  if (!output) throw new WalletError(`${wallet.name} returned no transaction.`, wallet.name);
+  return {
+    transaction: toBase64(output.signedTransaction),
+    signature: firstSignature(output.signedTransaction)
+  };
+}
+async function signAndSend({ wallet, account }, chain, transaction) {
+  const feature = getWalletFeature(wallet, "solana:signAndSendTransaction");
+  let output;
+  try {
+    [output] = await feature.signAndSendTransaction({
+      account,
+      chain,
+      transaction: fromBase64(transaction)
+    });
+  } catch (refusal2) {
+    throw new WalletError(said(wallet, refusal2), wallet.name);
+  }
+  if (!output) throw new WalletError(`${wallet.name} returned no signature.`, wallet.name);
+  return getBase58Decoder().decode(output.signature);
+}
+function firstSignature(wire) {
+  const signature = wire.subarray(1, 65);
+  if (signature.length < 64 || signature.every((byte) => byte === 0)) return null;
+  return getBase58Decoder().decode(signature);
+}
+
+// src/screens.tsx
+import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var LAST_WALLET_KEY = "mesub:last-wallet";
+function lastWallet() {
+  try {
+    return localStorage.getItem(LAST_WALLET_KEY);
+  } catch {
+    return null;
+  }
+}
+function rememberWallet(name) {
+  try {
+    localStorage.setItem(LAST_WALLET_KEY, name);
+  } catch {
+  }
+}
+function Hero({ kind, icon }) {
+  return /* @__PURE__ */ jsx3("div", { "data-mesub-hero": kind, "aria-hidden": "true", children: icon ? /* @__PURE__ */ jsx3("img", { src: icon, alt: "", width: 56, height: 56 }) : null });
+}
+function Explorer({
+  signature,
+  chain,
+  label
+}) {
+  return /* @__PURE__ */ jsx3(
+    "a",
+    {
+      "data-mesub-explorer": "",
+      href: explorerUrl(signature, chain),
+      target: "_blank",
+      rel: "noopener",
+      children: label
+    }
+  );
+}
+function TokenLogo({ plan }) {
+  const { logo } = tokenOf(plan);
+  const [failed, setFailed] = useState(null);
+  if (!logo || failed === logo) return null;
+  return /* @__PURE__ */ jsx3(
+    "img",
+    {
+      "data-mesub-token-logo": "",
+      src: logo,
+      alt: "",
+      width: 20,
+      height: 20,
+      loading: "lazy",
+      decoding: "async",
+      referrerPolicy: "no-referrer",
+      onError: () => setFailed(logo)
+    }
+  );
+}
+function Price({
+  plan,
+  every,
+  single
+}) {
+  const usd = planUsd(plan);
+  const note = unverifiedNote(plan);
+  const price = briefPrice(plan);
+  return /* @__PURE__ */ jsxs2("p", { "data-mesub-price": "", children: [
+    /* @__PURE__ */ jsxs2("strong", { title: price.title, "data-mesub-fit": fit(price.text), children: [
+      /* @__PURE__ */ jsx3(TokenLogo, { plan }),
+      price.text
+    ] }),
+    /* @__PURE__ */ jsx3("span", { children: every }),
+    usd ? /* @__PURE__ */ jsx3("small", { "data-mesub-usd": "", children: single ? usd : `${usd} ${every}` }) : null,
+    note ? /* @__PURE__ */ jsx3("small", { "data-mesub-unverified": "", title: plan.mint, children: note }) : null
+  ] });
+}
+function Merchant({
+  name,
+  logoUrl,
+  testNetwork
+}) {
+  return /* @__PURE__ */ jsxs2("div", { "data-mesub-merchant": "", children: [
+    logoUrl ? /* @__PURE__ */ jsx3("img", { src: logoUrl, alt: "", width: 56, height: 56 }) : null,
+    /* @__PURE__ */ jsx3("strong", { children: name }),
+    testNetwork ? /* @__PURE__ */ jsx3("span", { "data-mesub-network": "devnet", children: "Test network" }) : null
+  ] });
+}
+function walletScreen({
+  titleId,
+  view,
+  wallets,
+  purpose,
+  lead,
+  step = "wallet",
+  setView,
+  pick,
+  onBack
+}) {
+  const toList = () => setView({ name: "list" });
+  if (view.name === "waiting") {
+    return {
+      step,
+      view: "wallet-waiting",
+      onBack: toList,
+      body: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+        /* @__PURE__ */ jsx3(Hero, { kind: "wait", icon: view.wallet.icon }),
+        /* @__PURE__ */ jsxs2("h2", { id: titleId, children: [
+          "Approve in ",
+          view.wallet.name
+        ] }),
+        /* @__PURE__ */ jsxs2("p", { children: [
+          "Check the ",
+          view.wallet.name,
+          " window."
+        ] }),
+        /* @__PURE__ */ jsx3("button", { type: "button", "data-mesub-back": "", onClick: toList, children: "Use another wallet" })
+      ] })
+    };
+  }
+  if (view.name === "rejected") {
+    return {
+      step,
+      view: "wallet-rejected",
+      onBack: toList,
+      body: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+        /* @__PURE__ */ jsx3(Hero, { kind: "error", icon: view.wallet.icon }),
+        /* @__PURE__ */ jsx3("h2", { id: titleId, children: "Request rejected" }),
+        /* @__PURE__ */ jsx3("p", { role: "alert", "data-mesub-error": "", children: view.message }),
+        /* @__PURE__ */ jsx3("button", { type: "button", "data-mesub-submit": "", onClick: () => pick(view.wallet), children: "Try again" }),
+        /* @__PURE__ */ jsx3("button", { type: "button", "data-mesub-back": "", onClick: toList, children: "Use another wallet" })
+      ] })
+    };
+  }
+  const solana = wallets.filter(isSolanaWallet);
+  const capable = solana.filter((wallet) => usable(wallet, purpose));
+  const unable = solana.filter((wallet) => !usable(wallet, purpose));
+  const reload = /* @__PURE__ */ jsx3("button", { type: "button", "data-mesub-reload": "", onClick: () => window.location.reload(), children: "Reload" });
+  if (solana.length === 0) {
+    return {
+      step,
+      view: "wallet-none",
+      onBack,
+      body: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+        /* @__PURE__ */ jsx3(Hero, { kind: "empty" }),
+        /* @__PURE__ */ jsx3("h2", { id: titleId, children: "No Solana wallet found" }),
+        /* @__PURE__ */ jsx3("p", { children: "Install one, then reload this page." }),
+        /* @__PURE__ */ jsxs2("div", { "data-mesub-no-wallet": "", children: [
+          /* @__PURE__ */ jsxs2(
+            "a",
+            {
+              "data-mesub-install": "",
+              href: "https://phantom.com",
+              target: "_blank",
+              rel: "noopener",
+              children: [
+                /* @__PURE__ */ jsx3("img", { src: INSTALL_ICONS.Phantom, alt: "", width: 28, height: 28 }),
+                "Phantom",
+                /* @__PURE__ */ jsx3("span", { children: "Install" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs2(
+            "a",
+            {
+              "data-mesub-install": "",
+              href: "https://solflare.com",
+              target: "_blank",
+              rel: "noopener",
+              children: [
+                /* @__PURE__ */ jsx3("img", { src: INSTALL_ICONS.Solflare, alt: "", width: 28, height: 28 }),
+                "Solflare",
+                /* @__PURE__ */ jsx3("span", { children: "Install" })
+              ]
+            }
+          )
+        ] }),
+        reload
+      ] })
+    };
+  }
+  const cannot = unable.map(
+    (wallet) => `${wallet.name} cannot ${lacking(wallet, purpose).join(" or ")}.`
+  );
+  if (capable.length === 0) {
+    return {
+      step,
+      view: "wallet-unable",
+      onBack,
+      body: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+        /* @__PURE__ */ jsx3(Hero, { kind: "empty" }),
+        /* @__PURE__ */ jsx3("h2", { id: titleId, children: "This wallet cannot do it" }),
+        /* @__PURE__ */ jsx3("p", { children: "Use a wallet that can, such as Phantom or Solflare, then reload." }),
+        /* @__PURE__ */ jsx3("p", { role: "alert", "data-mesub-error": "", children: cannot.join(" ") }),
+        reload
+      ] })
+    };
+  }
+  const last = lastWallet();
+  return {
+    step,
+    view: "wallet-list",
+    onBack,
+    body: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+      /* @__PURE__ */ jsx3("h2", { id: titleId, children: "Connect a wallet" }),
+      /* @__PURE__ */ jsx3("p", { children: lead }),
+      /* @__PURE__ */ jsx3("ul", { "data-mesub-wallets": "", "aria-label": "Wallets in this browser", children: capable.map((wallet) => /* @__PURE__ */ jsx3("li", { children: /* @__PURE__ */ jsxs2(
+        "button",
+        {
+          type: "button",
+          "data-mesub-wallet": wallet.name,
+          onClick: () => pick(wallet),
+          children: [
+            /* @__PURE__ */ jsx3("img", { src: wallet.icon, alt: "", width: 28, height: 28 }),
+            wallet.name,
+            wallet.name === last ? /* @__PURE__ */ jsx3("span", { "data-mesub-badge": "", children: "Last used" }) : null
+          ]
+        }
+      ) }, wallet.name)) }),
+      cannot.length > 0 ? /* @__PURE__ */ jsx3("p", { "data-mesub-notice": "", role: "note", children: cannot.join(" ") }) : null
+    ] })
+  };
+}
+var PRIMARY = {
+  retry: "Try again",
+  check: "Check again",
+  wallet: "Use another wallet"
+};
+function failureScreen({
+  failure,
+  titleId,
+  icon,
+  safe,
+  pending,
+  signature,
+  chain,
+  busy,
+  onAct,
+  onBack,
+  backLabel
+}) {
+  const back = failure.moved === "pending" ? void 0 : onBack;
+  return {
+    step: failure.step,
+    view: `${failure.step}-failed-${failure.title}`,
+    onBack: back,
+    body: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+      /* @__PURE__ */ jsx3(Hero, { kind: failure.moved === "pending" ? "pending" : "error", icon }),
+      /* @__PURE__ */ jsx3("h2", { id: titleId, children: failure.title }),
+      /* @__PURE__ */ jsx3("p", { role: "alert", "data-mesub-error": "", children: failure.message }),
+      failure.moved === "safe" ? /* @__PURE__ */ jsx3("p", { "data-mesub-funds": "safe", children: safe }) : failure.moved === "pending" ? /* @__PURE__ */ jsx3("p", { "data-mesub-funds": "pending", children: pending }) : null,
+      failure.moved === "pending" && signature ? /* @__PURE__ */ jsx3(Explorer, { signature, chain, label: "View transaction" }) : null,
+      failure.action === "close" ? /* @__PURE__ */ jsx3("button", { type: "button", "data-mesub-done": "", onClick: () => onAct("close"), children: "Close" }) : /* @__PURE__ */ jsx3(
+        "button",
+        {
+          type: "button",
+          "data-mesub-submit": "",
+          disabled: busy,
+          "aria-busy": busy || void 0,
+          onClick: () => onAct(failure.action),
+          children: PRIMARY[failure.action]
+        }
+      ),
+      back && failure.action === "retry" ? /* @__PURE__ */ jsx3("button", { type: "button", "data-mesub-back": "", onClick: back, children: backLabel }) : null
+    ] })
+  };
+}
+function signedOutScreen({
+  titleId,
+  step,
+  message,
+  safe,
+  onClose
+}) {
+  return {
+    step,
+    view: "signed-out",
+    body: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+      /* @__PURE__ */ jsx3(Hero, { kind: "error" }),
+      /* @__PURE__ */ jsx3("h2", { id: titleId, children: "Sign in first" }),
+      /* @__PURE__ */ jsx3("p", { role: "alert", "data-mesub-error": "", children: message }),
+      /* @__PURE__ */ jsx3("p", { "data-mesub-funds": "safe", children: safe }),
+      /* @__PURE__ */ jsx3("button", { type: "button", "data-mesub-done": "", onClick: onClose, children: "Close" })
+    ] })
+  };
+}
+
+// src/checkout.tsx
+import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var SAFE = "Nothing was charged.";
+var PENDING = "Payment may be pending.";
+var FRESH_TERMS = "The terms had expired. These are fresh: check them again.";
+var EXPIRED = "The transaction expired before it was sent. Nothing was charged: approve this one.";
+var EXPIRED_TERMS = "The transaction expired before it was sent, and its terms with it. Nothing was charged: check these.";
+var NOT_LANDED = "The transaction has not landed yet. Wait a moment, then check again: nothing is paid twice.";
+var STATES = {
+  signing: "signing",
+  submitting: "confirming",
+  subscribed: "subscribed"
+};
+var BUSY_WAIT_MAX_S = 10;
+var seconds = (n) => `${n} ${n === 1 ? "second" : "seconds"}`;
+var MARGIN_MS = 5e3;
+function expired(prepared) {
+  const until = Date.parse(prepared.terms.expires_at);
+  return !Number.isNaN(until) && until - Date.now() < MARGIN_MS;
+}
+function dying(prepared) {
+  const until = deadlineOf(prepared);
+  return until !== null && until - Date.now() < MARGIN_MS;
+}
+function singleCharge(plan, terms) {
+  return (terms === void 0 ? null : termsSingleCharge(terms)) ?? chargedOnce(plan);
+}
+var messageOf = (error) => error instanceof MesubClientError ? error.message : "Something went wrong.";
+function notPrepared(error) {
+  const base = { step: "review", moved: "safe", icon: "merchant" };
+  if (unreachable(error)) {
+    return { ...base, title: "No answer", message: messageOf(error), action: "retry" };
+  }
+  const status = error instanceof MesubClientError ? error.status : null;
+  if (status === 403) {
+    return { ...base, title: "Wrong wallet", message: messageOf(error), action: "wallet" };
+  }
+  if (status === 404) {
+    return error instanceof MesubClientError && error.code === "subscription_not_found" ? { ...base, title: "Could not subscribe", message: messageOf(error), action: "retry" } : { ...base, title: "Plan not found", message: messageOf(error), action: "close" };
+  }
+  if (error instanceof MesubClientError && error.code === "comeback_period_rolling") {
+    return {
+      ...base,
+      title: "Almost there",
+      message: error.retryAfter ? `Your billing period is turning over. Try again in ${error.retryAfter} seconds.` : messageOf(error),
+      action: "retry"
+    };
+  }
+  if (status === 409) {
+    return { ...base, title: "Cannot subscribe", message: messageOf(error), action: "close" };
+  }
+  const busy = busyFor(error);
+  if (busy !== null) {
+    return {
+      ...base,
+      title: "Busy right now",
+      message: `Too many requests at once. Try again in ${seconds(busy)}.`,
+      action: "retry"
+    };
+  }
+  if (status === 429) {
+    const wait = error instanceof MesubClientError ? error.retryAfter : null;
+    return {
+      ...base,
+      title: "Too many requests",
+      message: wait ? `Try again in ${wait} seconds.` : messageOf(error),
+      action: "retry"
+    };
+  }
+  return { ...base, title: "Could not subscribe", message: messageOf(error), action: "retry" };
+}
+function Checkout({ plan: slug, onClose, onState, onSubscribed }) {
+  const { api, chain, manageUrl } = useMesubInternal();
+  const wallets = useWallets();
+  const titleId = useId();
+  const [loaded, setLoaded] = useState2({ name: "loading" });
+  const [view, setViewState] = useState2({ name: "plan" });
+  const [checking, setChecking] = useState2(false);
+  const alive = useRef2(true);
+  const attempt = useRef2(0);
+  const shown = useRef2(view);
+  const checkingNow = useRef2(false);
+  const sent = useRef2(null);
+  const expiries = useRef2(0);
+  const latest = useRef2({ onState, onSubscribed });
+  latest.current = { onState, onSubscribed };
+  function setView(next) {
+    shown.current = next;
+    setViewState(next);
+    latest.current.onState(STATES[next.name] ?? "open");
+  }
+  function begin() {
+    const id = ++attempt.current;
+    return () => alive.current && id === attempt.current;
+  }
+  function loadPlan() {
+    setLoaded({ name: "loading" });
+    api.plan(slug).then(
+      (served) => alive.current && setLoaded({ name: "loaded", plan: served }),
+      (error) => alive.current && setLoaded({ name: "failed", error })
+    );
+  }
+  useEffect2(() => {
+    alive.current = true;
+    latest.current.onState("open");
+    loadPlan();
+    return () => {
+      alive.current = false;
+    };
+  }, []);
+  function fail(failure, signer, signature = null) {
+    setView({ name: "failed", failure, signer, signature });
+  }
+  function refused(error, signer) {
+    if (signedOut(error)) setView({ name: "signed-out" });
+    else fail(notPrepared(error), signer);
+  }
+  function notSigned(signer, title, error) {
+    fail(
+      {
+        step: "approve",
+        title,
+        message: error instanceof WalletError ? error.message : `${signer.wallet.name} did not sign.`,
+        moved: "safe",
+        action: "retry",
+        icon: "wallet"
+      },
+      signer
+    );
+  }
+  async function prepare(signer, notice = null) {
+    const current = begin();
+    expiries.current = 0;
+    setView({ name: "preparing", signer });
+    try {
+      const prepared = await api.prepare(slug, signer.account.address);
+      if (current()) setView({ name: "review", signer, prepared, notice });
+    } catch (error) {
+      if (current()) refused(error, signer);
+    }
+  }
+  async function fresh(id) {
+    try {
+      return await api.transaction(id);
+    } catch (error) {
+      if (routeMissing(error)) return null;
+      throw error;
+    }
+  }
+  async function pick(wallet) {
+    if (shown.current.name !== "wallet" || shown.current.pick.name === "waiting") return;
+    const current = begin();
+    const refused2 = (message) => current() && setView({ name: "wallet", pick: { name: "rejected", wallet, message } });
+    setView({ name: "wallet", pick: { name: "waiting", wallet } });
+    let account;
+    try {
+      [account] = await connectAccounts(wallet);
+    } catch (refusal2) {
+      refused2(
+        `${wallet.name} said: ${refusal2 instanceof Error ? refusal2.message : "it did not connect."}`
+      );
+      return;
+    }
+    if (!current()) return;
+    if (!account) {
+      refused2(`${wallet.name} shared no Solana account.`);
+      return;
+    }
+    rememberWallet(wallet.name);
+    await prepare({ wallet, account });
+  }
+  async function sign(signer, prepared, plan) {
+    if (shown.current.name !== "review" || shown.current.prepared !== prepared) return;
+    const single = singleCharge(plan, prepared.terms.message);
+    const current = begin();
+    if (expired(prepared)) {
+      await prepare(signer, FRESH_TERMS);
+      return;
+    }
+    setView({ name: "signing", signer, what: "terms", single, notice: null });
+    let termsSignature;
+    try {
+      termsSignature = await signText(signer, prepared.terms.message);
+    } catch (error) {
+      if (current()) notSigned(signer, "Terms not signed", error);
+      return;
+    }
+    if (!current()) return;
+    if (expired(prepared)) {
+      await prepare(signer, FRESH_TERMS);
+      return;
+    }
+    setView({ name: "signing", signer, what: "fresh", single, notice: null });
+    let latest2;
+    try {
+      latest2 = await fresh(prepared.subscription.id) ?? prepared;
+    } catch (error) {
+      if (current()) refused(error, signer);
+      return;
+    }
+    if (!current()) return;
+    if (latest2.terms.message !== prepared.terms.message) {
+      setView({ name: "review", signer, prepared: latest2, notice: FRESH_TERMS });
+      return;
+    }
+    await pay(signer, latest2, termsSignature, single, null);
+  }
+  async function pay(signer, held, termsSignature, single, notice) {
+    const current = begin();
+    setView({ name: "signing", signer, what: "transaction", single, notice });
+    let signed;
+    try {
+      signed = await signOnly(signer, chain, held.transaction);
+    } catch (error) {
+      if (current()) notSigned(signer, "Transaction not signed", error);
+      return;
+    }
+    if (!current()) return;
+    sent.current = {
+      id: held.subscription.id,
+      signed: { transaction: signed.transaction, terms_signature: termsSignature },
+      signer,
+      signature: signed.signature,
+      cancelUrl: termsCancelUrl(held.terms.message),
+      single,
+      terms: held.terms.message
+    };
+    if (dying(held)) {
+      await renew(sent.current, current);
+      return;
+    }
+    await submit();
+  }
+  async function renew(handed, current) {
+    const { id, signer, single } = handed;
+    const stop = (message) => fail(
+      {
+        step: "confirming",
+        title: "Transaction expired",
+        message,
+        moved: "safe",
+        action: "retry",
+        icon: "merchant"
+      },
+      signer
+    );
+    if (++expiries.current > 1) {
+      stop("The transaction expired again before it could be sent. Try again in a moment.");
+      return;
+    }
+    setView({ name: "signing", signer, what: "fresh", single, notice: EXPIRED });
+    let latest2;
+    try {
+      latest2 = await fresh(id);
+    } catch (error) {
+      if (current()) refused(error, signer);
+      return;
+    }
+    if (!current()) return;
+    if (!latest2) {
+      stop("The transaction expired before it could be sent.");
+      return;
+    }
+    if (latest2.terms.message !== handed.terms) {
+      setView({ name: "review", signer, prepared: latest2, notice: EXPIRED_TERMS });
+      return;
+    }
+    await pay(signer, latest2, handed.signed.terms_signature, single, EXPIRED);
+  }
+  async function submit(waited = false) {
+    const handed = sent.current;
+    if (!handed) return;
+    const { id, signed, signer, signature, cancelUrl, single } = handed;
+    const current = begin();
+    setView({ name: "submitting", signer, signature });
+    try {
+      const settled = await api.submit(id, signed);
+      if (settled.reason) {
+        if (!current()) return;
+        if (settled.reason_code === "transaction_expired") {
+          await renew(handed, current);
+          return;
+        }
+        if (settled.reason_code === "nothing_landed") {
+          fail(
+            {
+              step: "confirming",
+              title: "Still confirming",
+              message: NOT_LANDED,
+              moved: "pending",
+              action: "check",
+              icon: "merchant"
+            },
+            signer,
+            signature
+          );
+          return;
+        }
+        fail(
+          {
+            step: "confirming",
+            title: "Payment did not go through",
+            message: settled.reason,
+            moved: "safe",
+            action: "retry",
+            icon: "merchant"
+          },
+          signer
+        );
+        return;
+      }
+      latest.current.onSubscribed(settled.subscription, signature);
+      if (current()) {
+        setView({
+          name: "subscribed",
+          signer,
+          subscription: settled.subscription,
+          signature,
+          cancelUrl,
+          single
+        });
+      }
+    } catch (error) {
+      if (!current()) return;
+      if (signedOut(error)) {
+        setView({ name: "signed-out" });
+        return;
+      }
+      if (error instanceof MesubClientError && error.code === "transaction_expired") {
+        await renew(handed, current);
+        return;
+      }
+      const busy = busyFor(error);
+      if (busy !== null) {
+        if (!waited && busy <= BUSY_WAIT_MAX_S) {
+          setView({
+            name: "submitting",
+            signer,
+            signature,
+            notice: `Busy right now: sending again in ${seconds(busy)}.`
+          });
+          await new Promise((resolve) => setTimeout(resolve, busy * 1e3));
+          if (current()) await submit(true);
+          return;
+        }
+        fail(
+          {
+            step: "confirming",
+            title: "Busy right now",
+            message: `Too many payments are being sent at once. Wait ${seconds(busy)}, then check again: the same payment is sent, never a second one.`,
+            // The server's own replays may have lost a send before: no way to a second payment.
+            moved: "pending",
+            action: "check",
+            icon: "merchant"
+          },
+          signer,
+          signature
+        );
+        return;
+      }
+      const status = error instanceof MesubClientError ? error.status : null;
+      if (status === null || status >= 500 || !(error instanceof MesubClientError)) {
+        fail(
+          {
+            step: "confirming",
+            title: "Still confirming",
+            message: "No answer yet on what became of the transaction. Wait a minute, then check again: nothing is paid twice.",
+            moved: "pending",
+            action: "check",
+            icon: "merchant"
+          },
+          signer,
+          signature
+        );
+        return;
+      }
+      fail(
+        {
+          step: "confirming",
+          title: "Could not subscribe",
+          message: error.message,
+          moved: "safe",
+          action: "retry",
+          icon: "merchant"
+        },
+        signer
+      );
+    }
+  }
+  async function checkAgain() {
+    if (checkingNow.current) return;
+    checkingNow.current = true;
+    setChecking(true);
+    try {
+      await submit();
+    } finally {
+      checkingNow.current = false;
+      if (alive.current) setChecking(false);
+    }
+  }
+  function toWallets() {
+    attempt.current++;
+    setView({ name: "wallet", pick: { name: "list" } });
+  }
+  function toPlan() {
+    attempt.current++;
+    setView({ name: "plan" });
+  }
+  function act(action, signer) {
+    if (action === "close") onClose();
+    else if (action === "check") void checkAgain();
+    else if (action === "wallet" || !signer) toWallets();
+    else void prepare(signer);
+  }
+  let screen;
+  if (view.name === "signed-out") {
+    screen = signedOutScreen({
+      titleId,
+      step: "review",
+      message: "You are not signed in on this site. Sign in here first, then subscribe again.",
+      safe: SAFE,
+      onClose
+    });
+  } else if (loaded.name !== "loaded") {
+    screen = planScreen(loaded, titleId, loadPlan, onClose);
+  } else if (view.name === "wallet") {
+    screen = walletScreen({
+      titleId,
+      view: view.pick,
+      wallets,
+      purpose: "subscribe",
+      lead: "It pays the subscription. Nothing is signed yet.",
+      setView: (pickView) => {
+        attempt.current++;
+        setView({ name: "wallet", pick: pickView });
+      },
+      pick: (wallet) => void pick(wallet),
+      onBack: toPlan
+    });
+  } else {
+    screen = stageScreen({
+      view,
+      plan: loaded.plan,
+      chain,
+      manageUrl,
+      titleId,
+      checking,
+      onContinue: toWallets,
+      onSign: (signer, prepared) => void sign(signer, prepared, loaded.plan),
+      onAct: act,
+      onWallets: toWallets,
+      onClose
+    });
+  }
+  return /* @__PURE__ */ jsx4(MesubDialog, { screen, titleId, onClose });
+}
+function planScreen(loaded, titleId, reload, close) {
+  if (loaded.name === "loading") {
+    return {
+      step: "plan",
+      view: "plan-loading",
+      body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+        /* @__PURE__ */ jsx4(Hero, { kind: "wait" }),
+        /* @__PURE__ */ jsx4("h2", { id: titleId, children: "Subscribe" }),
+        /* @__PURE__ */ jsx4("p", { "data-mesub-notice": "", role: "status", "aria-busy": "true", children: "Loading the plan" })
+      ] })
+    };
+  }
+  const silent = unreachable(loaded.error);
+  return {
+    step: "plan",
+    view: "plan-failed",
+    body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+      /* @__PURE__ */ jsx4(Hero, { kind: "error" }),
+      /* @__PURE__ */ jsx4("h2", { id: titleId, children: silent ? "No answer" : "Plan not found" }),
+      /* @__PURE__ */ jsx4("p", { role: "alert", "data-mesub-error": "", children: loaded.error instanceof MesubClientError ? loaded.error.message : "Could not read this plan." }),
+      /* @__PURE__ */ jsx4("p", { "data-mesub-funds": "safe", children: SAFE }),
+      silent ? /* @__PURE__ */ jsx4("button", { type: "button", "data-mesub-submit": "", onClick: reload, children: "Try again" }) : /* @__PURE__ */ jsx4("button", { type: "button", "data-mesub-done": "", onClick: close, children: "Close" })
+    ] })
+  };
+}
+function stageScreen(props) {
+  const { view, plan, chain, titleId } = props;
+  const { text: price, title: exact } = briefPrice(plan);
+  const ends = planEnd(plan.ends_at);
+  const single = view.name === "review" ? singleCharge(plan, view.prepared.terms.message) : view.name === "signing" || view.name === "subscribed" ? view.single : singleCharge(plan);
+  const every = single ? "once" : cadence(plan.period_hours);
+  const merchant = /* @__PURE__ */ jsx4(
+    Merchant,
+    {
+      name: plan.project_name,
+      logoUrl: plan.logo_url,
+      testNetwork: plan.network !== "mainnet-beta"
+    }
+  );
+  if (view.name === "failed") {
+    const { failure, signer } = view;
+    return failureScreen({
+      failure,
+      titleId,
+      icon: failure.icon === "wallet" ? signer?.wallet.icon : plan.logo_url,
+      safe: SAFE,
+      pending: PENDING,
+      signature: view.signature,
+      chain,
+      busy: props.checking,
+      onAct: (action) => props.onAct(action, signer),
+      onBack: props.onWallets,
+      backLabel: "Use another wallet"
+    });
+  }
+  if (view.name === "plan") {
+    if (!plan.available) {
+      return {
+        step: "plan",
+        view: "plan-closed",
+        body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+          /* @__PURE__ */ jsx4(Hero, { kind: "error", icon: plan.logo_url }),
+          /* @__PURE__ */ jsx4("h2", { id: titleId, children: "Plan closed" }),
+          /* @__PURE__ */ jsx4("p", { role: "alert", "data-mesub-error": "", children: "This plan is not taking new subscribers right now." }),
+          /* @__PURE__ */ jsx4("p", { "data-mesub-funds": "safe", children: SAFE }),
+          /* @__PURE__ */ jsx4("button", { type: "button", "data-mesub-done": "", onClick: props.onClose, children: "Close" })
+        ] })
+      };
+    }
+    return {
+      step: "plan",
+      view: "plan",
+      body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+        merchant,
+        /* @__PURE__ */ jsx4("h2", { id: titleId, children: plan.name }),
+        /* @__PURE__ */ jsx4(Price, { plan, every, single }),
+        ends ? /* @__PURE__ */ jsx4("p", { "data-mesub-ends": "", children: single ? `Access until ${ends}, when the plan ends. Nothing more is charged.` : `Ends on ${ends}` }) : null,
+        plan.description ? /* @__PURE__ */ jsx4("p", { "data-mesub-description": "", children: plan.description }) : null,
+        /* @__PURE__ */ jsx4("button", { type: "button", "data-mesub-submit": "", onClick: props.onContinue, children: "Continue with a wallet" }),
+        /* @__PURE__ */ jsx4("button", { type: "button", "data-mesub-cancel": "", onClick: props.onClose, children: "Cancel" })
+      ] })
+    };
+  }
+  const { wallet, account } = view.signer;
+  if (view.name === "preparing") {
+    return {
+      step: "wallet",
+      view: "preparing",
+      onBack: props.onWallets,
+      body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+        /* @__PURE__ */ jsx4(Hero, { kind: "wait", icon: wallet.icon }),
+        /* @__PURE__ */ jsx4("h2", { id: titleId, children: "Preparing your subscription" }),
+        /* @__PURE__ */ jsx4("p", { "data-mesub-notice": "", role: "status", "aria-busy": "true", children: "Nothing to sign yet" })
+      ] })
+    };
+  }
+  if (view.name === "review") {
+    const { terms } = view.prepared;
+    const nextCharge2 = new Date(Date.now() + plan.period_hours * 36e5);
+    const chargedAgain = !single && !chargedOnce(plan);
+    return {
+      step: "review",
+      view: "review",
+      onBack: props.onWallets,
+      body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+        merchant,
+        /* @__PURE__ */ jsx4("h2", { id: titleId, children: plan.name }),
+        /* @__PURE__ */ jsx4(Price, { plan, every, single }),
+        view.notice ? /* @__PURE__ */ jsx4("p", { "data-mesub-notice": "", role: "status", children: view.notice }) : null,
+        /* @__PURE__ */ jsxs3("dl", { "data-mesub-summary": "", children: [
+          /* @__PURE__ */ jsxs3("div", { "data-mesub-row": "", children: [
+            /* @__PURE__ */ jsx4("dt", { children: "Pays from" }),
+            /* @__PURE__ */ jsxs3("dd", { title: account.address, children: [
+              /* @__PURE__ */ jsx4("img", { src: wallet.icon, alt: "", width: 16, height: 16 }),
+              shortAddress(account.address)
+            ] })
+          ] }),
+          chargedAgain ? /* @__PURE__ */ jsxs3("div", { "data-mesub-row": "", children: [
+            /* @__PURE__ */ jsx4("dt", { children: "Next charge" }),
+            /* @__PURE__ */ jsx4("dd", { children: moment(nextCharge2.toISOString()) })
+          ] }) : null,
+          ends ? /* @__PURE__ */ jsxs3("div", { "data-mesub-row": "", children: [
+            /* @__PURE__ */ jsx4("dt", { children: single ? "Access until" : "Plan ends" }),
+            /* @__PURE__ */ jsx4("dd", { children: ends })
+          ] }) : null
+        ] }),
+        /* @__PURE__ */ jsxs3("details", { "data-mesub-terms": "", children: [
+          /* @__PURE__ */ jsx4("summary", { children: "The terms you sign" }),
+          /* @__PURE__ */ jsx4("dl", { "data-mesub-summary": "", children: termsFacts(terms.message, plan).map((fact2) => /* @__PURE__ */ jsxs3("div", { "data-mesub-row": "", children: [
+            /* @__PURE__ */ jsx4("dt", { children: fact2.label }),
+            /* @__PURE__ */ jsxs3("dd", { title: fact2.full, children: [
+              fact2.href ? /* @__PURE__ */ jsx4(
+                "a",
+                {
+                  "data-mesub-token": "",
+                  href: fact2.href,
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  children: fact2.value
+                }
+              ) : fact2.value,
+              fact2.note ? /* @__PURE__ */ jsxs3("small", { children: [
+                " ",
+                fact2.note
+              ] }) : null
+            ] })
+          ] }, fact2.label)) })
+        ] }),
+        /* @__PURE__ */ jsxs3("p", { "data-mesub-footnote": "", children: [
+          "Two approvals in ",
+          wallet.name,
+          ": the terms, then the payment.",
+          " ",
+          single ? "Nothing more is charged." : "Cancel anytime."
+        ] }),
+        /* @__PURE__ */ jsxs3(
+          "button",
+          {
+            type: "button",
+            "data-mesub-submit": "",
+            title: exact,
+            "data-mesub-fit": fit(price),
+            onClick: () => props.onSign(view.signer, view.prepared),
+            children: [
+              "Sign and pay ",
+              price
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx4("button", { type: "button", "data-mesub-cancel": "", onClick: props.onClose, children: "Cancel" })
+      ] })
+    };
+  }
+  if (view.name === "signing") {
+    const terms = view.what === "terms";
+    const notice = view.notice ? /* @__PURE__ */ jsx4("p", { "data-mesub-notice": "", role: "status", children: view.notice }) : null;
+    if (view.what === "fresh") {
+      return {
+        step: "approve",
+        view: "approve-fresh",
+        onBack: props.onWallets,
+        body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+          /* @__PURE__ */ jsx4(Hero, { kind: "wait", icon: wallet.icon }),
+          /* @__PURE__ */ jsx4("h2", { id: titleId, children: "Preparing the payment" }),
+          notice,
+          /* @__PURE__ */ jsx4("p", { "data-mesub-notice": "", role: "status", "aria-busy": "true", children: "Nothing to approve yet" }),
+          /* @__PURE__ */ jsx4("button", { type: "button", "data-mesub-cancel": "", onClick: props.onClose, children: "Cancel" })
+        ] })
+      };
+    }
+    return {
+      step: "approve",
+      view: `approve-${view.what}`,
+      onBack: props.onWallets,
+      body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+        /* @__PURE__ */ jsx4(Hero, { kind: "wait", icon: wallet.icon }),
+        /* @__PURE__ */ jsxs3("h2", { id: titleId, children: [
+          terms ? "Sign the terms" : "Approve the payment",
+          " in ",
+          wallet.name
+        ] }),
+        /* @__PURE__ */ jsx4("p", { title: terms ? void 0 : exact, children: terms ? "Step 1 of 2: a message, it moves nothing." : single ? `Step 2 of 2: ${price} now, a single charge.` : `Step 2 of 2: ${price} now, then ${price} ${every}.` }),
+        notice,
+        /* @__PURE__ */ jsx4("button", { type: "button", "data-mesub-cancel": "", onClick: props.onClose, children: "Cancel" })
+      ] })
+    };
+  }
+  if (view.name === "submitting") {
+    return {
+      step: "confirming",
+      view: "confirming",
+      body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+        /* @__PURE__ */ jsx4(Hero, { kind: "wait", icon: plan.logo_url }),
+        /* @__PURE__ */ jsx4("h2", { id: titleId, children: "Confirming on Solana" }),
+        /* @__PURE__ */ jsx4("p", { children: "This can take up to a minute." }),
+        view.notice ? /* @__PURE__ */ jsx4("p", { "data-mesub-notice": "", role: "status", children: view.notice }) : null,
+        view.signature ? /* @__PURE__ */ jsx4(
+          Explorer,
+          {
+            signature: view.signature,
+            chain,
+            label: "View transaction"
+          }
+        ) : null
+      ] })
+    };
+  }
+  const nextCharge = view.single ? null : moment(view.subscription.next_charge_at);
+  const accessUntil = view.single ? ends ?? moment(view.subscription.access_until) : null;
+  const manage = manageLink(props.manageUrl, view.cancelUrl);
+  return {
+    step: "subscribed",
+    view: "subscribed",
+    body: /* @__PURE__ */ jsxs3(Fragment3, { children: [
+      /* @__PURE__ */ jsx4(Hero, { kind: "check" }),
+      /* @__PURE__ */ jsx4("h2", { id: titleId, children: "You are subscribed" }),
+      /* @__PURE__ */ jsxs3("p", { title: exact, children: [
+        plan.name,
+        ", ",
+        price,
+        " ",
+        every
+      ] }),
+      /* @__PURE__ */ jsxs3("dl", { "data-mesub-summary": "", children: [
+        /* @__PURE__ */ jsxs3("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx4("dt", { children: "Paid today" }),
+          /* @__PURE__ */ jsxs3("dd", { title: exact, children: [
+            price,
+            planUsd(plan) ? /* @__PURE__ */ jsx4("small", { children: planUsd(plan) }) : null
+          ] })
+        ] }),
+        nextCharge ? /* @__PURE__ */ jsxs3("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx4("dt", { children: "Next charge" }),
+          /* @__PURE__ */ jsx4("dd", { children: nextCharge })
+        ] }) : null,
+        accessUntil ? /* @__PURE__ */ jsxs3("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx4("dt", { children: "Access until" }),
+          /* @__PURE__ */ jsx4("dd", { children: accessUntil })
+        ] }) : null,
+        /* @__PURE__ */ jsxs3("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx4("dt", { children: "Pays from" }),
+          /* @__PURE__ */ jsxs3("dd", { title: account.address, children: [
+            /* @__PURE__ */ jsx4("img", { src: wallet.icon, alt: "", width: 16, height: 16 }),
+            shortAddress(account.address)
+          ] })
+        ] }),
+        view.signature ? /* @__PURE__ */ jsxs3("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx4("dt", { children: "Receipt" }),
+          /* @__PURE__ */ jsx4("dd", { children: /* @__PURE__ */ jsx4(Explorer, { signature: view.signature, chain, label: "View" }) })
+        ] }) : null
+      ] }),
+      /* @__PURE__ */ jsx4("button", { type: "button", "data-mesub-done": "", onClick: props.onClose, children: "Done" }),
+      manage ? /* @__PURE__ */ jsx4(
+        "a",
+        {
+          "data-mesub-manage": "",
+          "data-mesub-external": manage.external ? "" : void 0,
+          href: manage.href,
+          ...manage.external && { target: "_blank", rel: "noopener noreferrer" },
+          children: "Cancel any time"
+        }
+      ) : null
+    ] })
+  };
+}
+
+// src/manage.tsx
+import { useWallets as useWallets2 } from "@wallet-standard/react";
+import { useEffect as useEffect3, useId as useId2, useRef as useRef3, useState as useState3 } from "react";
+import { Fragment as Fragment4, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+var FIND_TIMEOUT_MS = 4e3;
+var SAFE2 = "Nothing changed.";
+var PENDING2 = "The transaction may still land.";
+var WORDS = {
+  cancel: {
+    ask: "Cancel",
+    go: "Cancel subscription",
+    keep: "Keep it",
+    done: "Subscription cancelled"
+  },
+  resume: {
+    ask: "Resume",
+    go: "Resume subscription",
+    keep: "Not now",
+    done: "Subscription resumed"
+  },
+  close: { ask: "Close", go: "Close subscription", keep: "Not now", done: "Subscription closed" }
+};
+var messageOf2 = (error) => error instanceof MesubClientError ? error.message : "Something went wrong.";
+var NOT_YET = ["cancellation_not_landed", "resume_not_landed", "close_not_landed"];
+function unsettled(action, settled) {
+  const code = settled.reason_code;
+  if (code === "transaction_expired") {
+    return {
+      step: "confirming",
+      title: "Transaction expired",
+      message: "The transaction expired before it landed. Try again with a new one.",
+      moved: "safe",
+      action: "retry",
+      icon: "wallet"
+    };
+  }
+  if (code && NOT_YET.includes(code)) {
+    return {
+      step: "confirming",
+      title: "Still confirming",
+      message: `The ${action} has not landed yet. Wait a moment, then check again.`,
+      moved: "pending",
+      action: "check",
+      icon: "wallet"
+    };
+  }
+  return {
+    step: "confirming",
+    title: "It did not go through",
+    message: settled.reason,
+    moved: "safe",
+    action: "retry",
+    icon: "wallet"
+  };
+}
+function consequence(action, subscription, planEndsAt) {
+  const end = subscription.access_until ?? subscription.current_period_end;
+  const until = moment(end);
+  if (action === "cancel") {
+    return subscription.access && until ? `You keep access until ${until}. Nothing more is charged.` : "It stops now. Nothing more is charged.";
+  }
+  if (action === "resume") {
+    if (end && until && noChargeAt(Date.parse(end), planEndsAt)) {
+      return `It runs again until ${planEnd(planEndsAt)}, when the plan ends. Nothing more is charged.`;
+    }
+    return until ? `Charges start again on ${until}, as before.` : "Charges start again, as before.";
+  }
+  return "It is over. Closing it returns its deposit to your wallet.";
+}
+function outcome(action, subscription) {
+  const until = moment(subscription.access_until ?? subscription.current_period_end);
+  if (action === "cancel") {
+    return subscription.access && until ? `You keep access until ${until}.` : "Nothing more is charged.";
+  }
+  if (action === "resume") {
+    const next = moment(subscription.next_charge_at);
+    if (next) return `Next charge ${next}.`;
+    return subscription.access && until ? `You keep access until ${until}.` : "It runs again.";
+  }
+  return "Its deposit is back in your wallet.";
+}
+function Manage({ subscription, action, onClose, onChanged }) {
+  const { api, chain, plan: readPlan } = useMesubInternal();
+  const wallets = useWallets2();
+  const titleId = useId2();
+  const words = WORDS[action];
+  const payer = subscription.wallet;
+  const [view, setViewState] = useState3({ name: "confirm" });
+  const [checking, setChecking] = useState3(false);
+  const [planName, setPlanName] = useState3(subscription.plan ?? "this subscription");
+  const [planEndsAt, setPlanEndsAt] = useState3(null);
+  const alive = useRef3(true);
+  const attempt = useRef3(0);
+  const shown = useRef3(view);
+  const checkingNow = useRef3(false);
+  const latest = useRef3({ wallets, onChanged });
+  latest.current = { wallets, onChanged };
+  function setView(next) {
+    shown.current = next;
+    setViewState(next);
+  }
+  function begin() {
+    const id = ++attempt.current;
+    return () => alive.current && id === attempt.current;
+  }
+  useEffect3(() => {
+    alive.current = true;
+    if (subscription.plan) {
+      readPlan(subscription.plan).then(
+        (served) => {
+          if (!alive.current) return;
+          setPlanName(served.name);
+          setPlanEndsAt(served.ends_at);
+        },
+        () => void 0
+      );
+    }
+    return () => {
+      alive.current = false;
+    };
+  }, []);
+  function fail(failure, signer, signature = null, icon = signer?.wallet.icon) {
+    setView({ name: "failed", failure, signer, signature, icon });
+  }
+  async function start() {
+    if (shown.current.name !== "confirm") return;
+    const current = begin();
+    setView({ name: "finding" });
+    const signer = await Promise.race([
+      findConnected(latest.current.wallets, payer, "manage"),
+      new Promise((resolve) => setTimeout(() => resolve(null), FIND_TIMEOUT_MS))
+    ]);
+    if (!current()) return;
+    if (signer) await run(signer);
+    else setView({ name: "wallet", pick: { name: "list" } });
+  }
+  async function pick(wallet) {
+    if (shown.current.name !== "wallet" || shown.current.pick.name === "waiting") return;
+    const current = begin();
+    setView({ name: "wallet", pick: { name: "waiting", wallet } });
+    let accounts;
+    try {
+      accounts = await connectAccounts(wallet);
+    } catch (refusal2) {
+      if (!current()) return;
+      const message = `${wallet.name} said: ${refusal2 instanceof Error ? refusal2.message : "it did not connect."}`;
+      setView({ name: "wallet", pick: { name: "rejected", wallet, message } });
+      return;
+    }
+    if (!current()) return;
+    const account = accounts.find((entry) => entry.address === payer);
+    if (!account) {
+      const on = accounts[0] ? `${wallet.name} is on ${shortAddress(accounts[0].address)}` : `${wallet.name} shared no Solana account`;
+      fail(
+        {
+          step: "wallet",
+          title: "Wrong wallet",
+          message: `${on}, and this subscription is paid from ${shortAddress(payer)}. Switch to that account in your wallet, then try again.`,
+          moved: "safe",
+          action: "wallet",
+          icon: "wallet"
+        },
+        null,
+        null,
+        wallet.icon
+      );
+      return;
+    }
+    rememberWallet(wallet.name);
+    await run({ wallet, account });
+  }
+  async function run(signer) {
+    const current = begin();
+    setView({ name: "building", signer });
+    let transaction;
+    try {
+      ({ transaction } = await api.build(action, subscription.id));
+    } catch (error) {
+      if (!current()) return;
+      if (signedOut(error)) {
+        setView({ name: "signed-out" });
+        return;
+      }
+      const refused = error instanceof MesubClientError && error.status !== null;
+      fail(
+        {
+          step: "approve",
+          title: refused ? `Cannot ${action} it` : "No answer",
+          message: messageOf2(error),
+          moved: "safe",
+          // Mesub's refusal is final for now; a silence is worth another try.
+          action: refused && error.status !== 429 ? "close" : "retry",
+          icon: "wallet"
+        },
+        signer
+      );
+      return;
+    }
+    if (!current()) return;
+    setView({ name: "approve", signer });
+    let signature;
+    try {
+      signature = await signAndSend(signer, chain, transaction);
+    } catch (error) {
+      if (!current()) return;
+      fail(
+        {
+          step: "approve",
+          title: "Not approved",
+          message: error instanceof WalletError ? error.message : `${signer.wallet.name} did not send it.`,
+          moved: "safe",
+          action: "retry",
+          icon: "wallet"
+        },
+        signer
+      );
+      return;
+    }
+    latest.current.onChanged(null);
+    if (!current()) return;
+    await confirm(signer, signature);
+  }
+  async function confirm(signer, signature) {
+    const current = begin();
+    setView({ name: "confirming", signer, signature });
+    try {
+      const settled = await api.confirm(action, subscription.id, signature);
+      latest.current.onChanged(settled.reason ? null : settled.subscription);
+      if (!current()) return;
+      if (settled.reason) {
+        const failure = unsettled(action, settled);
+        fail(failure, signer, failure.moved === "pending" ? signature : null);
+        return;
+      }
+      setView({ name: "done", subscription: settled.subscription, signature });
+    } catch (error) {
+      if (!current()) return;
+      if (signedOut(error)) {
+        setView({ name: "signed-out" });
+        return;
+      }
+      const status = error instanceof MesubClientError ? error.status : null;
+      const refused = status !== null && status < 500;
+      fail(
+        refused ? {
+          step: "confirming",
+          title: `Cannot ${action} it`,
+          message: messageOf2(error),
+          moved: null,
+          action: "close",
+          icon: "wallet"
+        } : {
+          step: "confirming",
+          title: "Still confirming",
+          message: `If ${signer.wallet.name} shows the transaction as sent, wait a minute, then check again.`,
+          moved: "pending",
+          action: "check",
+          icon: "wallet"
+        },
+        signer,
+        signature
+      );
+    }
+  }
+  async function checkAgain(signer, signature) {
+    if (checkingNow.current) return;
+    checkingNow.current = true;
+    setChecking(true);
+    try {
+      await confirm(signer, signature);
+    } finally {
+      checkingNow.current = false;
+      if (alive.current) setChecking(false);
+    }
+  }
+  function toWallets() {
+    attempt.current++;
+    setView({ name: "wallet", pick: { name: "list" } });
+  }
+  function toConfirm() {
+    attempt.current++;
+    setView({ name: "confirm" });
+  }
+  let screen;
+  if (view.name === "signed-out") {
+    screen = signedOutScreen({
+      titleId,
+      step: "confirm",
+      message: "You are not signed in on this site. Sign in here first, then try again.",
+      safe: SAFE2,
+      onClose
+    });
+  } else if (view.name === "wallet") {
+    screen = walletScreen({
+      titleId,
+      view: view.pick,
+      wallets,
+      purpose: "manage",
+      lead: `The one that pays this subscription: ${shortAddress(payer)}.`,
+      setView: (pickView) => {
+        attempt.current++;
+        setView({ name: "wallet", pick: pickView });
+      },
+      pick: (wallet) => void pick(wallet),
+      onBack: toConfirm
+    });
+  } else if (view.name === "failed") {
+    const { failure, signer, signature } = view;
+    screen = failureScreen({
+      failure,
+      titleId,
+      icon: view.icon,
+      safe: SAFE2,
+      pending: PENDING2,
+      signature,
+      chain,
+      busy: checking,
+      onAct: (next) => {
+        if (next === "close") onClose();
+        else if (next === "check" && signer && signature) {
+          void checkAgain(signer, signature);
+        } else if (next === "wallet" || !signer) toWallets();
+        else void run(signer);
+      },
+      onBack: toConfirm,
+      backLabel: "Back"
+    });
+  } else if (view.name === "confirm") {
+    screen = {
+      step: "confirm",
+      view: "confirm",
+      body: /* @__PURE__ */ jsxs4(Fragment4, { children: [
+        /* @__PURE__ */ jsxs4("h2", { id: titleId, children: [
+          words.ask,
+          " ",
+          planName,
+          "?"
+        ] }),
+        /* @__PURE__ */ jsx5("p", { children: consequence(action, subscription, planEndsAt) }),
+        /* @__PURE__ */ jsx5("dl", { "data-mesub-summary": "", children: /* @__PURE__ */ jsxs4("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx5("dt", { children: "Signed by" }),
+          /* @__PURE__ */ jsx5("dd", { title: payer, children: shortAddress(payer) })
+        ] }) }),
+        /* @__PURE__ */ jsx5("button", { type: "button", "data-mesub-submit": "", onClick: () => void start(), children: words.go }),
+        /* @__PURE__ */ jsx5("button", { type: "button", "data-mesub-cancel": "", onClick: onClose, children: words.keep })
+      ] })
+    };
+  } else if (view.name === "finding" || view.name === "building") {
+    screen = {
+      step: "wallet",
+      view: view.name,
+      onBack: toConfirm,
+      body: /* @__PURE__ */ jsxs4(Fragment4, { children: [
+        /* @__PURE__ */ jsx5(
+          Hero,
+          {
+            kind: "wait",
+            icon: view.name === "building" ? view.signer.wallet.icon : null
+          }
+        ),
+        /* @__PURE__ */ jsx5("h2", { id: titleId, children: view.name === "finding" ? "Looking for your wallet" : "Preparing" }),
+        /* @__PURE__ */ jsx5("p", { "data-mesub-notice": "", role: "status", "aria-busy": "true", children: "Nothing to sign yet" })
+      ] })
+    };
+  } else if (view.name === "approve") {
+    screen = {
+      step: "approve",
+      view: "approve",
+      onBack: toConfirm,
+      body: /* @__PURE__ */ jsxs4(Fragment4, { children: [
+        /* @__PURE__ */ jsx5(Hero, { kind: "wait", icon: view.signer.wallet.icon }),
+        /* @__PURE__ */ jsxs4("h2", { id: titleId, children: [
+          "Approve in ",
+          view.signer.wallet.name
+        ] }),
+        /* @__PURE__ */ jsx5("p", { children: "One transaction, sent by your wallet. It pays nothing but the network fee." }),
+        /* @__PURE__ */ jsx5("button", { type: "button", "data-mesub-cancel": "", onClick: onClose, children: "Cancel" })
+      ] })
+    };
+  } else if (view.name === "confirming") {
+    screen = {
+      step: "confirming",
+      view: "confirming",
+      body: /* @__PURE__ */ jsxs4(Fragment4, { children: [
+        /* @__PURE__ */ jsx5(Hero, { kind: "wait", icon: view.signer.wallet.icon }),
+        /* @__PURE__ */ jsx5("h2", { id: titleId, children: "Confirming on Solana" }),
+        /* @__PURE__ */ jsx5("p", { children: "This can take up to a minute." }),
+        /* @__PURE__ */ jsx5(Explorer, { signature: view.signature, chain, label: "View transaction" })
+      ] })
+    };
+  } else {
+    screen = {
+      step: "done",
+      view: "done",
+      body: /* @__PURE__ */ jsxs4(Fragment4, { children: [
+        /* @__PURE__ */ jsx5(Hero, { kind: "check" }),
+        /* @__PURE__ */ jsx5("h2", { id: titleId, children: words.done }),
+        /* @__PURE__ */ jsx5("p", { children: outcome(action, view.subscription) }),
+        /* @__PURE__ */ jsx5(Explorer, { signature: view.signature, chain, label: "View transaction" }),
+        /* @__PURE__ */ jsx5("button", { type: "button", "data-mesub-done": "", onClick: onClose, children: "Done" })
+      ] })
+    };
+  }
+  return /* @__PURE__ */ jsx5(MesubDialog, { screen, titleId, onClose });
+}
+
+// src/detail.tsx
+import { useEffect as useEffect5, useId as useId3, useState as useState5 } from "react";
+
+// src/detail-logic.ts
+var LIVE = ["active", "unpaid", "cancelled", "stopped"];
+var NOT_ONE = ["pending", "expired", "failed", "superseded"];
+function pickSubscription(rows, plan) {
+  const theirs = rows.filter((row) => !NOT_ONE.includes(row.status)).filter((row) => plan === void 0 || row.plan === plan).sort((a, b) => Date.parse(b.created_at) - Date.parse(a.created_at));
+  return theirs.find((row) => LIVE.includes(row.status)) ?? theirs[0] ?? null;
+}
+var REASONS = {
+  insufficient_balance: "low balance",
+  // The token program's OwnerMismatch: the wallet revoked Mesub's approval, or gave it to another app.
+  program_4: "approval was removed"
+};
+var snake = (reason) => reason.replace(/[-:]/g, "_");
+function paymentSaid(payment) {
+  const why = payment.reason ? REASONS[snake(payment.reason)] : void 0;
+  switch (payment.outcome) {
+    case "paid":
+      return { label: "Paid", tone: "good" };
+    case "rejected":
+      return { label: why ? `Missed, ${why}` : "Missed", tone: "bad" };
+    case "skipped":
+      return { label: "Skipped", tone: "none" };
+    case "blocked":
+      return { label: "Not charged", tone: "none" };
+    default:
+      return { label: payment.outcome.toLowerCase().replace(/_/g, " "), tone: "none" };
+  }
+}
+function paidIn(amount, plan, format) {
+  if (!plan || !/^\d+$/.test(amount)) return null;
+  return `${grouped(format(amount, plan.decimals))}${symbolOf(plan)}`;
+}
+function paidBrief(amount, plan, format) {
+  if (!plan || !/^\d+$/.test(amount)) return null;
+  const { vouched } = tokenOf({ mint: "", ...plan });
+  return brief(format(amount, plan.decimals), vouched, symbolOf(plan));
+}
+function symbolOf(plan) {
+  if (!plan) return "";
+  const token = tokenOf({ mint: "", ...plan });
+  return token.named ? ` ${token.unit}` : "";
+}
+function retryOf(of) {
+  const { retry_number: number, retries_allowed: allowed } = of;
+  if (!Number.isInteger(number) || !Number.isInteger(allowed)) return null;
+  return number > 0 && allowed > 0 ? `${number} / ${allowed}` : null;
+}
+
+// src/subscriptions.tsx
+import {
+  forwardRef,
+  useCallback,
+  useEffect as useEffect4,
+  useRef as useRef4,
+  useState as useState4
+} from "react";
+import { Fragment as Fragment5, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+var HELD = /* @__PURE__ */ new Set(["active", "cancelled", "unpaid", "stopped", "ended"]);
+function closesAt(subscription) {
+  return Date.parse(
+    subscription.closable_from ?? subscription.access_until ?? subscription.current_period_end ?? ""
+  );
+}
+function actionOf(subscription, now) {
+  const { status } = subscription;
+  if (subscription.closable === true) return "close";
+  if (status === "stopped" && subscription.stop_reason === "authority_closed") return null;
+  if (status === "active" || status === "unpaid" || status === "stopped") return "cancel";
+  if (status === "cancelled") {
+    const end = closesAt(subscription);
+    if (!Number.isNaN(end) && end <= now) return "close";
+    return subscription.access ? "resume" : null;
+  }
+  if (status === "ended") {
+    if (subscription.closable === false) return null;
+    const closed = ["closed", "closed_elsewhere", "authority_closed"].includes(
+      subscription.end_reason ?? ""
+    );
+    return closed ? null : "close";
+  }
+  return null;
+}
+function payableOf(row, now) {
+  if (row.status !== "unpaid" || row.paused || row.blocked_since) return false;
+  if (row.late_reason === "approval_revoked" || row.late_reason === "authority_closed") {
+    return false;
+  }
+  const deadline = Date.parse(row.retry_deadline ?? "");
+  return Number.isNaN(deadline) || deadline > now;
+}
+var PAY_NOW_SENT = "Payment sent. It shows here once the network confirms it.";
+function payNowRefusal(failure) {
+  if (!(failure instanceof MesubClientError)) return "Something went wrong.";
+  switch (failure.code) {
+    case "insufficient_balance":
+      return `${failure.message} Add funds, then pay again: no retry was spent.`;
+    case "retry_too_soon": {
+      const minutes = failure.retryAfter === null ? null : Math.ceil(failure.retryAfter / 60);
+      return minutes === null ? failure.message : `You can pay again in ${minutes} ${minutes === 1 ? "minute" : "minutes"}.`;
+    }
+    case "unavailable": {
+      return busyFor(failure) === null ? failure.message : "Mesub can't take the payment right now. Nothing was charged.";
+    }
+    case "retries_spent":
+      return "No retries are left for this period.";
+    case "retry_deadline_passed":
+      return "It is too late to pay this period: the subscription stops at its end.";
+    default:
+      return failure.message;
+  }
+}
+function useSubscriptions() {
+  const { api, revision, manage: open } = useMesubInternal();
+  const [state, setState] = useState4("loading");
+  const [rows, setRows] = useState4([]);
+  const [error, setError] = useState4(null);
+  const [now, setNow] = useState4(() => Date.now());
+  const read = useRef4(0);
+  const alive = useRef4(true);
+  useEffect4(() => {
+    alive.current = true;
+    return () => {
+      alive.current = false;
+    };
+  }, []);
+  const reload = useCallback(async () => {
+    const id = ++read.current;
+    try {
+      const served = await api.subscriptions();
+      if (!alive.current || id !== read.current) return;
+      setRows(served.filter((row) => HELD.has(row.status)));
+      setNow(Date.now());
+      setError(null);
+      setState("ready");
+    } catch (failure) {
+      if (!alive.current || id !== read.current) return;
+      if (signedOut(failure)) {
+        setRows([]);
+        setError(null);
+        setState("signed-out");
+        return;
+      }
+      setError(
+        failure instanceof MesubClientError ? failure.message : "Something went wrong."
+      );
+      setState("error");
+    }
+  }, [api]);
+  useEffect4(() => {
+    void reload();
+  }, [reload, revision]);
+  useEffect4(() => {
+    const ends = rows.filter((row) => row.status === "cancelled").map(closesAt).filter((end) => !Number.isNaN(end) && end > now);
+    if (ends.length === 0) return;
+    const wait = Math.min(Math.min(...ends) - now + 1e3, 2e9);
+    const timer = setTimeout(() => setNow(Date.now()), wait);
+    return () => clearTimeout(timer);
+  }, [rows, now]);
+  const subscriptions = rows.map((row) => ({
+    ...row,
+    action: actionOf(row, now),
+    payable: payableOf(row, now)
+  }));
+  const latest = useRef4(subscriptions);
+  latest.current = subscriptions;
+  const manage = useCallback(
+    async (id) => {
+      const held = latest.current.find((row) => row.id === id);
+      if (!held?.action) return null;
+      const { action, payable: _, ...subscription } = held;
+      return open({ subscription, action });
+    },
+    [open]
+  );
+  const payNow = useCallback(
+    async (id) => {
+      try {
+        await api.payNow(id);
+      } catch (failure) {
+        const wait = busyFor(failure);
+        return {
+          ok: false,
+          message: payNowRefusal(failure),
+          ...wait === null ? {} : { retryAfter: wait }
+        };
+      }
+      void reload();
+      return { ok: true, message: PAY_NOW_SENT };
+    },
+    [api, reload]
+  );
+  return { state, subscriptions, error, reload, payNow, manage };
+}
+var STATUS = {
+  active: "Active",
+  unpaid: "Payment late",
+  cancelled: "Cancelled",
+  stopped: "Stopped",
+  ended: "Ended"
+};
+var ACTION = { cancel: "Cancel", resume: "Resume", close: "Close" };
+function fact(row) {
+  const pick = (term, iso) => {
+    const date = moment(iso);
+    return date ? { term, date } : null;
+  };
+  if (row.status === "cancelled") {
+    return pick("Access until", row.access_until ?? row.current_period_end);
+  }
+  if (row.status === "unpaid") {
+    return pick("Next try", row.next_retry_at) ?? pick("Pay by", row.retry_deadline);
+  }
+  if (row.status === "active") {
+    return pick("Next charge", row.next_charge_at) ?? pick("Access until", row.access_until);
+  }
+  return null;
+}
+function closeFrom(row) {
+  if (row.closable !== false || row.action === "close") return null;
+  return moment(row.closable_from);
+}
+function stoppedNote(row) {
+  const open = "Its subscription account stays open on your wallet, so the plan's owner could still charge it: cancel it if you are not coming back.";
+  switch (row.stop_reason) {
+    case "out_of_retries":
+      return `Stopped: every retry of the missed payment failed, and your access has ended. ${open}`;
+    case "retry_deadline_passed":
+      return `Stopped: the missed payment was not paid by the date to pay by, and your access has ended. ${open}`;
+    case "authority_closed":
+      return `Stopped: your wallet's approval for this token was closed for good, so no payment can go through any more, and your access has ended.${row.action === "close" ? " Close it to get its deposit back." : ""}`;
+    default:
+      return "Stopped after missed payments. Nothing more is charged.";
+  }
+}
+function noteOf(row) {
+  if (row.paused) return "Parked: nothing is charged while it is.";
+  if (row.blocked_since && (row.status === "active" || row.status === "unpaid")) {
+    const until = moment(row.access_until);
+    return `Payments are on hold for now. There is nothing for you to do${until ? `, and your access runs until ${until}` : ""}.`;
+  }
+  if (row.status === "unpaid") {
+    if (row.late_reason === "approval_revoked") {
+      return "The last payment did not go through. This wallet no longer lets Mesub charge it: adding funds will not fix it.";
+    }
+    if (row.late_reason === "authority_closed") {
+      return "The last payment did not go through. This wallet closed its authorisation: it can no longer be charged.";
+    }
+    if (row.next_retry_at) {
+      return "The last payment did not go through. Add funds to the wallet, then pay now, with nothing to sign; otherwise Mesub tries again at the next try.";
+    }
+    return row.retry_deadline ? "The last payment did not go through, so access is off. Add funds to the wallet, then pay now, with nothing to sign, before the date to pay by." : "The last payment did not go through. Add funds to the wallet, then pay now.";
+  }
+  if (row.status === "cancelled") {
+    if (row.action === "close") return "Cancelled, and over. Close it to get its deposit back.";
+    if (!row.access) {
+      return "Cancelled. Your last payment was missed, so you have no access, and Mesub will not collect it. Close it once it ends to get its deposit back.";
+    }
+    return "Cancelled. Resume before the end to keep it.";
+  }
+  if (row.status === "stopped") return stoppedNote(row);
+  if (row.status === "ended") {
+    return row.action === "close" ? "Ended. Close it to get its deposit back." : "Ended. Nothing more is charged.";
+  }
+  return null;
+}
+function usePlans(slugs) {
+  const { plan } = useMesubInternal();
+  const [plans, setPlans] = useState4({});
+  const key = [...new Set(slugs)].sort().join(",");
+  useEffect4(() => {
+    let live = true;
+    for (const slug of key ? key.split(",") : []) {
+      plan(slug).then(
+        (served) => live && setPlans((known) => ({ ...known, [slug]: served })),
+        () => void 0
+      );
+    }
+    return () => {
+      live = false;
+    };
+  }, [key, plan]);
+  return plans;
+}
+function PayNow({ pay }) {
+  const [busy, setBusy] = useState4(false);
+  const [said2, setSaid] = useState4(null);
+  const [wait, setWait] = useState4(0);
+  useEffect4(() => {
+    if (wait <= 0) return;
+    const timer = setTimeout(() => {
+      setWait(wait - 1);
+      if (wait === 1) setSaid(null);
+    }, 1e3);
+    return () => clearTimeout(timer);
+  }, [wait]);
+  async function click() {
+    setBusy(true);
+    try {
+      const result = await pay();
+      setSaid(result);
+      setWait(result.retryAfter ?? 0);
+    } finally {
+      setBusy(false);
+    }
+  }
+  const tone = said2?.ok ? "sent" : wait > 0 ? "wait" : "refused";
+  return /* @__PURE__ */ jsxs5("div", { "data-mesub-pay-now": "", children: [
+    /* @__PURE__ */ jsx6(
+      "button",
+      {
+        type: "button",
+        "data-mesub-action": "pay-now",
+        disabled: busy || wait > 0,
+        "aria-busy": busy || void 0,
+        onClick: () => void click(),
+        children: wait > 0 ? `Pay again in ${wait} s` : "Pay now"
+      }
+    ),
+    said2 ? /* @__PURE__ */ jsx6("p", { role: said2.ok ? "status" : "alert", "data-mesub-pay-now-said": tone, children: said2.message }) : null
+  ] });
+}
+function ManageSubscriptions({ onChanged, ...rest }) {
+  const { theme } = useMesubInternal();
+  const { state, subscriptions, error, reload, payNow, manage } = useSubscriptions();
+  const plans = usePlans(subscriptions.flatMap((row) => row.plan ? [row.plan] : []));
+  const [retrying, setRetrying] = useState4(false);
+  async function act(id) {
+    const changed = await manage(id);
+    if (changed) onChanged?.(changed);
+  }
+  async function retry() {
+    setRetrying(true);
+    try {
+      await reload();
+    } finally {
+      setRetrying(false);
+    }
+  }
+  let body;
+  if (state === "loading") {
+    body = /* @__PURE__ */ jsx6("p", { "data-mesub-notice": "", role: "status", "aria-busy": "true", children: "Loading your subscriptions" });
+  } else if (state === "signed-out") {
+    body = /* @__PURE__ */ jsx6("p", { "data-mesub-empty": "signed-out", children: "Sign in on this site to see your subscriptions." });
+  } else if (state === "error") {
+    body = /* @__PURE__ */ jsxs5(Fragment5, { children: [
+      /* @__PURE__ */ jsx6("p", { role: "alert", "data-mesub-error": "", children: error }),
+      /* @__PURE__ */ jsx6(
+        "button",
+        {
+          type: "button",
+          "data-mesub-retry": "",
+          disabled: retrying,
+          "aria-busy": retrying || void 0,
+          onClick: () => void retry(),
+          children: "Try again"
+        }
+      )
+    ] });
+  } else if (subscriptions.length === 0) {
+    body = /* @__PURE__ */ jsx6("p", { "data-mesub-empty": "none", children: "You have no subscription yet." });
+  } else {
+    body = /* @__PURE__ */ jsx6("ul", { "data-mesub-subscription-list": "", "aria-label": "Your subscriptions", children: subscriptions.map((row) => {
+      const plan = row.plan ? plans[row.plan] : void 0;
+      const dated = fact(row);
+      const name = plan?.name ?? row.plan ?? "Subscription";
+      const since = day(row.confirmed_at);
+      const note = noteOf(row);
+      const price = plan ? briefPrice(plan) : null;
+      return /* @__PURE__ */ jsxs5("li", { "data-mesub-subscription": row.id, children: [
+        /* @__PURE__ */ jsxs5("div", { "data-mesub-subscription-head": "", children: [
+          plan?.logo_url ? /* @__PURE__ */ jsx6("img", { "data-mesub-logo": "", src: plan.logo_url, alt: "" }) : /* @__PURE__ */ jsx6("span", { "data-mesub-logo": "", "aria-hidden": "true", children: name.slice(0, 1).toUpperCase() }),
+          /* @__PURE__ */ jsxs5("div", { "data-mesub-subscription-name": "", children: [
+            /* @__PURE__ */ jsx6("strong", { children: name }),
+            plan ? /* @__PURE__ */ jsxs5("span", { children: [
+              "by ",
+              plan.project_name
+            ] }) : null
+          ] }),
+          /* @__PURE__ */ jsx6("span", { "data-mesub-status": row.paused ? "paused" : row.status, children: row.paused ? "Parked" : STATUS[row.status] ?? row.status })
+        ] }),
+        plan && price ? /* @__PURE__ */ jsxs5("p", { "data-mesub-subscription-price": "", children: [
+          /* @__PURE__ */ jsxs5("strong", { title: price.title, "data-mesub-fit": fit(price.text), children: [
+            /* @__PURE__ */ jsx6(TokenLogo, { plan }),
+            price.text
+          ] }),
+          " ",
+          cadence(plan.period_hours)
+        ] }) : null,
+        /* @__PURE__ */ jsxs5("dl", { "data-mesub-summary": "", children: [
+          dated ? /* @__PURE__ */ jsxs5("div", { "data-mesub-row": "", children: [
+            /* @__PURE__ */ jsx6("dt", { children: dated.term }),
+            /* @__PURE__ */ jsx6("dd", { children: dated.date })
+          ] }) : null,
+          since ? /* @__PURE__ */ jsxs5("div", { "data-mesub-row": "", children: [
+            /* @__PURE__ */ jsx6("dt", { children: "Since" }),
+            /* @__PURE__ */ jsx6("dd", { children: since })
+          ] }) : null,
+          closeFrom(row) ? /* @__PURE__ */ jsxs5("div", { "data-mesub-row": "", children: [
+            /* @__PURE__ */ jsx6("dt", { children: "Close from" }),
+            /* @__PURE__ */ jsx6("dd", { children: closeFrom(row) })
+          ] }) : null,
+          /* @__PURE__ */ jsxs5("div", { "data-mesub-row": "", children: [
+            /* @__PURE__ */ jsx6("dt", { children: "Paid from" }),
+            /* @__PURE__ */ jsx6("dd", { title: row.wallet, children: shortAddress(row.wallet) })
+          ] })
+        ] }),
+        note ? /* @__PURE__ */ jsx6("p", { "data-mesub-subscription-note": "", children: note }) : null,
+        row.payable ? /* @__PURE__ */ jsx6(PayNow, { pay: () => payNow(row.id) }) : null,
+        row.action ? /* @__PURE__ */ jsx6(
+          "button",
+          {
+            type: "button",
+            "data-mesub-action": row.action,
+            onClick: () => void act(row.id),
+            children: ACTION[row.action]
+          }
+        ) : null
+      ] }, row.id);
+    }) });
+  }
+  return /* @__PURE__ */ jsx6(
+    "div",
+    {
+      ...rest,
+      "data-mesub-subscriptions": "",
+      "data-mesub-state": state,
+      "data-mesub-theme": theme,
+      children: body
+    }
+  );
+}
+var ManageButton = forwardRef(function ManageButton2({ plan, children, onClick, ...rest }, ref) {
+  const { openSubscription, theme } = useMesubInternal();
+  return /* @__PURE__ */ jsx6(
+    "button",
+    {
+      type: "button",
+      ...rest,
+      ref,
+      "data-mesub-manage-button": "",
+      "data-mesub-theme": theme,
+      onClick: (event) => {
+        onClick?.(event);
+        if (!event.defaultPrevented) openSubscription(plan);
+      },
+      children: children ?? "Manage subscription"
+    }
+  );
+});
+
+// src/detail.tsx
+import { Fragment as Fragment6, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+var ACTION2 = {
+  cancel: "Cancel subscription",
+  resume: "Resume subscription",
+  close: "Close and get the deposit back"
+};
+var UPCOMING = { charge: "Next charge", retry: "Next try" };
+function usePlan(slug) {
+  const { plan } = useMesubInternal();
+  const [read, setRead] = useState5(void 0);
+  useEffect5(() => {
+    if (!slug) return;
+    let live = true;
+    plan(slug).then(
+      (served) => live && setRead(served),
+      () => void 0
+    );
+    return () => {
+      live = false;
+    };
+  }, [plan, slug]);
+  return slug && read?.slug === slug ? read : void 0;
+}
+function useDetail(row) {
+  const { api, revision } = useMesubInternal();
+  const [detail, setDetail] = useState5(null);
+  const id = row?.id;
+  useEffect5(() => {
+    if (!id) return;
+    let live = true;
+    api.subscription(id).then(
+      (served) => live && setDetail(served),
+      // An older server has no such route: the view stands without its payments.
+      () => void 0
+    );
+    return () => {
+      live = false;
+    };
+  }, [api, id, revision]);
+  return detail?.subscription.id === id ? detail : null;
+}
+var PAST_SHOWN = 5;
+var PAST_STEP = 10;
+function SubscriptionDialog({
+  plan: slug,
+  onClose
+}) {
+  const [shown, setShown] = useState5(PAST_SHOWN);
+  const titleId = useId3();
+  const { chain } = useMesubInternal();
+  const { state, subscriptions, error, reload, payNow, manage } = useSubscriptions();
+  const row = pickSubscription(subscriptions, slug) ?? null;
+  const plan = usePlan(row?.plan);
+  const detail = useDetail(row);
+  let body;
+  if (state === "loading") {
+    body = /* @__PURE__ */ jsxs6(Fragment6, { children: [
+      /* @__PURE__ */ jsx7("h2", { id: titleId, children: "Your subscription" }),
+      /* @__PURE__ */ jsx7("p", { "data-mesub-notice": "", role: "status", "aria-busy": "true", children: "Reading your subscription" })
+    ] });
+  } else if (state === "signed-out") {
+    body = /* @__PURE__ */ jsxs6(Fragment6, { children: [
+      /* @__PURE__ */ jsx7("h2", { id: titleId, children: "Sign in first" }),
+      /* @__PURE__ */ jsx7("p", { children: "Sign in on this site to see your subscription." })
+    ] });
+  } else if (state === "error") {
+    body = /* @__PURE__ */ jsxs6(Fragment6, { children: [
+      /* @__PURE__ */ jsx7("h2", { id: titleId, children: "Your subscription" }),
+      /* @__PURE__ */ jsx7("p", { role: "alert", "data-mesub-error": "", children: error }),
+      /* @__PURE__ */ jsx7("button", { type: "button", "data-mesub-retry": "", onClick: () => void reload(), children: "Try again" })
+    ] });
+  } else if (!row) {
+    body = /* @__PURE__ */ jsxs6(Fragment6, { children: [
+      /* @__PURE__ */ jsx7("h2", { id: titleId, children: "No subscription yet" }),
+      /* @__PURE__ */ jsx7("p", { children: "You are not subscribed to this plan." })
+    ] });
+  } else {
+    const name = plan?.name ?? row.plan ?? "Subscription";
+    const dated = fact(row);
+    const since = day(row.confirmed_at);
+    const note = noteOf(row);
+    const upcoming = detail?.upcoming ?? [];
+    const past = detail?.payments ?? [];
+    const total = detail?.paid?.amount ? paidBrief(detail.paid.amount, plan, formatAmount) : null;
+    const rate = plan ? briefPrice(plan) : null;
+    const due = (display) => display ? `${grouped(display)}${symbolOf(plan)}` : "";
+    const facts = upcoming.length > 0 && dated?.term !== "Access until" ? null : dated;
+    body = /* @__PURE__ */ jsxs6(Fragment6, { children: [
+      /* @__PURE__ */ jsxs6("div", { "data-mesub-identity": "", children: [
+        plan?.logo_url ? /* @__PURE__ */ jsx7("img", { "data-mesub-logo": "", src: plan.logo_url, alt: "" }) : /* @__PURE__ */ jsx7("span", { "data-mesub-logo": "", "aria-hidden": "true", children: name.slice(0, 1).toUpperCase() }),
+        /* @__PURE__ */ jsxs6("div", { children: [
+          /* @__PURE__ */ jsx7("h2", { id: titleId, children: name }),
+          plan ? /* @__PURE__ */ jsxs6("span", { children: [
+            "by ",
+            plan.project_name
+          ] }) : null
+        ] }),
+        /* @__PURE__ */ jsx7("span", { "data-mesub-status": row.paused ? "paused" : row.status, children: row.paused ? "Parked" : STATUS[row.status] ?? row.status })
+      ] }),
+      plan && rate ? /* @__PURE__ */ jsxs6("p", { "data-mesub-rate": "", children: [
+        /* @__PURE__ */ jsxs6("strong", { title: rate.title, "data-mesub-fit": fit(rate.text), children: [
+          /* @__PURE__ */ jsx7(TokenLogo, { plan }),
+          rate.text
+        ] }),
+        " ",
+        cadence(plan.period_hours)
+      ] }) : null,
+      note ? /* @__PURE__ */ jsx7("p", { "data-mesub-state-note": "", children: note }) : null,
+      /* @__PURE__ */ jsxs6("dl", { "data-mesub-summary": "", children: [
+        facts ? /* @__PURE__ */ jsxs6("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx7("dt", { children: facts.term }),
+          /* @__PURE__ */ jsx7("dd", { children: facts.date })
+        ] }) : null,
+        since ? /* @__PURE__ */ jsxs6("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx7("dt", { children: "Since" }),
+          /* @__PURE__ */ jsx7("dd", { children: since })
+        ] }) : null,
+        total ? /* @__PURE__ */ jsxs6("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx7("dt", { children: "Total paid" }),
+          /* @__PURE__ */ jsx7("dd", { title: total.title, children: total.text })
+        ] }) : null,
+        planEnd(plan?.ends_at) ? /* @__PURE__ */ jsxs6("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx7("dt", { children: "Plan ends" }),
+          /* @__PURE__ */ jsx7("dd", { children: planEnd(plan?.ends_at) })
+        ] }) : null,
+        closeFrom(row) ? /* @__PURE__ */ jsxs6("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx7("dt", { children: "Close from" }),
+          /* @__PURE__ */ jsx7("dd", { children: closeFrom(row) })
+        ] }) : null,
+        /* @__PURE__ */ jsxs6("div", { "data-mesub-row": "", children: [
+          /* @__PURE__ */ jsx7("dt", { children: "Pays from" }),
+          /* @__PURE__ */ jsx7("dd", { title: row.wallet, children: shortAddress(row.wallet) })
+        ] })
+      ] }),
+      upcoming.length > 0 || past.length > 0 ? (
+        // Closed until asked for, as the terms are on the checkout: same toggle.
+        /* @__PURE__ */ jsxs6("details", { "data-mesub-terms": "", "data-mesub-payments": "", children: [
+          /* @__PURE__ */ jsx7("summary", { children: "Payments" }),
+          upcoming.length > 0 ? /* @__PURE__ */ jsxs6("section", { "aria-label": "Incoming payments", children: [
+            /* @__PURE__ */ jsx7("h3", { children: "Incoming" }),
+            /* @__PURE__ */ jsx7("ul", { children: upcoming.map((next) => /* @__PURE__ */ jsxs6(
+              "li",
+              {
+                "data-mesub-payment": "upcoming",
+                children: [
+                  /* @__PURE__ */ jsx7("span", { children: shortMoment(next.due_at) }),
+                  /* @__PURE__ */ jsxs6("span", { children: [
+                    UPCOMING[next.kind] ?? next.kind,
+                    retryOf(next) ? /* @__PURE__ */ jsx7("small", { title: "Retry", children: retryOf(next) }) : null
+                  ] }),
+                  /* @__PURE__ */ jsx7("span", { "data-mesub-fit": fit(due(next.amount_display)), children: due(next.amount_display) })
+                ]
+              },
+              `next-${next.due_at}`
+            )) })
+          ] }) : null,
+          past.length > 0 ? /* @__PURE__ */ jsxs6("section", { "aria-label": "Past payments", children: [
+            /* @__PURE__ */ jsx7("h3", { children: "Past" }),
+            /* @__PURE__ */ jsx7("ul", { children: past.slice(0, shown).map((payment) => {
+              const said2 = paymentSaid(payment);
+              const amount = paidIn(payment.amount, plan, formatAmount);
+              const usd = plan && amount && !tokenOf(plan).vouched ? formatUsd(payment.amount_usd) : null;
+              return /* @__PURE__ */ jsxs6(
+                "li",
+                {
+                  "data-mesub-payment": said2.tone,
+                  children: [
+                    /* @__PURE__ */ jsx7("span", { children: shortMoment(payment.attempted_at) }),
+                    /* @__PURE__ */ jsxs6("span", { children: [
+                      said2.label,
+                      retryOf(payment) ? /* @__PURE__ */ jsx7("small", { title: "Retry", children: retryOf(payment) }) : null
+                    ] }),
+                    /* @__PURE__ */ jsxs6("span", { "data-mesub-fit": fit(amount ?? ""), children: [
+                      payment.signature && payment.outcome === "paid" ? /* @__PURE__ */ jsx7(
+                        "a",
+                        {
+                          href: explorerUrl(
+                            payment.signature,
+                            chain
+                          ),
+                          target: "_blank",
+                          rel: "noopener noreferrer",
+                          title: "See the transaction",
+                          children: amount ?? "Receipt"
+                        }
+                      ) : amount,
+                      usd ? /* @__PURE__ */ jsx7("small", { children: usd }) : null
+                    ] })
+                  ]
+                },
+                `${payment.attempted_at}-${payment.signature ?? ""}`
+              );
+            }) }),
+            past.length > shown ? /* @__PURE__ */ jsx7(
+              "button",
+              {
+                type: "button",
+                "data-mesub-more": "",
+                onClick: () => setShown(shown + PAST_STEP),
+                children: "Show more"
+              }
+            ) : null
+          ] }) : null
+        ] })
+      ) : null,
+      row.payable ? /* @__PURE__ */ jsx7(PayNow, { pay: () => payNow(row.id) }) : null,
+      row.action ? /* @__PURE__ */ jsx7(
+        "button",
+        {
+          type: "button",
+          "data-mesub-action": row.action,
+          onClick: () => void manage(row.id),
+          children: ACTION2[row.action]
+        }
+      ) : null
+    ] });
+  }
+  return /* @__PURE__ */ jsx7(
+    MesubDialog,
+    {
+      titleId,
+      onClose,
+      screen: {
+        step: "subscription",
+        view: `subscription-${state}-${row?.id ?? "none"}`,
+        body: /* @__PURE__ */ jsxs6(Fragment6, { children: [
+          body,
+          /* @__PURE__ */ jsx7("button", { type: "button", "data-mesub-cancel": "", onClick: onClose, children: "Done" })
+        ] })
+      }
+    }
+  );
+}
+
+// src/provider.tsx
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+function MesubProvider({
+  endpoint,
+  chain = "solana:mainnet",
+  fetch,
+  theme,
+  manageUrl,
+  children
+}) {
+  const api = useMemo(() => createApi({ endpoint, fetch }), [endpoint, fetch]);
+  const plans = useMemo(() => /* @__PURE__ */ new Map(), [api]);
+  const [open, setOpen] = useState6(null);
+  const [revision, setRevision] = useState6(0);
+  const pending = useRef5(null);
+  const [managed, setManaged] = useState6(null);
+  const openSubscription = useCallback2((plan2) => setManaged({ plan: plan2 }), []);
+  useEffect6(
+    () => () => {
+      pending.current?.resolve(null);
+      pending.current = null;
+    },
+    []
+  );
+  const plan = useCallback2(
+    (slug) => {
+      let read = plans.get(slug);
+      if (!read) {
+        read = api.plan(slug);
+        plans.set(slug, read);
+        read.catch(() => plans.delete(slug));
+      }
+      return read;
+    },
+    [api, plans]
+  );
+  const start = useCallback2((next) => {
+    if (pending.current) return pending.current.promise;
+    let resolve;
+    const promise = new Promise((done) => {
+      resolve = done;
+    });
+    pending.current = { promise, resolve, result: null };
+    setOpen(next);
+    return promise;
+  }, []);
+  const subscribe = useCallback2(
+    (request) => start({ kind: "subscribe", request }),
+    [start]
+  );
+  const manage = useCallback2(
+    (request) => start({ kind: "manage", request }),
+    [start]
+  );
+  const settled = useCallback2((subscription) => {
+    if (pending.current && subscription) pending.current.result = subscription;
+    setRevision((current) => current + 1);
+  }, []);
+  const close = useCallback2(() => {
+    pending.current?.resolve(pending.current.result);
+    pending.current = null;
+    setOpen(null);
+  }, []);
+  const value = useMemo(
+    () => ({
+      api,
+      chain,
+      theme,
+      manageUrl,
+      plan,
+      revision,
+      subscribe,
+      manage,
+      openSubscription
+    }),
+    [api, chain, theme, manageUrl, plan, revision, subscribe, manage, openSubscription]
+  );
+  return /* @__PURE__ */ jsxs7(MesubContext.Provider, { value, children: [
+    children,
+    open?.kind === "subscribe" ? /* @__PURE__ */ jsx8(
+      Checkout,
+      {
+        plan: open.request.plan,
+        onState: open.request.onState,
+        onSubscribed: (subscription, signature) => {
+          settled(subscription);
+          open.request.onSubscribed(subscription, signature);
+        },
+        onClose: close
+      }
+    ) : null,
+    managed && !open ? /* @__PURE__ */ jsx8(SubscriptionDialog, { plan: managed.plan, onClose: () => setManaged(null) }) : null,
+    open?.kind === "manage" ? /* @__PURE__ */ jsx8(
+      Manage,
+      {
+        subscription: open.request.subscription,
+        action: open.request.action,
+        onChanged: settled,
+        onClose: close
+      }
+    ) : null
+  ] });
+}
+
+// src/subscribe-button.tsx
+import {
+  forwardRef as forwardRef2,
+  useCallback as useCallback3,
+  useEffect as useEffect7,
+  useRef as useRef6,
+  useState as useState7
+} from "react";
+import { Fragment as Fragment7, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+function useSubscribe(plan, options = {}) {
+  const { subscribe: open } = useMesubInternal();
+  const [state, setState] = useState7("idle");
+  const [subscription, setSubscription] = useState7(null);
+  const [signature, setSignature] = useState7(null);
+  const latest = useRef6(options);
+  latest.current = options;
+  const alive = useRef6(true);
+  useEffect7(() => {
+    alive.current = true;
+    return () => {
+      alive.current = false;
+    };
+  }, []);
+  const subscribe = useCallback3(async () => {
+    let done = false;
+    const result = await open({
+      plan,
+      onState: (next) => alive.current && setState(next),
+      onSubscribed: (confirmed, paid) => {
+        done = true;
+        if (alive.current) {
+          setSubscription(confirmed);
+          setSignature(paid);
+          setState("subscribed");
+        }
+        latest.current.onSubscribed?.(confirmed);
+      }
+    });
+    if (alive.current) setState(done ? "subscribed" : "idle");
+    return result;
+  }, [open, plan]);
+  return { state, subscription, signature, subscribe };
+}
+var LABELS = {
+  signing: "Approve in your wallet",
+  confirming: "Confirming",
+  subscribed: "Subscribed"
+};
+var SubscribeButton = forwardRef2(
+  function SubscribeButton2({ plan, onSubscribed, children, onClick, disabled, type, ...rest }, ref) {
+    const { chain, theme } = useMesubInternal();
+    const { state, subscription, signature, subscribe } = useSubscribe(plan, { onSubscribed });
+    const busy = state === "signing" || state === "confirming";
+    const due = moment(subscription?.next_charge_at);
+    function click(event) {
+      if (busy) return;
+      onClick?.(event);
+      if (!event.defaultPrevented) void subscribe();
+    }
+    return /* @__PURE__ */ jsxs8(Fragment7, { children: [
+      /* @__PURE__ */ jsx9(
+        "button",
+        {
+          ...rest,
+          ref,
+          type: type ?? "button",
+          disabled: Boolean(disabled) || state === "subscribed",
+          "aria-busy": busy || void 0,
+          "aria-disabled": busy || void 0,
+          onClick: click,
+          "data-mesub-subscribe": "",
+          "data-mesub-state": state,
+          "data-mesub-theme": theme,
+          children: LABELS[state] ?? children ?? "Subscribe"
+        }
+      ),
+      state === "subscribed" && (due || signature) ? /* @__PURE__ */ jsxs8("span", { "data-mesub-receipt": "", "data-mesub-theme": theme, children: [
+        due ? `Next charge ${due}` : null,
+        due && signature ? " \xB7 " : null,
+        signature ? /* @__PURE__ */ jsx9("a", { href: explorerUrl(signature, chain), target: "_blank", rel: "noopener", children: "Receipt" }) : null
+      ] }) : null
+    ] });
+  }
+);
+export {
+  ManageButton,
+  ManageSubscriptions,
+  MesubProvider,
+  SubscribeButton,
+  useSubscribe,
+  useSubscriptions
+};
+//# sourceMappingURL=index.js.map