@amos.com/amos-js 0.9.17 → 0.10.0

package/dist/index.mjs

@@ -83,141 +83,197 @@ function i(e) {
 	}
 }
 //#endregion
+//#region src/plaid-session.ts
+var a = /* @__PURE__ */ new WeakMap();
+function o(e, t) {
+	a.set(e, t);
+}
+function s(e) {
+	if (e) return a.get(e);
+}
+function c(e) {
+	e && a.delete(e);
+}
+//#endregion
 //#region src/types.ts
-function a(e) {
+function l(e) {
 	return e;
 }
 //#endregion
 //#region src/messaging.ts
-function o(e) {
+function u(e) {
 	return new URL(e.src).origin;
 }
-function s(e) {
-	e?.contentWindow && e.contentWindow.postMessage(a({ type: "PARENT_ACKNOWLEDGED_IFRAME_READY" }), o(e));
+function d(e) {
+	e?.contentWindow && e.contentWindow.postMessage(l({ type: "PARENT_ACKNOWLEDGED_IFRAME_READY" }), u(e));
 }
-function c({ iframe: e, appearance: t = {} }) {
-	e?.contentWindow && e.contentWindow.postMessage(a({
+function f({ iframe: e, appearance: t = {} }) {
+	e?.contentWindow && e.contentWindow.postMessage(l({
 		type: "UPDATE_APPEARANCE",
 		appearance: t
-	}), o(e));
+	}), u(e));
 }
-function l({ iframe: e, props: t, height: n }) {
-	e?.contentWindow && e.contentWindow.postMessage(a({
+function p({ iframe: e, props: t, height: n }) {
+	e?.contentWindow && e.contentWindow.postMessage(l({
 		type: "UPDATE_APPLE_PAY_BUTTON",
 		height: n,
 		props: t
-	}), o(e));
+	}), u(e));
 }
-function u({ iframe: e, props: t, height: n }) {
-	e?.contentWindow && e.contentWindow.postMessage(a({
+function m({ iframe: e, props: t, height: n }) {
+	e?.contentWindow && e.contentWindow.postMessage(l({
 		type: "UPDATE_GOOGLE_PAY_BUTTON",
 		height: n,
 		props: t
-	}), o(e));
+	}), u(e));
 }
-function d({ iframe: e, amount: t }) {
-	e?.contentWindow && e.contentWindow.postMessage(a({
+function h({ iframe: e, amount: t }) {
+	e?.contentWindow && e.contentWindow.postMessage(l({
 		type: "UPDATE_AMOUNT",
 		amount: t
-	}), o(e));
+	}), u(e));
 }
-function f({ iframe: e, merchantName: t }) {
-	e?.contentWindow && e.contentWindow.postMessage(a({
+function g({ iframe: e, merchantName: t }) {
+	e?.contentWindow && e.contentWindow.postMessage(l({
 		type: "UPDATE_MERCHANT_NAME",
 		merchantName: t
-	}), o(e));
-}
-function p({ iframe: e }) {
-	let t = crypto.randomUUID();
-	return new Promise((n) => {
-		e?.contentWindow && e.contentWindow.postMessage(a({
+	}), u(e));
+}
+function _({ iframe: e }) {
+	let t = s(e);
+	if (t?.requiresVerification) return Promise.resolve(!!t.plaid);
+	let n = crypto.randomUUID();
+	return new Promise((t) => {
+		e?.contentWindow && e.contentWindow.postMessage(l({
 			type: "VALIDATE_FORM",
-			requestId: t
-		}), o(e));
+			requestId: n
+		}), u(e));
 		let r = setTimeout(() => {
-			window.removeEventListener("message", i), n(!1);
+			window.removeEventListener("message", i), t(!1);
 		}, 5e3);
 		function i(e) {
-			e.data.type === "VALIDATE_FORM" && e.data.requestId === t && (window.removeEventListener("message", i), clearTimeout(r), n(e.data.isValid ?? !1));
+			e.data.type === "VALIDATE_FORM" && e.data.requestId === n && (window.removeEventListener("message", i), clearTimeout(r), t(e.data.isValid ?? !1));
 		}
 		window.addEventListener("message", i);
 	});
 }
-function m({ iframe: e }) {
-	e?.contentWindow && e.contentWindow.postMessage(a({ type: "RESET_FORM" }), o(e));
+var v = 1e4;
+function ee({ iframe: e }) {
+	let t = crypto.randomUUID();
+	return new Promise((n, r) => {
+		if (!e?.contentWindow) {
+			r(/* @__PURE__ */ Error("Bank form is not ready."));
+			return;
+		}
+		let i = e.contentWindow;
+		i.postMessage(l({
+			type: "CREATE_PLAID_LINK_TOKEN",
+			requestId: t
+		}), u(e));
+		let a = setTimeout(() => {
+			window.removeEventListener("message", o), r(/* @__PURE__ */ Error("Timed out waiting for Plaid Link token."));
+		}, v);
+		function o(e) {
+			if (e.source === i && e.data.type === "PLAID_LINK_TOKEN" && e.data.requestId === t) {
+				if (window.removeEventListener("message", o), clearTimeout(a), e.data.link_token) {
+					n(e.data.link_token);
+					return;
+				}
+				r(Error(e.data.error ?? "Could not create Plaid Link token."));
+			}
+		}
+		window.addEventListener("message", o);
+	});
+}
+function y({ iframe: e }) {
+	s(e)?.clearLinked?.(), b(e);
+}
+function b(e) {
+	e?.contentWindow && e.contentWindow.postMessage(l({ type: "RESET_FORM" }), u(e));
+}
+function x({ iframe: e, type: t, token: n, id: r }) {
+	let i = s(e), a = i?.plaid;
+	i?.requiresVerification && !a && b(e), e.contentWindow?.postMessage(l({
+		type: t,
+		token: n,
+		id: r,
+		...a ? { plaid: a } : {}
+	}), u(e));
 }
-function h({ iframe: e, token: t }) {
+function S({ iframe: e, token: t }) {
 	if (!e?.contentWindow) return;
 	let { payment_intent_id: n } = r(t).payload;
-	e.contentWindow.postMessage(a({
+	x({
+		iframe: e,
 		type: "CONFIRM_PAYMENT_INTENT",
 		token: t,
 		id: n ?? void 0
-	}), o(e));
+	});
 }
-function g({ iframe: e, token: t }) {
+function C({ iframe: e, token: t }) {
 	if (!e?.contentWindow) return;
 	let { setup_intent_id: n } = r(t).payload;
-	e.contentWindow.postMessage(a({
+	x({
+		iframe: e,
 		type: "CONFIRM_SETUP_INTENT",
 		token: t,
 		id: n ?? void 0
-	}), o(e));
+	});
 }
-function _({ iframe: e, result: t }) {
-	e?.contentWindow && e.contentWindow.postMessage(a({
+function w({ iframe: e, result: t }) {
+	e?.contentWindow && e.contentWindow.postMessage(l({
 		type: "CONFIRMATION_RESULT",
 		result: t
-	}), o(e));
+	}), u(e));
 }
 //#endregion
 //#region src/apple-pay.ts
-function v(e) {
+function T(e) {
 	return `${i(e)}/iframe/apple-pay?token=${e}`;
 }
-function y() {
+function E() {
 	return "48px";
 }
-function ee(e) {
-	e.contentWindow?.postMessage(a({ type: "APPLE_PAY_CANCEL" }), o(e));
+function D(e) {
+	e.contentWindow?.postMessage(l({ type: "APPLE_PAY_CANCEL" }), u(e));
 }
-function b(e, { height: r = "48px", ...i }) {
+function O(e, { height: r = "48px", ...i }) {
 	let a = {
 		...i,
 		height: r
 	};
 	function o() {
-		d({
+		h({
 			iframe: e,
 			amount: a.amount
 		});
 	}
-	function u() {
-		f({
+	function s() {
+		g({
 			iframe: e,
 			merchantName: a.merchantName
 		});
 	}
-	function p() {
-		l({
+	function c() {
+		p({
 			iframe: e,
 			height: a.height ?? "48px",
 			props: a.buttonProps ?? {}
 		});
 	}
-	function m(r) {
+	function l(r) {
 		if (r.source === e.contentWindow) switch (r.data.type) {
 			case "IFRAME_READY":
-				s(e), c({
+				d(e), f({
 					iframe: e,
 					appearance: {}
-				}), o(), u(), p();
+				}), o(), s(), c();
 				break;
 			case "UPDATE_HEIGHT":
 				a.onHeightChange?.(r.data.height);
 				break;
 			case "UPDATE_APPEARANCE":
-				c({
+				f({
 					iframe: e,
 					appearance: r.data.appearance
 				});
@@ -227,7 +283,7 @@ function b(e, { height: r = "48px", ...i }) {
 				break;
 			case "APPLE_PAY_WINDOW_OPEN":
 				t({ onCancel: () => {
-					ee(e), n();
+					D(e), n();
 				} });
 				break;
 			case "APPLE_PAY_WINDOW_CLOSE":
@@ -238,7 +294,7 @@ function b(e, { height: r = "48px", ...i }) {
 					paymentIntentCreateAttributes: r.data.paymentIntentCreateAttributes,
 					customerCreateAttributes: r.data.customerCreateAttributes
 				}).then((t) => {
-					h({
+					S({
 						iframe: e,
 						token: t
 					});
@@ -252,22 +308,22 @@ function b(e, { height: r = "48px", ...i }) {
 			case "CONFIRMATION_RESULT": n(), a.onResult(r.data.result);
 		}
 	}
-	return window.addEventListener("message", m), {
+	return window.addEventListener("message", l), {
 		update(e) {
 			let t = "amount" in e, n = "merchantName" in e, r = "height" in e || "buttonProps" in e;
 			a = {
 				...a,
 				...e
-			}, t && o(), n && u(), r && p();
+			}, t && o(), n && s(), r && c();
 		},
 		destroy() {
-			window.removeEventListener("message", m), n();
+			window.removeEventListener("message", l), n();
 		}
 	};
 }
 //#endregion
 //#region src/form-skeleton.ts
-var x = "amos-js-form-skeleton-styles", S = {
+var k = "amos-js-form-skeleton-styles", te = {
 	"--accent": "oklch(0.97 0 0)",
 	"--radius": "0.625rem",
 	"--input-height": "2.25rem",
@@ -275,132 +331,132 @@ var x = "amos-js-form-skeleton-styles", S = {
 	"--field-gap": "1rem",
 	"--control-gap": "0.5rem",
 	"--label-font-size": "0.875rem"
-}, C = "\n.amos-js-form-skeleton {\n  box-sizing: border-box;\n  container-type: inline-size;\n  display: flex;\n  flex-direction: column;\n  gap: var(--field-gap);\n  margin: 0 -4px;\n  padding-block: 0.25rem;\n  pointer-events: none;\n  width: calc(100% + 8px);\n}\n.amos-js-form-skeleton-field {\n  display: flex;\n  flex: 1 1 0;\n  flex-direction: column;\n  min-width: 0;\n  width: 100%;\n}\n.amos-js-form-skeleton-label {\n  flex-shrink: 0;\n  font-size: var(--label-font-size);\n  height: 1.75rem;\n  line-height: 1.75rem;\n}\n.amos-js-form-skeleton-input {\n  animation: amos-js-skeleton-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  background: var(--accent);\n  border-radius: calc(var(--radius) * 0.8);\n  box-sizing: border-box;\n  height: var(--input-height);\n  width: 100%;\n}\n.amos-js-form-skeleton-input-floating {\n  height: var(--floating-input-height);\n}\n.amos-js-form-skeleton-row {\n  align-items: flex-start;\n  display: flex;\n  gap: var(--control-gap);\n  width: 100%;\n}\n.amos-js-form-skeleton-row-stack {\n  display: flex;\n  flex-direction: column;\n  gap: var(--field-gap);\n  width: 100%;\n}\n@container (min-width: 24rem) {\n  .amos-js-form-skeleton-row-stack {\n    align-items: flex-start;\n    flex-direction: row;\n    gap: var(--control-gap);\n  }\n}\n.amos-js-wallet-skeleton {\n  flex: none;\n  width: 100%;\n}\n@keyframes amos-js-skeleton-pulse {\n  50% { opacity: 0.5; }\n}\n@media (prefers-reduced-motion: reduce) {\n  .amos-js-form-skeleton-input {\n    animation: none;\n  }\n}\n";
-function w() {
-	if (document.getElementById(x)) return;
+}, ne = "\n.amos-js-form-skeleton {\n  box-sizing: border-box;\n  container-type: inline-size;\n  display: flex;\n  flex-direction: column;\n  gap: var(--field-gap);\n  margin: 0 -4px;\n  padding-block: 0.25rem;\n  pointer-events: none;\n  width: calc(100% + 8px);\n}\n.amos-js-form-skeleton-field {\n  display: flex;\n  flex: 1 1 0;\n  flex-direction: column;\n  min-width: 0;\n  width: 100%;\n}\n.amos-js-form-skeleton-label {\n  flex-shrink: 0;\n  font-size: var(--label-font-size);\n  height: 1.75rem;\n  line-height: 1.75rem;\n}\n.amos-js-form-skeleton-input {\n  animation: amos-js-skeleton-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  background: var(--accent);\n  border-radius: calc(var(--radius) * 0.8);\n  box-sizing: border-box;\n  height: var(--input-height);\n  width: 100%;\n}\n.amos-js-form-skeleton-input-floating {\n  height: var(--floating-input-height);\n}\n.amos-js-form-skeleton-row {\n  align-items: flex-start;\n  display: flex;\n  gap: var(--control-gap);\n  width: 100%;\n}\n.amos-js-form-skeleton-row-stack {\n  display: flex;\n  flex-direction: column;\n  gap: var(--field-gap);\n  width: 100%;\n}\n@container (min-width: 24rem) {\n  .amos-js-form-skeleton-row-stack {\n    align-items: flex-start;\n    flex-direction: row;\n    gap: var(--control-gap);\n  }\n}\n.amos-js-wallet-skeleton {\n  flex: none;\n  width: 100%;\n}\n@keyframes amos-js-skeleton-pulse {\n  50% { opacity: 0.5; }\n}\n@media (prefers-reduced-motion: reduce) {\n  .amos-js-form-skeleton-input {\n    animation: none;\n  }\n}\n";
+function A() {
+	if (document.getElementById(k)) return;
 	let e = document.createElement("style");
-	e.id = x, e.textContent = C, document.head.appendChild(e);
+	e.id = k, e.textContent = ne, document.head.appendChild(e);
 }
-function T(e, t) {
-	for (let [t, n] of Object.entries(S)) e.style.setProperty(t, n);
+function j(e, t) {
+	for (let [t, n] of Object.entries(te)) e.style.setProperty(t, n);
 	let n = t?.themeVariables;
 	if (n) for (let [t, r] of Object.entries(n)) typeof r == "string" && r.trim() !== "" && e.style.setProperty(t, r.trim());
 }
-function E(e, t) {
+function M(e, t) {
 	let n = document.createElement("div");
 	if (n.className = e, t) for (let e of t) n.appendChild(e);
 	return n;
 }
-function D(e, t) {
-	let n = E("amos-js-form-skeleton-field");
-	t !== void 0 && (n.style.flexGrow = String(t)), e === "above" && n.appendChild(E("amos-js-form-skeleton-label"));
-	let r = E("amos-js-form-skeleton-input");
+function N(e, t) {
+	let n = M("amos-js-form-skeleton-field");
+	t !== void 0 && (n.style.flexGrow = String(t)), e === "above" && n.appendChild(M("amos-js-form-skeleton-label"));
+	let r = M("amos-js-form-skeleton-input");
 	return e === "floating" && r.classList.add("amos-js-form-skeleton-input-floating"), n.appendChild(r), n;
 }
-function O(e, t) {
-	return E(t ? "amos-js-form-skeleton-row-stack" : "amos-js-form-skeleton-row", e);
+function P(e, t) {
+	return M(t ? "amos-js-form-skeleton-row-stack" : "amos-js-form-skeleton-row", e);
 }
-function k({ labels: e, requirement: t, wrapCountryZip: n }) {
+function re({ labels: e, requirement: t, wrapCountryZip: n }) {
 	return t === "full" ? [
-		D(e),
-		D(e),
-		O([
-			D(e, 1.4),
-			D(e, .7),
-			D(e, .8)
+		N(e),
+		N(e),
+		P([
+			N(e, 1.4),
+			N(e, .7),
+			N(e, .8)
 		], !1),
-		D(e)
-	] : [O([D(e), D(e)], n)];
+		N(e)
+	] : [P([N(e), N(e)], n)];
 }
-function A(e) {
+function ie(e) {
 	let t = e.appearance?.labels ?? "above", n = e.billingAddressRequirement ?? "country";
 	if (e.kind === "card") {
-		let r = [D(t), O([D(t), D(t)], !1)];
-		return e.additionalFields?.cardholderName && r.push(D(t)), r.push(...k({
+		let r = [N(t), P([N(t), N(t)], !1)];
+		return e.additionalFields?.cardholderName && r.push(N(t)), r.push(...re({
 			labels: t,
 			requirement: n,
 			wrapCountryZip: !1
 		})), r;
 	}
 	return [
-		D(t),
-		O([D(t), D(t)], !0),
-		D(t),
-		O([D("above"), D("above")], !0),
-		...k({
+		N(t),
+		P([N(t), N(t)], !0),
+		N(t),
+		P([N("above"), N("above")], !0),
+		...re({
 			labels: t,
 			requirement: n,
 			wrapCountryZip: !0
 		})
 	];
 }
-function j(e) {
-	w();
-	let t = E("amos-js-form-skeleton");
+function ae(e) {
+	A();
+	let t = M("amos-js-form-skeleton");
 	t.setAttribute("aria-hidden", "true");
 	function n(e) {
-		T(t, e.appearance), t.replaceChildren(...A(e));
+		j(t, e.appearance), t.replaceChildren(...ie(e));
 	}
 	return n(e), {
 		element: t,
 		update: n
 	};
 }
-function M(e) {
-	w();
-	let t = E("amos-js-form-skeleton-input amos-js-wallet-skeleton");
+function F(e) {
+	A();
+	let t = M("amos-js-form-skeleton-input amos-js-wallet-skeleton");
 	t.setAttribute("aria-hidden", "true");
 	function n(e) {
-		T(t, void 0), t.style.height = e.height, t.style.borderRadius = e.borderRadius ?? "4px";
+		j(t, void 0), t.style.height = e.height, t.style.borderRadius = e.borderRadius ?? "4px";
 	}
 	return n(e), {
 		element: t,
 		update: n
 	};
 }
-function N(e) {
+function I(e) {
 	if (typeof e == "number" && Number.isFinite(e)) return `${e}px`;
 	if (typeof e == "string" && e.trim() !== "") return e.trim();
 }
-function P({ iframeStyle: e, buttonProps: t }) {
-	return N(e?.borderRadius) ?? N(t?.buttonRadius) ?? N(t?.style?.borderRadius) ?? N(t?.style?.["--apple-pay-button-border-radius"]) ?? "4px";
+function L({ iframeStyle: e, buttonProps: t }) {
+	return I(e?.borderRadius) ?? I(t?.buttonRadius) ?? I(t?.style?.borderRadius) ?? I(t?.style?.["--apple-pay-button-border-radius"]) ?? "4px";
 }
 //#endregion
 //#region src/google-pay.ts
-function F(e) {
+function R(e) {
 	return `${i(e)}/iframe/google-pay?token=${e}`;
 }
-function I() {
+function z() {
 	return "48px";
 }
-function L(e, { height: t = "48px", ...n }) {
+function B(e, { height: t = "48px", ...n }) {
 	let r = {
 		...n,
 		height: t
 	};
 	function i() {
-		d({
+		h({
 			iframe: e,
 			amount: r.amount
 		});
 	}
 	function a() {
-		f({
+		g({
 			iframe: e,
 			merchantName: r.merchantName
 		});
 	}
 	function o() {
-		u({
+		m({
 			iframe: e,
 			height: r.height ?? "48px",
 			props: r.buttonProps ?? {}
 		});
 	}
-	function l(t) {
+	function s(t) {
 		if (t.source === e.contentWindow) switch (t.data.type) {
 			case "IFRAME_READY":
-				s(e), c({
+				d(e), f({
 					iframe: e,
 					appearance: {}
 				}), i(), a(), o();
@@ -409,7 +465,7 @@ function L(e, { height: t = "48px", ...n }) {
 				r.onHeightChange?.(t.data.height);
 				break;
 			case "UPDATE_APPEARANCE":
-				c({
+				f({
 					iframe: e,
 					appearance: t.data.appearance
 				});
@@ -422,7 +478,7 @@ function L(e, { height: t = "48px", ...n }) {
 					paymentIntentCreateAttributes: t.data.paymentIntentCreateAttributes,
 					customerCreateAttributes: t.data.customerCreateAttributes
 				}).then((t) => {
-					h({
+					S({
 						iframe: e,
 						token: t
 					});
@@ -436,7 +492,7 @@ function L(e, { height: t = "48px", ...n }) {
 			case "CONFIRMATION_RESULT": r.onResult(t.data.result);
 		}
 	}
-	return window.addEventListener("message", l), {
+	return window.addEventListener("message", s), {
 		update(e) {
 			let t = "amount" in e, n = "merchantName" in e, s = "height" in e || "buttonProps" in e;
 			r = {
@@ -445,11 +501,11 @@ function L(e, { height: t = "48px", ...n }) {
 			}, t && i(), n && a(), s && o();
 		},
 		destroy() {
-			window.removeEventListener("message", l);
+			window.removeEventListener("message", s);
 		}
 	};
 }
-function R({ paymentData: e }) {
+function oe({ paymentData: e }) {
 	return { paymentMethod: {
 		type: "googlepay",
 		billing_address_attributes: {
@@ -468,14 +524,14 @@ function R({ paymentData: e }) {
 }
 //#endregion
 //#region src/payment-method-form.ts
-var z = {
+var V = {
 	country: 212,
 	full: 452
-}, te = 80, B = {
+}, se = 80, H = {
 	country: 400,
 	full: 640
 };
-function V(e, t = { cardholderName: !1 }, n = "country") {
+function U(e, t = { cardholderName: !1 }, n = "country") {
 	let r = Object.entries(t).filter(([, e]) => e).map(([e]) => e).join(","), a = new URLSearchParams({
 		token: e,
 		additionalFields: r,
@@ -483,25 +539,25 @@ function V(e, t = { cardholderName: !1 }, n = "country") {
 	});
 	return `${i(e)}/iframe/card?${a}`;
 }
-function H(e, t = "country") {
+function W(e, t = "country") {
 	let n = new URLSearchParams({
 		token: e,
 		billingAddressRequirement: t
 	});
 	return `${i(e)}/iframe/bank?${n}`;
 }
-function U(e = { cardholderName: !1 }, t = "country") {
-	return `${(z[t] ?? z.country) + (e.cardholderName ? te : 0)}px`;
+function G(e = { cardholderName: !1 }, t = "country") {
+	return `${(V[t] ?? V.country) + (e.cardholderName ? se : 0)}px`;
 }
-function W(e = "country") {
-	return `${B[e] ?? B.country}px`;
+function K(e = "country") {
+	return `${H[e] ?? H.country}px`;
 }
-function G(e, t) {
+function q(e, t) {
 	let n = { ...t };
 	function r(t) {
 		if (t.source === e.contentWindow) switch (t.data.type) {
 			case "IFRAME_READY":
-				s(e), c({
+				d(e), f({
 					iframe: e,
 					appearance: n.appearance
 				});
@@ -510,7 +566,7 @@ function G(e, t) {
 				n.onHeightChange?.(t.data.height);
 				break;
 			case "UPDATE_APPEARANCE":
-				c({
+				f({
 					iframe: e,
 					appearance: t.data.appearance
 				});
@@ -519,8 +575,12 @@ function G(e, t) {
 				n.onAppearanceReady?.();
 				break;
 			case "FORM_VALIDITY_CHANGE":
+				if (s(e)?.requiresVerification) break;
 				n.onValidityChange?.({ isValid: t.data.isValid });
 				break;
+			case "CARD_BRAND_CHANGE":
+				n.onCardBrandChanged?.({ brand: t.data.brand });
+				break;
 			case "CONFIRMATION_RESULT": n.onResult(t.data.result);
 		}
 	}
@@ -530,7 +590,7 @@ function G(e, t) {
 			n = {
 				...n,
 				...t
-			}, r && c({
+			}, r && f({
 				iframe: e,
 				appearance: n.appearance
 			});
@@ -541,8 +601,187 @@ function G(e, t) {
 	};
 }
 //#endregion
+//#region src/plaid.ts
+var J = "https://cdn.plaid.com/link/v2/stable/link-initialize.js";
+function Y({ amount: e, achThreshold: t }) {
+	return t == null ? !1 : e == null || e >= t;
+}
+function ce(e) {
+	if (e == null) return;
+	let t = e.trim();
+	if (t === "") return;
+	let n = Number(t.replace(/[^\d.]/g, ""));
+	if (Number.isFinite(n)) return Math.round(n * 100);
+}
+function le(e) {
+	return e.account_id ?? e.account?.id ?? e.accounts?.[0]?.id;
+}
+function ue(e) {
+	let t = e.account ?? e.accounts?.[0];
+	return {
+		bankName: e.institution?.name ?? "Bank account",
+		last4: t?.mask ?? ""
+	};
+}
+var X;
+function de() {
+	for (let e of document.querySelectorAll(`script[src="${J}"]`)) e.remove();
+}
+function fe() {
+	return typeof window > "u" ? Promise.reject(/* @__PURE__ */ Error("Plaid Link requires a browser")) : window.Plaid ? Promise.resolve() : X || (de(), X = new Promise((e, t) => {
+		let n = document.createElement("script");
+		n.src = J, n.async = !0;
+		let r = (e) => {
+			n.remove(), X = void 0, t(Error(e));
+		};
+		n.addEventListener("load", () => {
+			if (window.Plaid) {
+				e();
+				return;
+			}
+			r("Plaid Link failed to initialize");
+		}, { once: !0 }), n.addEventListener("error", () => r("Failed to load Plaid Link"), { once: !0 }), document.head.append(n);
+	}), X);
+}
+async function pe({ token: e, onSuccess: t, onExit: n, signal: r }) {
+	if (await fe(), r?.aborted) return () => {};
+	if (!window.Plaid) throw Error("Plaid Link failed to initialize");
+	let i = window.Plaid.create({
+		token: e,
+		onSuccess: t,
+		onExit: (e) => {
+			n?.(e);
+		}
+	});
+	return r?.aborted ? (i.destroy(), () => {}) : (i.open(), () => {
+		i.destroy();
+	});
+}
+//#endregion
+//#region src/plaid-bank-ui.ts
+var me = "amos-js-plaid-bank-ui-styles", he = "\n.amos-js-plaid-panel {\n  box-sizing: border-box;\n  color: var(--foreground, oklch(0.145 0 0));\n  display: none;\n  flex-direction: column;\n  font-family: inherit;\n  gap: var(--control-gap, 0.5rem);\n  width: 100%;\n}\n.amos-js-plaid-panel[data-mode=\"connect\"],\n.amos-js-plaid-panel[data-mode=\"linked\"] {\n  display: flex;\n}\n.amos-js-plaid-connect {\n  align-items: center;\n  background: var(--background, oklch(1 0 0));\n  border: var(--input-border-width, 1px) solid var(--border, oklch(0.922 0 0));\n  border-radius: calc(var(--radius, 0.625rem) * 0.8);\n  box-shadow: var(--input-shadow, 0 1px 2px 0 rgb(0 0 0 / 0.05));\n  box-sizing: border-box;\n  color: var(--foreground, oklch(0.145 0 0));\n  cursor: pointer;\n  display: inline-flex;\n  flex-shrink: 0;\n  font: inherit;\n  font-size: var(--input-font-size, 0.875rem);\n  font-weight: 500;\n  height: var(--input-height, 2.25rem);\n  justify-content: center;\n  line-height: 1.25;\n  outline: none;\n  padding: 0 var(--input-padding, 0.75rem);\n  transition: color 150ms, background-color 150ms, border-color 150ms, box-shadow 150ms;\n  width: 100%;\n}\n.amos-js-plaid-panel[data-mode=\"linked\"] .amos-js-plaid-connect {\n  display: none;\n}\n.amos-js-plaid-connect:hover:not(:disabled) {\n  background: var(--accent, oklch(0.97 0 0));\n  color: var(--accent-foreground, oklch(0.205 0 0));\n}\n.amos-js-plaid-connect:focus-visible {\n  border-color: var(--ring, oklch(0.708 0 0));\n  box-shadow:\n    var(--input-shadow, 0 1px 2px 0 rgb(0 0 0 / 0.05)),\n    0 0 0 var(--ring-width, 3px)\n      color-mix(in oklab, var(--ring, oklch(0.708 0 0)) 50%, transparent);\n}\n.amos-js-plaid-connect:disabled {\n  cursor: default;\n  opacity: 0.5;\n  pointer-events: none;\n}\n.amos-js-plaid-linked {\n  display: none;\n  flex-direction: column;\n  gap: 0.25rem;\n}\n.amos-js-plaid-panel[data-mode=\"linked\"] .amos-js-plaid-linked {\n  display: flex;\n}\n.amos-js-plaid-linked-name {\n  font-size: var(--input-font-size, 0.875rem);\n  font-weight: 500;\n}\n.amos-js-plaid-linked-meta {\n  color: var(--muted-foreground, oklch(0.556 0 0));\n  font-size: 0.75rem;\n}\n.amos-js-plaid-disconnect {\n  align-self: flex-start;\n  background: none;\n  border: none;\n  border-radius: calc(var(--radius, 0.625rem) * 0.8);\n  color: var(--muted-foreground, oklch(0.556 0 0));\n  cursor: pointer;\n  font: inherit;\n  font-size: var(--input-font-size, 0.875rem);\n  margin-top: 0.25rem;\n  outline: none;\n  padding: 0;\n}\n.amos-js-plaid-disconnect:hover {\n  color: var(--accent-foreground, oklch(0.205 0 0));\n}\n.amos-js-plaid-disconnect:focus-visible {\n  box-shadow:\n    0 0 0 var(--ring-width, 3px)\n      color-mix(in oklab, var(--ring, oklch(0.708 0 0)) 50%, transparent);\n}\n.amos-js-plaid-error {\n  color: var(--destructive, oklch(0.577 0.245 27.325));\n  display: none;\n  font-size: var(--error-font-size, 0.875rem);\n  margin: 0;\n}\n.amos-js-plaid-error:not(:empty) {\n  display: block;\n}\n@media (prefers-reduced-motion: reduce) {\n  .amos-js-plaid-connect {\n    transition: none;\n  }\n}\n";
+function ge() {
+	if (document.getElementById(me)) return;
+	let e = document.createElement("style");
+	e.id = me, e.textContent = he, document.head.append(e);
+}
+function _e(e, t, n) {
+	for (let t of n) e.style.removeProperty(t);
+	n.length = 0;
+	let r = t?.themeVariables;
+	if (r) for (let [t, i] of Object.entries(r)) typeof i == "string" && i.trim() !== "" && (e.style.setProperty(t, i.trim()), n.push(t));
+}
+function ve({ host: e, iframe: t, options: n }) {
+	ge();
+	let r = { ...n }, i = [], a = !1, s, l = !1, u, d = !1, f, p, m = new AbortController(), h, g = document.createElement("div");
+	g.className = "amos-js-plaid-panel", g.setAttribute("data-amos-plaid-panel", "true"), g.dataset.mode = "hidden", _e(g, r.appearance, i);
+	let _ = document.createElement("button");
+	_.type = "button", _.className = "amos-js-plaid-connect", _.textContent = "Connect bank account", _.setAttribute("data-testid", "amos-plaid-connect");
+	let v = document.createElement("div");
+	v.className = "amos-js-plaid-linked";
+	let y = document.createElement("span");
+	y.className = "amos-js-plaid-linked-name";
+	let b = document.createElement("span");
+	b.className = "amos-js-plaid-linked-meta";
+	let x = document.createElement("button");
+	x.type = "button", x.className = "amos-js-plaid-disconnect", x.textContent = "Disconnect", x.setAttribute("aria-label", "Disconnect bank account");
+	let S = document.createElement("p");
+	S.className = "amos-js-plaid-error", S.setAttribute("role", "alert"), v.append(y, b, x), g.append(_, v, S), e.append(g);
+	let C = t.parentElement;
+	function w(e) {
+		S.textContent = e ?? "";
+	}
+	function T() {
+		return a ? l ? !0 : Y({
+			amount: ce(r.amount),
+			achThreshold: s
+		}) : !1;
+	}
+	function E() {
+		let e = !!h;
+		f !== e && (f = e, r.onValidityChange?.({ isValid: e }));
+	}
+	function D() {
+		let e = T();
+		if (o(t, {
+			requiresVerification: e,
+			plaid: e ? h?.credentials : void 0,
+			clearLinked: O
+		}), !e) {
+			g.dataset.mode = "hidden", C && (C.style.display = ""), f = void 0;
+			return;
+		}
+		g.dataset.mode = h ? "linked" : "connect", C && (C.style.display = "none"), h && (y.textContent = h.bankName, b.textContent = h.last4 ? `****${h.last4}` : "Connected"), E();
+	}
+	function O() {
+		h = void 0, u = void 0, p?.(), p = void 0, w(void 0), D();
+	}
+	function k(e) {
+		if (e.source === t.contentWindow && e.data.type === "ACH_THRESHOLD") {
+			if (a = !0, s = e.data.achThreshold ?? void 0, l = e.data.requireVerification === !0, h && !T()) {
+				O();
+				return;
+			}
+			D();
+		}
+	}
+	return window.addEventListener("message", k), D(), x.addEventListener("click", () => {
+		O();
+	}), _.addEventListener("click", () => {
+		(async () => {
+			if (!(m.signal.aborted || d)) {
+				d = !0, _.disabled = !0, w(void 0);
+				try {
+					if (u ||= await ee({ iframe: t }), m.signal.aborted) return;
+					let e = u;
+					p?.(), p = await pe({
+						token: e,
+						signal: m.signal,
+						onSuccess: (e, t) => {
+							if (m.signal.aborted) return;
+							let n = le(t);
+							if (!n) {
+								w("Select a bank account to continue.");
+								return;
+							}
+							let r = ue(t);
+							h = {
+								credentials: {
+									public_token: e,
+									account_id: n
+								},
+								bankName: r.bankName,
+								last4: r.last4
+							}, u = void 0, D();
+						},
+						onExit: (e) => {
+							m.signal.aborted || e?.error_code === "INVALID_LINK_TOKEN" && (u = void 0);
+						}
+					}), m.signal.aborted && (p(), p = void 0);
+				} catch (e) {
+					if (u = void 0, m.signal.aborted) return;
+					w(e instanceof Error ? e.message : "Could not connect bank.");
+				} finally {
+					d = !1, m.signal.aborted || (_.disabled = !1);
+				}
+			}
+		})();
+	}), {
+		update(e) {
+			if ("amount" in e && (r.amount = e.amount), "onValidityChange" in e && (r.onValidityChange = e.onValidityChange), "appearance" in e && (r.appearance = e.appearance, _e(g, r.appearance, i)), h && !T()) {
+				O();
+				return;
+			}
+			D();
+		},
+		destroy() {
+			m.abort(), window.removeEventListener("message", k), p?.(), p = void 0, c(t), g.remove();
+		}
+	};
+}
+//#endregion
 //#region src/mount.ts
-function K(e) {
+function Z(e) {
 	if (typeof e == "string") {
 		let t = document.querySelector(e);
 		if (!(t instanceof HTMLElement)) throw Error(`[amos-js] Container "${e}" did not match any HTMLElement.`);
@@ -550,19 +789,19 @@ function K(e) {
 	}
 	return e;
 }
-var q = {
+var ye = {
 	width: "calc(100% + 8px)",
 	transition: "opacity 150ms ease-in, height 200ms ease-in-out",
 	margin: "0 -4px",
 	opacity: "0",
 	border: "0"
-}, J = {
+}, be = {
 	width: "100%",
 	transition: "height 200ms ease-in-out",
 	margin: "0",
 	opacity: "0",
 	border: "0"
-}, Y = {
+}, xe = {
 	position: "absolute",
 	top: "0",
 	left: "0",
@@ -572,7 +811,7 @@ var q = {
 	opacity: "0",
 	transition: "none",
 	pointerEvents: "none"
-}, X = {
+}, Se = {
 	position: "absolute",
 	top: "0",
 	left: "-4px",
@@ -582,15 +821,15 @@ var q = {
 	transition: "none",
 	pointerEvents: "none"
 };
-function Z({ src: e, title: t, name: n, height: r, allow: i, className: a, style: o = q }) {
+function Q({ src: e, title: t, name: n, height: r, allow: i, className: a, style: o = ye }) {
 	let s = document.createElement("iframe");
 	return s.src = e, s.title = t, s.name = n, s.setAttribute("role", "presentation"), s.scrolling = "no", i && (s.allow = i), a != null && (s.className = a), Object.assign(s.style, o, { height: r }), s;
 }
-function Q({ host: e, iframe: t, listenerOptions: n, skeletonOptions: r }) {
+function Ce({ host: e, iframe: t, listenerOptions: n, skeletonOptions: r }) {
 	let i = document.createElement("div");
 	i.style.position = "relative", i.style.width = "100%", i.setAttribute("aria-busy", "true");
-	let a = j(r);
-	Object.assign(t.style, X), i.append(a.element, t), e.appendChild(i);
+	let a = ae(r);
+	Object.assign(t.style, Se), i.append(a.element, t), e.appendChild(i);
 	let o = !1, s = !1, c, l = r.appearance, u, d;
 	function f() {
 		return i.getBoundingClientRect().height;
@@ -602,7 +841,7 @@ function Q({ host: e, iframe: t, listenerOptions: n, skeletonOptions: r }) {
 		if (o) return;
 		o = !0, d !== void 0 && (clearTimeout(d), d = void 0);
 		let e = f(), n = p(), r = Number.isFinite(n) ? Math.max(n, e) : e;
-		t.style.transition = "none", t.style.position = "", t.style.top = "", t.style.left = "", t.style.margin = q.margin ?? "", t.style.height = `${r}px`, t.style.opacity = "1", t.style.pointerEvents = "", a.element.remove(), i.removeAttribute("aria-busy"), u = setTimeout(() => {
+		t.style.transition = "none", t.style.position = "", t.style.top = "", t.style.left = "", t.style.margin = ye.margin ?? "", t.style.height = `${r}px`, t.style.opacity = "1", t.style.pointerEvents = "", a.element.remove(), i.removeAttribute("aria-busy"), u = setTimeout(() => {
 			t.style.transition = "height 200ms ease-in-out";
 		}, 400);
 	}
@@ -611,7 +850,7 @@ function Q({ host: e, iframe: t, listenerOptions: n, skeletonOptions: r }) {
 		let e = p(), t = f();
 		Number.isFinite(e) && e >= t - 2 && m();
 	}
-	let g = G(t, {
+	let g = q(t, {
 		...n,
 		onHeightChange: (e) => {
 			c = e, o ? t.style.height = e : h(), n.onHeightChange?.(e);
@@ -638,12 +877,12 @@ function Q({ host: e, iframe: t, listenerOptions: n, skeletonOptions: r }) {
 function $({ host: e, iframe: t, listenerOptions: n, iframeStyle: r, attachListeners: i }) {
 	let a = {
 		height: n.height ?? "48px",
-		borderRadius: P({
+		borderRadius: L({
 			iframeStyle: r,
 			buttonProps: n.buttonProps
 		})
-	}, o = M(a), s = document.createElement("div");
-	s.style.position = "relative", s.style.width = "100%", s.style.height = a.height, s.style.overflow = "hidden", s.setAttribute("aria-busy", "true"), Object.assign(t.style, Y), t.style.height = "100%", s.append(o.element, t), e.appendChild(s);
+	}, o = F(a), s = document.createElement("div");
+	s.style.position = "relative", s.style.width = "100%", s.style.height = a.height, s.style.overflow = "hidden", s.setAttribute("aria-busy", "true"), Object.assign(t.style, xe), t.style.height = "100%", s.append(o.element, t), e.appendChild(s);
 	let c = !1, l = !1, u, d = n;
 	function f() {
 		c || (c = !0, u !== void 0 && (clearTimeout(u), u = void 0), t.style.opacity = "1", t.style.pointerEvents = "", o.element.remove(), s.removeAttribute("aria-busy"));
@@ -672,7 +911,7 @@ function $({ host: e, iframe: t, listenerOptions: n, iframeStyle: r, attachListe
 			let t = { ...e };
 			delete t.onAppearanceReady, delete t.onHeightChange, m.update(t), a = {
 				height: d.height ?? a.height,
-				borderRadius: P({
+				borderRadius: L({
 					iframeStyle: r,
 					buttonProps: d.buttonProps
 				})
@@ -683,15 +922,15 @@ function $({ host: e, iframe: t, listenerOptions: n, iframeStyle: r, attachListe
 		}
 	};
 }
-function ne(e, t) {
-	let n = K(e), { renderToken: r, additionalFields: i = { cardholderName: !1 }, billingAddressRequirement: a = "country", ...o } = t;
-	return Q({
+function we(e, t) {
+	let n = Z(e), { renderToken: r, additionalFields: i = { cardholderName: !1 }, billingAddressRequirement: a = "country", ...o } = t;
+	return Ce({
 		host: n,
-		iframe: Z({
-			src: V(r, i, a),
+		iframe: Q({
+			src: U(r, i, a),
 			title: "Secure credit card payment method form powered by Amos",
 			name: "amos-credit-card-payment-method-form",
-			height: U(i, a)
+			height: G(i, a)
 		}),
 		listenerOptions: o,
 		skeletonOptions: {
@@ -702,59 +941,75 @@ function ne(e, t) {
 		}
 	});
 }
-function re(e, t) {
-	let n = K(e), { renderToken: r, billingAddressRequirement: i = "country", ...a } = t;
-	return Q({
+function Te(e, t) {
+	let n = Z(e), { renderToken: r, billingAddressRequirement: i = "country", amount: a, ...o } = t, s = Q({
+		src: W(r, i),
+		title: "Secure bank account payment method form powered by Amos",
+		name: "amos-bank-account-payment-method-form",
+		height: K(i)
+	}), c = Ce({
 		host: n,
-		iframe: Z({
-			src: H(r, i),
-			title: "Secure bank account payment method form powered by Amos",
-			name: "amos-bank-account-payment-method-form",
-			height: W(i)
-		}),
-		listenerOptions: a,
+		iframe: s,
+		listenerOptions: o,
 		skeletonOptions: {
 			kind: "bank",
-			appearance: a.appearance,
+			appearance: o.appearance,
 			billingAddressRequirement: i
 		}
+	}), l = ve({
+		host: n,
+		iframe: s,
+		options: {
+			amount: a,
+			appearance: o.appearance,
+			onValidityChange: o.onValidityChange
+		}
 	});
+	return {
+		iframe: s,
+		update(e) {
+			c.update(e), l.update(e);
+		},
+		destroy() {
+			l.destroy(), c.destroy();
+		}
+	};
 }
-function ie(e, t) {
-	let n = K(e), { renderToken: r, iframeClassName: i, iframeStyle: a, ...o } = t, s = Z({
-		src: F(r),
+function Ee(e, t) {
+	let n = Z(e), { renderToken: r, iframeClassName: i, iframeStyle: a, ...o } = t, s = Q({
+		src: R(r),
 		title: "Secure Google Pay button powered by Amos",
 		name: "amos-google-pay-button",
-		height: o.height ?? I(),
+		height: o.height ?? z(),
 		allow: "payment",
 		className: i,
-		style: J
+		style: be
 	});
 	return Object.assign(s.style, a), $({
 		host: n,
 		iframe: s,
 		listenerOptions: o,
 		iframeStyle: a,
-		attachListeners: L
+		attachListeners: B
 	});
 }
-function ae(e, t) {
-	let n = K(e), { renderToken: r, iframeClassName: i, iframeStyle: a, ...o } = t, s = Z({
-		src: v(r),
+function De(e, t) {
+	let n = Z(e), { renderToken: r, iframeClassName: i, iframeStyle: a, ...o } = t, s = Q({
+		src: T(r),
 		title: "Secure Apple Pay button powered by Amos",
 		name: "amos-apple-pay-button",
-		height: o.height ?? y(),
+		height: o.height ?? E(),
 		allow: "payment",
 		className: i,
-		style: J
+		style: be
 	});
 	return Object.assign(s.style, a), $({
 		host: n,
 		iframe: s,
 		listenerOptions: o,
 		iframeStyle: a,
-		attachListeners: b
+		attachListeners: O
 	});
 }
 //#endregion
-export { C as SKELETON_STYLES, b as attachApplePayButtonListeners, L as attachGooglePayButtonListeners, G as attachPaymentMethodFormListeners, h as confirmPaymentIntent, g as confirmSetupIntent, a as createMessage, j as createPaymentMethodFormSkeleton, M as createWalletButtonSkeleton, r as decodeJwt, w as ensureSkeletonStyles, R as formatGooglePayPaymentData, y as getApplePayButtonInitialHeight, v as getApplePayButtonSrc, W as getBankAccountFormInitialHeight, H as getBankAccountFormSrc, U as getCreditCardFormInitialHeight, V as getCreditCardFormSrc, i as getEmbedOrigin, I as getGooglePayButtonInitialHeight, F as getGooglePayButtonSrc, ae as mountAmosApplePayButton, re as mountAmosBankAccountPaymentMethodForm, ne as mountAmosCreditCardPaymentMethodForm, ie as mountAmosGooglePayButton, m as resetForm, P as resolveWalletButtonSkeletonBorderRadius, _ as sendConfirmationResult, s as sendParentReadyMessage, d as updateAmount, c as updateAppearance, l as updateApplePayButton, u as updateGooglePayButton, f as updateMerchantName, p as validateForm };
+export { ne as SKELETON_STYLES, O as attachApplePayButtonListeners, B as attachGooglePayButtonListeners, q as attachPaymentMethodFormListeners, S as confirmPaymentIntent, C as confirmSetupIntent, l as createMessage, ae as createPaymentMethodFormSkeleton, F as createWalletButtonSkeleton, r as decodeJwt, A as ensureSkeletonStyles, oe as formatGooglePayPaymentData, E as getApplePayButtonInitialHeight, T as getApplePayButtonSrc, K as getBankAccountFormInitialHeight, W as getBankAccountFormSrc, G as getCreditCardFormInitialHeight, U as getCreditCardFormSrc, i as getEmbedOrigin, z as getGooglePayButtonInitialHeight, R as getGooglePayButtonSrc, ue as linkedBankLabelFromMetadata, fe as loadPlaidScript, De as mountAmosApplePayButton, Te as mountAmosBankAccountPaymentMethodForm, we as mountAmosCreditCardPaymentMethodForm, Ee as mountAmosGooglePayButton, pe as openPlaidLink, le as plaidAccountIdFromMetadata, Y as requiresAchVerification, y as resetForm, L as resolveWalletButtonSkeletonBorderRadius, w as sendConfirmationResult, d as sendParentReadyMessage, h as updateAmount, f as updateAppearance, p as updateApplePayButton, m as updateGooglePayButton, g as updateMerchantName, _ as validateForm };