@growth-operations/ui-shared 1.5.3 → 1.5.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@growth-operations/ui-shared",
-  "version": "1.5.3",
+  "version": "1.5.4",
   "description": "Shared HubSpot UI-extension modules (Home, Billing) for Growth Operations apps.",
   "license": "MIT",
   "private": false,

package/src/billing/PlanGrid.jsx

@@ -163,12 +163,17 @@ export function PlanGrid({ context, state, appKey }) {
 
       // hubspot.fetch: body is a plain OBJECT (not a JSON string); only
       // Authorization survives as a header — don't set Content-Type.
+      // presentation:"hosted" — a UI extension runs in a sandboxed iframe and
+      // can't mount Stripe's EMBEDDED checkout (no Stripe.js, nested-iframe 3DS
+      // fails), so request the HOSTED page and open its URL externally. The
+      // embedded default returns a client_secret (no url) → "No checkout URL".
       const res = await hubspot.fetch(`${base}/v1/billing/checkout`, {
         method: "POST",
         body: {
           app_key: appKey,
           portal_id: String(portalId),
           price_id: leg.price_id,
+          presentation: "hosted",
           return_url: returnUrl,
         },
       });