@alfadocs/ui-kit-debug 1.46.0 → 1.47.0

package/dist/_chunks/payment-form-DqJFiplX.js

@@ -0,0 +1,881 @@
+import { jsx as n, jsxs as v, Fragment as De } from "react/jsx-runtime";
+import { forwardRef as Te, useMemo as pe, useState as _, useEffect as V, useRef as b, useImperativeHandle as Me, useId as Ve, useCallback as me } from "react";
+import { c as re } from "./index-D2ZczOXr.js";
+import { useTranslation as he } from "react-i18next";
+import { S as Pe } from "./spinner-hbwuKwMf.js";
+import { A as xe } from "./alert-CiQ5Pa3Q.js";
+import { loadStripe as Ae } from "@stripe/stripe-js/pure";
+import { Elements as $e, useStripe as je, useElements as Ue, AddressElement as Ee, PaymentElement as qe } from "@stripe/react-stripe-js";
+import { u as Ge } from "./registry-DvAUVLHh.js";
+function Fe() {
+  return typeof document < "u" && typeof window < "u";
+}
+function be(r) {
+  if (!Fe())
+    return { theme: "stripe" };
+  const s = r ?? document.documentElement, o = getComputedStyle(s), e = (a) => o.getPropertyValue(a).trim();
+  return {
+    theme: s.classList.contains("theme-dark") ? "night" : "stripe",
+    variables: {
+      colorPrimary: e("--primary"),
+      colorBackground: e("--background"),
+      colorText: e("--foreground"),
+      colorDanger: e("--destructive"),
+      colorTextSecondary: e("--muted-foreground"),
+      colorTextPlaceholder: e("--muted-foreground"),
+      borderRadius: e("--radius-md"),
+      fontFamily: e("--font-sans"),
+      fontSizeBase: e("--font-size-base"),
+      // Stripe multiplies spacingUnit throughout every Element; --spacing-sm
+      // gives readable density. Keep this in sync with the JSDoc above.
+      spacingUnit: e("--spacing-sm")
+    },
+    rules: {
+      ".Input": {
+        backgroundColor: e("--background"),
+        border: `1px solid ${e("--border")}`,
+        color: e("--foreground"),
+        padding: e("--spacing-sm"),
+        transition: `border-color ${e("--animation-duration")} ease-out`
+      },
+      ".Input:focus": {
+        borderColor: e("--primary"),
+        boxShadow: `0 0 0 ${e("--focus-ring-width")} ${e("--ring")}`,
+        outline: "none"
+      },
+      ".Input--invalid": {
+        borderColor: e("--destructive"),
+        color: e("--foreground")
+      },
+      ".Label": {
+        color: e("--foreground"),
+        fontWeight: e("--font-weight-medium"),
+        fontSize: e("--font-size-sm")
+      },
+      ".Error": {
+        color: e("--destructive"),
+        fontSize: e("--font-size-sm")
+      },
+      ".Tab": {
+        border: `1px solid ${e("--border")}`,
+        backgroundColor: e("--background"),
+        color: e("--foreground")
+      },
+      ".Tab--selected": {
+        borderColor: e("--primary"),
+        backgroundColor: e("--background"),
+        color: e("--primary")
+      },
+      // Accordion method rows (the `accordion` layout): keep Stripe's native
+      // per-method card structure, restyled with our tokens — our border +
+      // radius, our background, `--primary` on the selected row, no extra shadow.
+      ".AccordionItem": {
+        backgroundColor: e("--background"),
+        border: `1px solid ${e("--border")}`,
+        borderRadius: e("--radius-md"),
+        boxShadow: "none"
+      },
+      ".AccordionItem--selected": {
+        borderColor: e("--primary"),
+        backgroundColor: e("--background")
+      },
+      // Stripe's in-method notice blocks (e.g. PayPal's "you'll be redirected")
+      // otherwise render in their own bordered box — a card nested inside the
+      // selected method card. Flatten to inline icon + text, no inner box.
+      ".Block": {
+        border: "none",
+        borderRadius: "0",
+        boxShadow: "none",
+        backgroundColor: "transparent"
+      }
+    }
+  };
+}
+function He(r, s) {
+  if (!Fe()) return () => {
+  };
+  const o = document.documentElement, e = () => r(be(s)), u = new MutationObserver(e);
+  u.observe(o, {
+    attributes: !0,
+    attributeFilter: ["class", "dir", "lang"]
+  });
+  const a = window.matchMedia("(prefers-color-scheme: dark)"), d = window.matchMedia("(prefers-reduced-motion: reduce)");
+  return a.addEventListener("change", e), d.addEventListener("change", e), () => {
+    u.disconnect(), a.removeEventListener("change", e), d.removeEventListener("change", e);
+  };
+}
+const We = {
+  id: "payment-form",
+  capabilities: ["submit"],
+  // The kit's only destructive + openWorld action that moves real money,
+  // so it is also the one that most needs to be verifiable. `submit`
+  // resolves once the charge attempt has settled; these four slots are
+  // how an agent then tells success from decline from never-fired, and
+  // how it recovers the receipt.
+  //
+  // A9: the PaymentIntent id and the i18n error KEY only. Never card
+  // fields (they live in Stripe's cross-origin iframes and never reach
+  // this origin), never the translated Stripe message, never
+  // `clientSecret`.
+  state: {
+    status: {
+      type: "'idle' | 'processing' | 'succeeded' | 'failed'",
+      descriptionKey: "ui.agent.paymentForm.state.status",
+      description: "Lifecycle of the current payment attempt. `succeeded` is only reached once Stripe confirmed the PaymentIntent; `failed` covers validation, decline and processor errors alike. Still `idle` after `submit` means the attempt never fired — Stripe had not mounted.",
+      read: (r) => r.getStatus()
+    },
+    complete: {
+      type: "boolean",
+      descriptionKey: "ui.agent.paymentForm.state.complete",
+      description: "True when Stripe reports the payment fields, and any required billing address, as complete. Read this before `submit` — outside preview mode the submit control is disabled while it is false, so the call will not be accepted.",
+      read: (r) => r.isComplete()
+    },
+    errorKey: {
+      type: "string | null",
+      descriptionKey: "ui.agent.paymentForm.state.errorKey",
+      description: "i18n key of the current error (e.g. `payment.error.cardDeclined`), or null. The key is the structural datum — the translated message is free text and is never exposed.",
+      read: (r) => r.getErrorKey()
+    },
+    paymentIntentId: {
+      type: "string | null",
+      descriptionKey: "ui.agent.paymentForm.state.paymentIntentId",
+      description: "Opaque Stripe PaymentIntent id once a charge succeeded, else null. The receipt — the attribution handle for the money that moved. Never the client secret.",
+      read: (r) => r.getPaymentIntentId()
+    }
+  },
+  actions: {
+    submit: {
+      safety: "destructive",
+      // Charges an external payment processor — irreversible, hits a system
+      // outside this UI.
+      openWorld: !0,
+      returns: "Promise<void>",
+      errors: [
+        'Validation failed (incomplete or invalid card details) — `status` is "failed", `errorKey` names which.',
+        'Payment was declined by the processor — `status` is "failed", `errorKey` is `payment.error.cardDeclined`.',
+        'Network or processor error during the charge — `status` is "failed".',
+        'Stripe had not mounted, so nothing was attempted — `status` is still "idle".'
+      ],
+      descriptionKey: "ui.agent.paymentForm.actions.submit",
+      description: "Submit the payment. Charges the configured payment method — irreversible. Resolves once the attempt has settled; the outcome is never in the resolved value, so read `status`, then `errorKey` on failure or `paymentIntentId` on success.",
+      invoke: (r) => r.submit()
+    },
+    reset: {
+      safety: "destructive",
+      idempotent: !0,
+      descriptionKey: "ui.agent.paymentForm.actions.reset",
+      description: 'Clear recoverable errors and return their status to "idle". Stripe fields remain unchanged. Pending or paid attempts cannot be reset and require a new session.',
+      invoke: (r) => {
+        r.reset();
+      }
+    }
+  },
+  domHooks: {
+    root: { attr: "data-component", value: "payment-form" },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    }
+  }
+}, Oe = /* @__PURE__ */ new Set([
+  "BIF",
+  "CLP",
+  "DJF",
+  "GNF",
+  "IDR",
+  "JPY",
+  "KMF",
+  "KRW",
+  "MGA",
+  "PYG",
+  "RWF",
+  "UGX",
+  "VND",
+  "VUV",
+  "XAF",
+  "XOF",
+  "XPF"
+]);
+function ve(r, s, o) {
+  const e = s.toUpperCase(), u = Oe.has(e) ? r : r / 100;
+  try {
+    return new Intl.NumberFormat(o, {
+      style: "currency",
+      currency: e
+    }).format(u);
+  } catch {
+    return new Intl.NumberFormat("en", {
+      style: "currency",
+      currency: e
+    }).format(u);
+  }
+}
+function Xe(r) {
+  if (r === void 0) return null;
+  const s = r.trim();
+  if (s === "" || typeof window > "u") return null;
+  try {
+    const o = new URL(s, window.location.href);
+    return !(/* @__PURE__ */ new Set(["http:", "https:"])).has(o.protocol) || o.origin !== window.location.origin ? null : o.toString();
+  } catch {
+    return null;
+  }
+}
+function Ze(r) {
+  return r && r.replace(/\d{4,}/g, "****");
+}
+function Je(r) {
+  switch (r) {
+    case "incorrect_number":
+    case "invalid_number":
+      return "payment.error.cardNumber";
+    case "invalid_expiry_month":
+    case "invalid_expiry_year":
+    case "expired_card":
+      return "payment.error.expiry";
+    case "invalid_cvc":
+    case "incorrect_cvc":
+      return "payment.error.cvc";
+    case "incorrect_zip":
+    case "invalid_zip":
+      return "payment.error.postalCode";
+    case "card_declined":
+    case "do_not_honor":
+    case "generic_decline":
+      return "payment.error.declined";
+    case "network_error":
+    case "api_connection_error":
+      return "payment.error.network";
+    case "billing_address_incomplete":
+      return "payment.error.billingAddressIncomplete";
+    case "billing_details_save":
+      return "payment.error.billingDetailsSave";
+    case "billing_details_changed":
+      return "payment.error.billingDetailsChanged";
+    default:
+      return "payment.error.generic";
+  }
+}
+const Ye = re(
+  [
+    "ds:payment-form-alfadocs ds:flex ds:flex-col",
+    "ds:gap-[var(--spacing-md)]",
+    // Transparent, padding-less container — the consuming surface (a Card, the
+    // check-in step, a checkout column) owns the card chrome + padding, so the
+    // Stripe method boxes never read as cards nested inside another card.
+    "ds:text-[var(--foreground)]",
+    "ds:aria-disabled:opacity-[var(--opacity-50)] ds:aria-disabled:cursor-not-allowed"
+  ].join(" ")
+), fe = re(
+  ["ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]"].join(" ")
+), G = re(
+  ["type-label", "ds:text-[var(--foreground)]"].join(" ")
+), Ke = re(
+  [
+    "ds:flex ds:items-baseline ds:justify-between",
+    "ds:gap-[var(--spacing-sm)]",
+    "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
+    "ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]",
+    "ds:bg-[var(--muted)]",
+    "ds:rounded-[var(--radius-sm)]",
+    "ds:text-[var(--foreground)]"
+  ].join(" ")
+), Le = re(
+  [
+    "ds:inline-flex ds:items-center ds:justify-center ds:gap-[var(--spacing-xs)]",
+    "ds:[min-block-size:var(--min-target-size)]",
+    "ds:[min-inline-size:var(--min-target-size)]",
+    "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
+    "ds:rounded-[var(--radius-sm)]",
+    "ds:bg-[var(--primary)] ds:text-[var(--primary-foreground)]",
+    "ds:text-[length:var(--font-size-base)] ds:font-medium",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:hover:bg-[var(--primary-hover)]",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)]",
+    "ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-[var(--ring)]",
+    "ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:forced-colors:focus-visible:outline-[CanvasText]",
+    "ds:aria-disabled:opacity-[var(--opacity-50)] ds:aria-disabled:cursor-not-allowed",
+    "ds:aria-busy:cursor-wait"
+  ].join(" ")
+);
+function Qe(r) {
+  const {
+    amount: s,
+    currency: o,
+    locale: e,
+    billingAddress: u,
+    requireBillingAddress: a,
+    defaultBillingDetails: d,
+    onBillingDetails: $,
+    returnUrl: h,
+    clientSecret: p,
+    onCreatePaymentIntent: P,
+    onPreviewValidated: H,
+    onSuccess: W,
+    onPaymentStatusChange: O,
+    onError: X,
+    layout: ye,
+    agentBridge: i
+  } = r, { t: c } = he(), j = je(), C = Ue(), [U] = _(
+    () => d ? {
+      name: d.name,
+      address: {
+        line1: d.address.line1,
+        line2: d.address.line2,
+        city: d.address.city,
+        state: d.address.state,
+        postal_code: d.address.postalCode,
+        country: d.address.country
+      }
+    } : void 0
+  ), te = Ve(), k = pe(
+    () => `pay-${te.replace(/[^a-zA-Z0-9-_]/g, "")}`,
+    [te]
+  ), ne = `${k}-payment`, se = `${k}-address`, x = `${k}-error`, [F, K] = _(!1), [L, ae] = _(!1), z = b(!1), l = b(!0), [A, ie] = _(!1), [w, E] = _(!1), Z = b(0), [J, f] = _(null), [N, I] = _("");
+  V(() => {
+    i.current.complete = A && (!a || w);
+  }, [i, A, a, w]);
+  const y = me(
+    (t) => {
+      i.current.status = t;
+    },
+    [i]
+  ), R = me(
+    (t) => {
+      i.current.errorKey = t, f(t);
+    },
+    [i]
+  ), ze = me(
+    (t) => {
+      i.current.complete = t && (!a || w), ie(t);
+    },
+    [i, a, w]
+  ), oe = b(W), de = b(O), B = b(X), we = b($), ce = b(H);
+  V(() => {
+    oe.current = W, de.current = O, B.current = X, we.current = $, ce.current = H;
+  }, [
+    W,
+    O,
+    X,
+    $,
+    H
+  ]);
+  const q = me(
+    async (t) => {
+      var Se, _e, Ce, ke;
+      if (t && t.preventDefault(), !j || !C || z.current || !l.current) return;
+      z.current = !0, K(!0), y("processing"), i.current.paymentIntentId = null, R(null), I("");
+      const m = (S, Y) => {
+        var D;
+        const Q = Je(S), ee = Ze(Y ?? "");
+        R(Q), I(c(Q)), y("failed"), (D = B.current) == null || D.call(B, {
+          code: S,
+          translatedMessage: ee || c(Q)
+        });
+      }, ge = Xe(h);
+      if (h !== void 0 && ge === null) {
+        R("payment.error.invalidReturnUrl"), I(c("payment.error.invalidReturnUrl")), y("failed"), (Se = B.current) == null || Se.call(B, {
+          code: "invalid_return_url",
+          translatedMessage: c("payment.error.invalidReturnUrl")
+        }), K(!1), z.current = !1;
+        return;
+      }
+      const Be = ge ? { return_url: ge } : {};
+      let le = !1;
+      const Ie = we.current;
+      try {
+        let S;
+        if (p === void 0) {
+          const { error: T } = await C.submit();
+          if (!l.current) return;
+          if (T) {
+            m(T.code ?? "generic", T.message);
+            return;
+          }
+        }
+        let Y;
+        const Q = Z.current, ee = () => a && Q !== Z.current;
+        if (a) {
+          const T = C.getElement(Ee), ue = await (T == null ? void 0 : T.getValue());
+          if (!l.current) return;
+          if (ee()) {
+            m("billing_details_changed", void 0);
+            return;
+          }
+          if (!(ue != null && ue.complete)) {
+            m("billing_address_incomplete", void 0);
+            return;
+          }
+          const M = ue.value;
+          Y = {
+            name: M.name,
+            address: {
+              line1: M.address.line1,
+              line2: M.address.line2,
+              city: M.address.city,
+              state: M.address.state,
+              postalCode: M.address.postal_code,
+              country: M.address.country
+            }
+          };
+        }
+        if (p === void 0 && !P) {
+          await ((_e = ce.current) == null ? void 0 : _e.call(ce));
+          return;
+        }
+        if (Y && Ie) {
+          try {
+            await Ie(Y);
+          } catch {
+            l.current && m("billing_details_save", void 0);
+            return;
+          }
+          if (!l.current) return;
+        }
+        if (ee()) {
+          m("billing_details_changed", void 0);
+          return;
+        }
+        if (p === void 0 && P && (S = await P(), !l.current))
+          return;
+        if (ee()) {
+          m("billing_details_changed", void 0);
+          return;
+        }
+        const D = await j.confirmPayment({
+          elements: C,
+          ...S === void 0 ? {} : { clientSecret: S },
+          confirmParams: Be,
+          redirect: "if_required"
+        });
+        if (!l.current) return;
+        if (D.error) {
+          m(D.error.code ?? "generic", D.error.message);
+          return;
+        }
+        const g = D.paymentIntent;
+        if (le = !0, !g) return;
+        g.status === "succeeded" ? (i.current.paymentIntentId = g.id, y("succeeded"), ae(!0), K(!1)) : (g.status === "requires_payment_method" || g.status === "canceled") && (le = !1, m(g.status, void 0));
+        try {
+          (Ce = de.current) == null || Ce.call(de, g.status, g.id);
+        } catch {
+        }
+        g.status === "succeeded" && ((ke = oe.current) == null || ke.call(oe, g.id));
+      } catch (S) {
+        l.current && !le && m("unexpected", S instanceof Error ? S.message : "");
+      } finally {
+        l.current && !le && (z.current = !1, K(!1), i.current.status === "processing" && y("idle"));
+      }
+    },
+    [
+      j,
+      C,
+      h,
+      p,
+      P,
+      a,
+      c,
+      i,
+      R,
+      y
+    ]
+  );
+  V(() => {
+    const t = document.getElementById(k);
+    if (!t) return;
+    const m = () => {
+      q();
+    };
+    return t.addEventListener("payment-form:submit", m), () => t.removeEventListener("payment-form:submit", m);
+  }, [k, q]), V(() => {
+    const t = i.current;
+    return t.submit = q, () => {
+      t.submit === q && (t.submit = void 0);
+    };
+  }, [i, q]), V(() => {
+    const t = i.current;
+    return l.current = !0, t.status = "idle", t.paymentIntentId = null, t.errorKey = null, t.complete = !1, () => {
+      l.current = !1, t.complete = !1, t.status = "idle", t.paymentIntentId = null, t.errorKey = null;
+    };
+  }, [i]);
+  const Re = !j || !C || F || L || !(p === void 0 && !P) && (!A || a && !w);
+  return /* @__PURE__ */ n(
+    "form",
+    {
+      id: k,
+      onSubmit: q,
+      onReset: () => {
+        z.current || (R(null), I(""), y("idle"), i.current.paymentIntentId = null);
+      },
+      "aria-label": c("payment.ariaLabel"),
+      "aria-busy": F || void 0,
+      noValidate: !0,
+      children: /* @__PURE__ */ v("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", children: [
+        /* @__PURE__ */ v("div", { className: Ke(), children: [
+          /* @__PURE__ */ n("span", { className: G(), children: c("payment.amountLabel") }),
+          /* @__PURE__ */ n("span", { className: "type-title-card", "data-testid": "payment-amount", children: ve(s, o, e) })
+        ] }),
+        /* @__PURE__ */ v(
+          "label",
+          {
+            htmlFor: ne,
+            className: fe(),
+            "data-testid": "payment-field",
+            children: [
+              /* @__PURE__ */ n("span", { className: G(), children: c("payment.fields.card") }),
+              /* @__PURE__ */ n(
+                qe,
+                {
+                  id: ne,
+                  options: {
+                    // `tabs` = method tiles (Card selected by default); `accordion`
+                    // = full-width stacked rows for narrow columns where the tab row
+                    // clips. Stripe owns overflow + tab alignment either way.
+                    layout: ye === "accordion" ? { type: "accordion", defaultCollapsed: !0 } : { type: "tabs" }
+                  },
+                  onChange: (t) => {
+                    ze(t.complete === !0), t.complete && (R(null), I(""), i.current.status === "failed" && y("idle"));
+                  }
+                }
+              )
+            ]
+          }
+        ),
+        u ? /* @__PURE__ */ v(
+          "label",
+          {
+            htmlFor: se,
+            className: fe(),
+            "data-testid": "payment-address",
+            children: [
+              /* @__PURE__ */ n("span", { className: G(), children: c("payment.billingAddress") }),
+              /* @__PURE__ */ n(
+                Ee,
+                {
+                  id: se,
+                  options: {
+                    mode: "billing",
+                    ...U ? { defaultValues: U } : {}
+                  },
+                  onChange: (t) => {
+                    Z.current += 1, E(t.complete), i.current.complete = A && (!a || t.complete), t.complete && J === "payment.error.billingAddressIncomplete" && (R(null), I(""), y("idle"));
+                  }
+                }
+              )
+            ]
+          }
+        ) : null,
+        J ? /* @__PURE__ */ n(
+          xe,
+          {
+            id: x,
+            variant: "error",
+            live: "polite",
+            "data-testid": "payment-error",
+            children: /* @__PURE__ */ n(xe.Description, { children: N })
+          }
+        ) : null,
+        /* @__PURE__ */ n(
+          "button",
+          {
+            type: "submit",
+            "aria-disabled": Re || void 0,
+            "aria-busy": F || void 0,
+            "aria-describedby": J ? x : void 0,
+            className: Le(),
+            "data-testid": "payment-submit",
+            children: F ? /* @__PURE__ */ v(De, { children: [
+              /* @__PURE__ */ n(
+                Pe,
+                {
+                  variant: "pulse",
+                  size: "sm",
+                  label: c("payment.processing")
+                }
+              ),
+              /* @__PURE__ */ n("span", { children: c("payment.processing") })
+            ] }) : /* @__PURE__ */ n("span", { children: c("payment.submit", {
+              amount: ve(s, o, e)
+            }) })
+          }
+        )
+      ] })
+    }
+  );
+}
+const Ne = /* @__PURE__ */ new Set([
+  "auto",
+  "ar",
+  "bg",
+  "cs",
+  "da",
+  "de",
+  "el",
+  "en",
+  "en-AU",
+  "en-CA",
+  "en-NZ",
+  "en-GB",
+  "es",
+  "es-ES",
+  "es-419",
+  "et",
+  "fi",
+  "fil",
+  "fr",
+  "fr-CA",
+  "fr-FR",
+  "he",
+  "hu",
+  "hr",
+  "id",
+  "it",
+  "it-IT",
+  "ja",
+  "ko",
+  "lt",
+  "lv",
+  "ms",
+  "mt",
+  "nb",
+  "nl",
+  "no",
+  "pl",
+  "pt",
+  "pt-BR",
+  "ro",
+  "ru",
+  "sk",
+  "sl",
+  "sv",
+  "th",
+  "tr",
+  "vi",
+  "zh",
+  "zh-HK",
+  "zh-TW"
+]);
+function er(r) {
+  if (!r) return "auto";
+  const s = r === "cn" ? "zh" : r;
+  if (Ne.has(s))
+    return s;
+  const o = s.split("-")[0];
+  return Ne.has(o) ? o : "auto";
+}
+const rr = Te(
+  ({
+    id: r,
+    clientSecret: s,
+    mode: o = "payment",
+    cardOnly: e = !1,
+    onCreatePaymentIntent: u,
+    onPreviewValidated: a,
+    publishableKey: d,
+    stripeAccount: $,
+    currency: h,
+    amount: p,
+    onSuccess: P,
+    onPaymentStatusChange: H,
+    onError: W,
+    billingAddress: O = !1,
+    requireBillingAddress: X = !1,
+    defaultBillingDetails: ye,
+    onBillingDetails: i,
+    locale: c,
+    ariaLabel: j,
+    returnUrl: C,
+    stripePromise: U,
+    layout: te = "tabs",
+    className: k
+  }, ne) => {
+    const { i18n: se } = he(), x = er(c ?? se.language ?? "en"), F = X || i !== void 0, K = O || F, L = pe(
+      () => ({ injectedStripe: U, publishableKey: d, stripeAccount: $ }),
+      [U, d, $]
+    ), [ae, z] = _(() => ({
+      source: L,
+      instance: U ?? null
+    })), l = ae.source === L ? ae.instance : null;
+    V(() => {
+      const {
+        injectedStripe: f,
+        publishableKey: N,
+        stripeAccount: I
+      } = L, y = f !== void 0 ? f : N ? I ? Ae(N, { stripeAccount: I }) : Ae(N) : null;
+      z({ source: L, instance: y });
+    }, [L]);
+    const [A, ie] = _(
+      () => be()
+    );
+    V(() => (ie(be()), He(ie)), []);
+    const w = b(null), E = b({
+      status: "idle",
+      complete: !1,
+      errorKey: null,
+      paymentIntentId: null
+    }), Z = pe(
+      () => ({
+        submit: async () => {
+          const f = E.current.submit;
+          f && await f();
+        },
+        reset: () => {
+          var N;
+          const f = (N = w.current) == null ? void 0 : N.querySelector("form");
+          f instanceof HTMLFormElement && f.reset();
+        },
+        getStatus: () => E.current.status,
+        isComplete: () => E.current.complete,
+        getErrorKey: () => E.current.errorKey,
+        getPaymentIntentId: () => E.current.paymentIntentId
+      }),
+      []
+    );
+    Me(ne, () => w.current, []), Ge(We, Z, r);
+    const J = pe(
+      () => s !== void 0 ? (
+        // Immediate mode — the consumer already created the intent.
+        { clientSecret: s, appearance: A, locale: x }
+      ) : (
+        // Deferred-intent mode — no secret yet; Stripe needs the intent
+        // shape (mode + amount + currency) to render the Payment Element.
+        // Stripe expects a lowercase ISO-4217 currency here.
+        {
+          mode: o,
+          amount: p,
+          currency: h.toLowerCase(),
+          ...e ? { paymentMethodTypes: ["card"] } : {},
+          appearance: A,
+          locale: x
+        }
+      ),
+      [
+        s,
+        o,
+        e,
+        p,
+        h,
+        A,
+        x
+      ]
+    );
+    return /* @__PURE__ */ n(
+      "div",
+      {
+        ref: w,
+        "aria-label": j,
+        className: [Ye(), k].filter(Boolean).join(" "),
+        "data-component": "payment-form",
+        "data-component-id": r,
+        "data-testid": "payment-form-root",
+        children: l ? (
+          // Render the real Payment Element whenever a Stripe instance is
+          // available — in immediate mode (clientSecret present) AND in
+          // deferred mode (no secret). The skeleton is reserved for the
+          // no-Stripe case (missing publishableKey / injected null).
+          /* @__PURE__ */ n(
+            $e,
+            {
+              stripe: l,
+              options: J,
+              children: /* @__PURE__ */ n(
+                Qe,
+                {
+                  amount: p,
+                  currency: h,
+                  locale: x,
+                  billingAddress: K,
+                  requireBillingAddress: F,
+                  defaultBillingDetails: ye,
+                  onBillingDetails: i,
+                  returnUrl: C,
+                  clientSecret: s,
+                  onCreatePaymentIntent: u,
+                  onPreviewValidated: a,
+                  onSuccess: P,
+                  onPaymentStatusChange: H,
+                  onError: W,
+                  layout: te,
+                  agentBridge: E
+                }
+              )
+            },
+            s ?? `deferred:${o}:${p}:${h}:${e}`
+          )
+        ) : /* @__PURE__ */ n(
+          tr,
+          {
+            amount: p,
+            currency: h,
+            locale: x,
+            billingAddress: K
+          }
+        )
+      }
+    );
+  }
+);
+rr.displayName = "PaymentForm";
+function tr(r) {
+  const { amount: s, currency: o, locale: e, billingAddress: u } = r, { t: a } = he();
+  return /* @__PURE__ */ v(
+    "div",
+    {
+      className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]",
+      "data-testid": "payment-skeleton",
+      "aria-busy": "true",
+      children: [
+        /* @__PURE__ */ v("div", { className: Ke(), children: [
+          /* @__PURE__ */ n("span", { className: G(), children: a("payment.amountLabel") }),
+          /* @__PURE__ */ n("span", { className: "type-title-card", children: ve(s, o, e) })
+        ] }),
+        /* @__PURE__ */ v("div", { className: fe(), children: [
+          /* @__PURE__ */ n("span", { className: G(), children: a("payment.fields.card") }),
+          /* @__PURE__ */ n(
+            "div",
+            {
+              className: "ds:[min-block-size:var(--min-target-size)] ds:rounded-[var(--radius-sm)] ds:border ds:border-[color:var(--border)] ds:bg-[var(--muted)]",
+              "aria-hidden": "true"
+            }
+          )
+        ] }),
+        u ? /* @__PURE__ */ v("div", { className: fe(), "data-testid": "payment-address", children: [
+          /* @__PURE__ */ n("span", { className: G(), children: a("payment.billingAddress") }),
+          /* @__PURE__ */ n(
+            "div",
+            {
+              className: "ds:[min-block-size:calc(var(--min-target-size)*2)] ds:rounded-[var(--radius-sm)] ds:border ds:border-[color:var(--border)] ds:bg-[var(--muted)]",
+              "aria-hidden": "true"
+            }
+          )
+        ] }) : null,
+        /* @__PURE__ */ v(
+          "button",
+          {
+            type: "button",
+            "aria-disabled": "true",
+            className: Le(),
+            disabled: !0,
+            children: [
+              /* @__PURE__ */ n(Pe, { variant: "pulse", size: "sm", label: a("payment.processing") }),
+              /* @__PURE__ */ n("span", { children: a("payment.processing") })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  rr as P,
+  Ye as a,
+  Ze as b,
+  Je as c,
+  ve as f,
+  We as p,
+  Le as s
+};
+//# sourceMappingURL=payment-form-DqJFiplX.js.map