@canopypay/checkout-sdk 0.2.0 → 0.3.0

package/dist/canopy.global.js

@@ -1 +1 @@
-"use strict";(()=>{(function(){"use strict";if(typeof window=="undefined")return;let f="width=460,height=640",m=2500,y="Pay with Canopy",h=500,g="canopy",v="cnpy_pk_live_";function b(){let e=document.currentScript;if(e&&e.src)try{return new URL(e.src).origin}catch(o){}let n=document.getElementsByTagName("script");for(let o=0;o<n.length;o+=1){let r=n[o].src;if(r&&/\/v1\/(?:[^/]+\/)?canopy\.js(?:[?#].*)?$/.test(r))try{return new URL(r).origin}catch(t){}}return null}function k(e){let n;try{n=new URL(e)}catch(t){return{ok:!1,code:"canopy_origin_invalid"}}if(!((n.pathname===""||n.pathname==="/")&&n.search===""&&n.hash===""))return{ok:!1,code:"canopy_origin_not_bare"};let r=n.hostname==="localhost"||n.hostname==="127.0.0.1";return n.protocol!=="https:"&&!r?{ok:!1,code:"canopy_origin_insecure"}:{ok:!0,origin:n.origin}}function _(e){if(e!==void 0)return k(e);let n=b();return n?{ok:!0,origin:n}:{ok:!1,code:"canopy_origin_undiscoverable"}}function c(e){let n=new URL("/customer-pay",e.origin);return n.searchParams.set("merchant",e.merchant),n.hash="cap="+encodeURIComponent(e.capability||""),n.toString()}function i(e,n,o){if(!e.destroyed)try{e.onEvent(Object.assign({type:n},o))}catch(r){}}function l(e){e.handshakeTimer&&(clearTimeout(e.handshakeTimer),e.handshakeTimer=null),e.resizeObserver&&(e.resizeObserver.disconnect(),e.resizeObserver=null),e.frame&&(e.frame.parentNode&&e.frame.parentNode.removeChild(e.frame),e.frame=null),e.lastHeight=null}function E(e){e.popupPollTimer&&clearInterval(e.popupPollTimer),e.popupPollTimer=setInterval(function(){try{e.popupWin&&e.popupWin.closed&&(e.popupPollTimer&&clearInterval(e.popupPollTimer),e.popupPollTimer=null,e.popupWin=null,i(e,"close",{via:"popup"}))}catch(n){e.popupPollTimer&&clearInterval(e.popupPollTimer),e.popupPollTimer=null}},h)}function p(e,n){if(!e.destroyed){if(!n){i(e,"error",{code:"popup_blocked"});return}if(!e.capability){try{n.close()}catch(o){}i(e,"error",{code:"capability_unavailable"});return}try{n.location.href=c(e)}catch(o){i(e,"error",{code:"popup_navigation_failed"});return}e.popupWin=n,E(e)}}function T(e){let n=document.createElement("button");n.type="button",n.textContent=e.fallbackLabel;let o=n.style;o.background="#1A7A4C",o.color="#FFFFFF",o.border="none",o.borderRadius="8px",o.height="48px",o.padding="0 20px",o.fontSize="16px",o.fontFamily="inherit",o.cursor="pointer",o.maxWidth="100%",o.overflow="hidden",o.textOverflow="ellipsis",o.whiteSpace="nowrap",o.display="inline-block",n.addEventListener("click",function(){let r=window.open("","canopy_checkout",f);p(e,r)}),e.node.appendChild(n),e.fallbackButton=n,i(e,"fallback_offered",{surface:"popup",reason:"iframe_unavailable"})}function w(e){let n=document.createElement("iframe");n.src=c(e),n.style.width="100%",n.style.border="none",e.node.appendChild(n),e.frame=n,typeof ResizeObserver!="undefined"&&(e.resizeObserver=new ResizeObserver(function(o){for(let r=0;r<o.length;r+=1){let t=Math.round(o[r].contentRect.height);t>0&&t!==e.lastHeight&&(e.lastHeight=t,i(e,"resize",{height:t}))}}),e.resizeObserver.observe(n)),e.handshakeTimer=setTimeout(function(){e.handshakeTimer=null,i(e,"surface_unavailable",{attempted:"iframe"}),l(e),e.surface==="auto"?T(e):i(e,"error",{code:"iframe_blocked"})},e.handshakeTimeoutMs)}function O(e,n){if(n.origin!==e.origin)return;let o=n.data;if(!(!o||o.source!==g)){if(o.type==="ready"){e.handshakeTimer&&(clearTimeout(e.handshakeTimer),e.handshakeTimer=null),i(e,"ready");return}if(o.type==="resize"&&typeof o.height=="number"&&e.frame){e.frame.style.height=o.height+"px";return}if(o.type==="paid"){i(e,"paid",o);return}if(o.type==="close"){i(e,"close");return}}}let s=new WeakMap;function L(e){if(typeof e.merchant!="string"||e.merchant.indexOf(v)!==0){try{(e.onEvent||function(){})({type:"error",code:"invalid_merchant_key"})}catch(a){}return{openNow:function(){},destroy:function(){}}}let n=_(e.canopyOrigin);if(!n.ok){try{(e.onEvent||function(){})({type:"error",code:n.code})}catch(a){}return{openNow:function(){},destroy:function(){}}}let o=typeof e.target=="string"?document.querySelector(e.target):e.target;if(!o)return{openNow:function(){},destroy:function(){}};let r=s.get(o);if(r)return r;let t={node:o,capability:e.capability,merchant:e.merchant,origin:n.origin,surface:e.surface||"popup",handshakeTimeoutMs:e.handshakeTimeoutMs||m,fallbackLabel:e.fallbackLabel||y,onEvent:e.onEvent||function(){},destroyed:!1,messageListener:function(){},handshakeTimer:null,resizeObserver:null,frame:null,fallbackButton:null,lastHeight:null,popupWin:null,popupPollTimer:null};t.messageListener=function(a){O(t,a)},window.addEventListener("message",t.messageListener),(t.surface==="iframe"||t.surface==="auto")&&w(t);let d={openNow:function(a){p(t,a)},destroy:function(){t.destroyed||(t.destroyed=!0,window.removeEventListener("message",t.messageListener),l(t),t.popupPollTimer&&(clearInterval(t.popupPollTimer),t.popupPollTimer=null),t.fallbackButton&&(t.fallbackButton.parentNode&&t.fallbackButton.parentNode.removeChild(t.fallbackButton),t.fallbackButton=null),s.delete(o))}};return s.set(o,d),d}let u=window;u.Canopy&&u.Canopy.__version==="2"||(u.Canopy={mount:L,__version:"2"})})();})();
+"use strict";(()=>{(function(){"use strict";if(typeof window=="undefined")return;let f="width=460,height=640",y=2500,m="Pay with Canopy",h=500,g=420,v="canopy",b="cnpy_pk_live_";function k(){let e=document.currentScript;if(e&&e.src)try{return new URL(e.src).origin}catch(o){}let n=document.getElementsByTagName("script");for(let o=0;o<n.length;o+=1){let r=n[o].src;if(r&&/\/v1\/(?:[^/]+\/)?canopy\.js(?:[?#].*)?$/.test(r))try{return new URL(r).origin}catch(t){}}return null}function _(e){let n;try{n=new URL(e)}catch(t){return{ok:!1,code:"canopy_origin_invalid"}}if(!((n.pathname===""||n.pathname==="/")&&n.search===""&&n.hash===""))return{ok:!1,code:"canopy_origin_not_bare"};let r=n.hostname==="localhost"||n.hostname==="127.0.0.1";return n.protocol!=="https:"&&!r?{ok:!1,code:"canopy_origin_insecure"}:{ok:!0,origin:n.origin}}function E(e){if(e!==void 0)return _(e);let n=k();return n?{ok:!0,origin:n}:{ok:!1,code:"canopy_origin_undiscoverable"}}function c(e){let n=new URL("/customer-pay",e.origin);return n.searchParams.set("merchant",e.merchant),n.hash="cap="+encodeURIComponent(e.capability||""),n.toString()}function i(e,n,o){if(!e.destroyed)try{e.onEvent(Object.assign({type:n},o))}catch(r){}}function l(e){e.handshakeTimer&&(clearTimeout(e.handshakeTimer),e.handshakeTimer=null),e.resizeObserver&&(e.resizeObserver.disconnect(),e.resizeObserver=null),e.frame&&(e.frame.parentNode&&e.frame.parentNode.removeChild(e.frame),e.frame=null),e.lastHeight=null}function T(e){e.popupPollTimer&&clearInterval(e.popupPollTimer),e.popupPollTimer=setInterval(function(){try{e.popupWin&&e.popupWin.closed&&(e.popupPollTimer&&clearInterval(e.popupPollTimer),e.popupPollTimer=null,e.popupWin=null,i(e,"close",{via:"popup"}))}catch(n){e.popupPollTimer&&clearInterval(e.popupPollTimer),e.popupPollTimer=null}},h)}function p(e,n){if(!e.destroyed){if(!n){i(e,"error",{code:"popup_blocked"});return}if(!e.capability){try{n.close()}catch(o){}i(e,"error",{code:"capability_unavailable"});return}try{n.location.href=c(e)}catch(o){i(e,"error",{code:"popup_navigation_failed"});return}e.popupWin=n,T(e)}}function w(e){let n=document.createElement("button");n.type="button",n.textContent=e.fallbackLabel;let o=n.style;o.background="#1A7A4C",o.color="#FFFFFF",o.border="none",o.borderRadius="8px",o.height="48px",o.padding="0 20px",o.fontSize="16px",o.fontFamily="inherit",o.cursor="pointer",o.maxWidth="100%",o.overflow="hidden",o.textOverflow="ellipsis",o.whiteSpace="nowrap",o.display="inline-block",n.addEventListener("click",function(){let r=window.open("","canopy_checkout",f);p(e,r)}),e.node.appendChild(n),e.fallbackButton=n,i(e,"fallback_offered",{surface:"popup",reason:"iframe_unavailable"})}function O(e){let n=document.createElement("iframe");n.src=c(e),n.style.width="100%",n.style.border="none",n.setAttribute("allow","clipboard-write"),n.setAttribute("title","Canopy checkout"),n.style.height=g+"px",e.node.appendChild(n),e.frame=n,typeof ResizeObserver!="undefined"&&(e.resizeObserver=new ResizeObserver(function(o){for(let r=0;r<o.length;r+=1){let t=Math.round(o[r].contentRect.height);t>0&&t!==e.lastHeight&&(e.lastHeight=t,i(e,"resize",{height:t}))}}),e.resizeObserver.observe(n)),e.handshakeTimer=setTimeout(function(){e.handshakeTimer=null,i(e,"surface_unavailable",{attempted:"iframe"}),l(e),e.surface==="auto"?w(e):i(e,"error",{code:"iframe_blocked"})},e.handshakeTimeoutMs)}function L(e,n){if(n.origin!==e.origin)return;let o=n.data;if(!(!o||o.source!==v)){if(o.type==="ready"){e.handshakeTimer&&(clearTimeout(e.handshakeTimer),e.handshakeTimer=null),i(e,"ready");return}if(o.type==="resize"&&typeof o.height=="number"&&e.frame){e.frame.style.height=o.height+"px";return}if(o.type==="paid"){i(e,"paid",o);return}if(o.type==="close"){i(e,"close");return}}}let s=new WeakMap;function R(e){if(typeof e.merchant!="string"||e.merchant.indexOf(b)!==0){try{(e.onEvent||function(){})({type:"error",code:"invalid_merchant_key"})}catch(a){}return{openNow:function(){},destroy:function(){}}}let n=E(e.canopyOrigin);if(!n.ok){try{(e.onEvent||function(){})({type:"error",code:n.code})}catch(a){}return{openNow:function(){},destroy:function(){}}}let o=typeof e.target=="string"?document.querySelector(e.target):e.target;if(!o)return{openNow:function(){},destroy:function(){}};let r=s.get(o);if(r)return r;let t={node:o,capability:e.capability,merchant:e.merchant,origin:n.origin,surface:e.surface||"popup",handshakeTimeoutMs:e.handshakeTimeoutMs||y,fallbackLabel:e.fallbackLabel||m,onEvent:e.onEvent||function(){},destroyed:!1,messageListener:function(){},handshakeTimer:null,resizeObserver:null,frame:null,fallbackButton:null,lastHeight:null,popupWin:null,popupPollTimer:null};t.messageListener=function(a){L(t,a)},window.addEventListener("message",t.messageListener),(t.surface==="iframe"||t.surface==="auto")&&O(t);let d={openNow:function(a){p(t,a)},destroy:function(){t.destroyed||(t.destroyed=!0,window.removeEventListener("message",t.messageListener),l(t),t.popupPollTimer&&(clearInterval(t.popupPollTimer),t.popupPollTimer=null),t.fallbackButton&&(t.fallbackButton.parentNode&&t.fallbackButton.parentNode.removeChild(t.fallbackButton),t.fallbackButton=null),s.delete(o))}};return s.set(o,d),d}let u=window;u.Canopy&&u.Canopy.__version==="3"||(u.Canopy={mount:R,__version:"3"})})();})();

package/dist/index.cjs

@@ -26,7 +26,7 @@ __export(src_exports, {
 module.exports = __toCommonJS(src_exports);
 
 // src/loader.ts
-var LOADER_VERSION = "2";
+var LOADER_VERSION = "3";
 (function() {
   "use strict";
   if (typeof window === "undefined") return;
@@ -34,6 +34,7 @@ var LOADER_VERSION = "2";
   const DEFAULT_HANDSHAKE_TIMEOUT_MS = 2500;
   const DEFAULT_FALLBACK_LABEL = "Pay with Canopy";
   const POPUP_POLL_INTERVAL_MS = 500;
+  const INITIAL_FRAME_HEIGHT_PX = 420;
   const MESSAGE_SOURCE = "canopy";
   const PUBLISHABLE_KEY_PREFIX = "cnpy_pk_live_";
   function resolveOrigin() {
@@ -186,6 +187,9 @@ var LOADER_VERSION = "2";
     iframe.src = buildCheckoutUrl(internal);
     iframe.style.width = "100%";
     iframe.style.border = "none";
+    iframe.setAttribute("allow", "clipboard-write");
+    iframe.setAttribute("title", "Canopy checkout");
+    iframe.style.height = INITIAL_FRAME_HEIGHT_PX + "px";
     internal.node.appendChild(iframe);
     internal.frame = iframe;
     if (typeof ResizeObserver !== "undefined") {

package/dist/index.d.cts

@@ -1,7 +1,7 @@
 /**
- * Canopy checkout SDK loader (Phase 23 Plan 08, SDK-01 / SDK-04 / API-03).
+ * Canopy checkout SDK loader.
  *
- * The whole merchant integration, measured (`sdk-loader-contract.md`):
+ * The whole merchant integration:
  *
  * ```html
  * <script src="https://canopy.example/v1/canopy.js"></script>
@@ -13,7 +13,7 @@
  *   capability,
  *   merchant: "cnpy_pk_live_abc123",
  *   onEvent: (e) => {
- *     // SDK-04: `paid` is advisory only -- it drives UI, never fulfilment.
+ *     // `paid` is advisory only -- it drives UI, never fulfilment.
  *     // Fulfilment reads a webhook or a server-side status call.
  *     if (e.type === "paid") showBanner("Payment sent — we'll confirm shortly");
  *   },
@@ -29,25 +29,16 @@
  *
  * One entry point (`mount`), one option surface (`surface: "popup" | "iframe"
  * | "auto"`, default `"popup"`), seven events (`ready`, `resize`, `paid`,
- * `error`, `close`, `surface_unavailable`, `fallback_offered`). See
- * `.claude/skills/spike-findings-Canopy/references/sdk-loader-contract.md`
- * and `.claude/skills/spike-findings-Canopy/references/embed-surface-selection.md`
- * for the full contract this file implements.
- *
- * Bump LOADER_VERSION whenever this file's runtime behaviour changes.
- * `scripts/build-checkout-sdk.ts` extracts this exact literal by regex from
- * this source file (not the built bundle) so the immutable serving path
- * (`/v1/{version}/canopy.js`) and this loader's own `Canopy.__version`
- * self-report are always the same value by construction.
+ * `error`, `close`, `surface_unavailable`, `fallback_offered`).
+ */
+/**
+ * `close` is POPUP-ONLY. It reports that the payer closed the checkout
+ * window, which the loader detects by polling `popupWin.closed`. An inline
+ * (`surface: "iframe"`) embed has nothing to close -- the merchant owns the
+ * container and removes it themselves -- so no `close` is ever emitted
+ * there, and none is synthesised to make the two surfaces look alike.
  *
- * Phase 31 Plan 02 (DIST-01, DIST-04): the five types below are hoisted
- * above the IIFE and `export type`-ed so `packages/checkout-sdk/src/index.ts`
- * (the npm entry) can re-export a real merchant-facing surface instead of
- * shipping a 13-byte `export { }` declaration file. This is byte-safe --
- * type-only exports are erased before esbuild picks its format wrapper, so
- * the IIFE build this script tag serves is unaffected (verified sha
- * `644fbe336e875f4f` both ways, spike 100 exp2/exp3). `Internal` stays
- * inside the IIFE: it is not part of the merchant-facing surface.
+ * Every other event reaches both surfaces.
  */
 type CanopyEventType = "ready" | "resize" | "paid" | "error" | "close" | "surface_unavailable" | "fallback_offered";
 type CanopyEvent = {
@@ -64,14 +55,14 @@ type MountOptions = {
     handshakeTimeoutMs?: number;
     fallbackLabel?: string;
     /**
-     * Phase 31 Plan 05 (DIST-02): the Canopy origin `mount()` builds the
-     * checkout URL against and pins the `postMessage` listener to. A
+     * The Canopy origin `mount()` builds the checkout URL against and pins
+     * the `postMessage` listener to. A
      * `<script src="https://.../v1/canopy.js">` tag can be discovered
      * automatically; a bundled npm consumer has no such tag, so it MUST state
      * this explicitly or `mount()` refuses with `canopy_origin_undiscoverable`.
      * There is no default -- baking one in would turn that loud, diagnosable
      * refusal into a silent wrong-origin checkout for every sandbox or
-     * self-hosted integration (31-RESEARCH.md Pitfall 5). Must be a bare
+     * self-hosted integration. Must be a bare
      * origin (no path, search, or hash) and `https`, except for the
      * `localhost` / `127.0.0.1` development affordance. Wins over a present
      * script tag when both are available.
@@ -83,18 +74,7 @@ type CanopyHandle = {
     destroy: () => void;
 };
 
-/**
- * Canopy checkout SDK npm entry (Phase 31 Plan 02, DIST-01 / DIST-04).
- *
- * This is the `npm i @canopypay/checkout-sdk` consumer surface -- it delegates
- * to `./loader`'s IIFE (imported here for its side effect of installing
- * `window.Canopy`) rather than re-implementing `mount()`. A second
- * implementation of the security-relevant origin pinning and the
- * publishable-key prefix check would fork exactly the mechanism DIST-01
- * exists to keep singular. See
- * `.claude/skills/spike-findings-Canopy/references/sdk-package-distribution.md`
- * § "How to Build It" step 2 for the verified shape this file follows.
- */
+/** Canopy checkout SDK -- the `npm i @canopypay/checkout-sdk` entry point. */
 
 declare global {
     interface Window {

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 /**
- * Canopy checkout SDK loader (Phase 23 Plan 08, SDK-01 / SDK-04 / API-03).
+ * Canopy checkout SDK loader.
  *
- * The whole merchant integration, measured (`sdk-loader-contract.md`):
+ * The whole merchant integration:
  *
  * ```html
  * <script src="https://canopy.example/v1/canopy.js"></script>
@@ -13,7 +13,7 @@
  *   capability,
  *   merchant: "cnpy_pk_live_abc123",
  *   onEvent: (e) => {
- *     // SDK-04: `paid` is advisory only -- it drives UI, never fulfilment.
+ *     // `paid` is advisory only -- it drives UI, never fulfilment.
  *     // Fulfilment reads a webhook or a server-side status call.
  *     if (e.type === "paid") showBanner("Payment sent — we'll confirm shortly");
  *   },
@@ -29,25 +29,16 @@
  *
  * One entry point (`mount`), one option surface (`surface: "popup" | "iframe"
  * | "auto"`, default `"popup"`), seven events (`ready`, `resize`, `paid`,
- * `error`, `close`, `surface_unavailable`, `fallback_offered`). See
- * `.claude/skills/spike-findings-Canopy/references/sdk-loader-contract.md`
- * and `.claude/skills/spike-findings-Canopy/references/embed-surface-selection.md`
- * for the full contract this file implements.
- *
- * Bump LOADER_VERSION whenever this file's runtime behaviour changes.
- * `scripts/build-checkout-sdk.ts` extracts this exact literal by regex from
- * this source file (not the built bundle) so the immutable serving path
- * (`/v1/{version}/canopy.js`) and this loader's own `Canopy.__version`
- * self-report are always the same value by construction.
+ * `error`, `close`, `surface_unavailable`, `fallback_offered`).
+ */
+/**
+ * `close` is POPUP-ONLY. It reports that the payer closed the checkout
+ * window, which the loader detects by polling `popupWin.closed`. An inline
+ * (`surface: "iframe"`) embed has nothing to close -- the merchant owns the
+ * container and removes it themselves -- so no `close` is ever emitted
+ * there, and none is synthesised to make the two surfaces look alike.
  *
- * Phase 31 Plan 02 (DIST-01, DIST-04): the five types below are hoisted
- * above the IIFE and `export type`-ed so `packages/checkout-sdk/src/index.ts`
- * (the npm entry) can re-export a real merchant-facing surface instead of
- * shipping a 13-byte `export { }` declaration file. This is byte-safe --
- * type-only exports are erased before esbuild picks its format wrapper, so
- * the IIFE build this script tag serves is unaffected (verified sha
- * `644fbe336e875f4f` both ways, spike 100 exp2/exp3). `Internal` stays
- * inside the IIFE: it is not part of the merchant-facing surface.
+ * Every other event reaches both surfaces.
  */
 type CanopyEventType = "ready" | "resize" | "paid" | "error" | "close" | "surface_unavailable" | "fallback_offered";
 type CanopyEvent = {
@@ -64,14 +55,14 @@ type MountOptions = {
     handshakeTimeoutMs?: number;
     fallbackLabel?: string;
     /**
-     * Phase 31 Plan 05 (DIST-02): the Canopy origin `mount()` builds the
-     * checkout URL against and pins the `postMessage` listener to. A
+     * The Canopy origin `mount()` builds the checkout URL against and pins
+     * the `postMessage` listener to. A
      * `<script src="https://.../v1/canopy.js">` tag can be discovered
      * automatically; a bundled npm consumer has no such tag, so it MUST state
      * this explicitly or `mount()` refuses with `canopy_origin_undiscoverable`.
      * There is no default -- baking one in would turn that loud, diagnosable
      * refusal into a silent wrong-origin checkout for every sandbox or
-     * self-hosted integration (31-RESEARCH.md Pitfall 5). Must be a bare
+     * self-hosted integration. Must be a bare
      * origin (no path, search, or hash) and `https`, except for the
      * `localhost` / `127.0.0.1` development affordance. Wins over a present
      * script tag when both are available.
@@ -83,18 +74,7 @@ type CanopyHandle = {
     destroy: () => void;
 };
 
-/**
- * Canopy checkout SDK npm entry (Phase 31 Plan 02, DIST-01 / DIST-04).
- *
- * This is the `npm i @canopypay/checkout-sdk` consumer surface -- it delegates
- * to `./loader`'s IIFE (imported here for its side effect of installing
- * `window.Canopy`) rather than re-implementing `mount()`. A second
- * implementation of the security-relevant origin pinning and the
- * publishable-key prefix check would fork exactly the mechanism DIST-01
- * exists to keep singular. See
- * `.claude/skills/spike-findings-Canopy/references/sdk-package-distribution.md`
- * § "How to Build It" step 2 for the verified shape this file follows.
- */
+/** Canopy checkout SDK -- the `npm i @canopypay/checkout-sdk` entry point. */
 
 declare global {
     interface Window {

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/loader.ts
-var LOADER_VERSION = "2";
+var LOADER_VERSION = "3";
 (function() {
   "use strict";
   if (typeof window === "undefined") return;
@@ -7,6 +7,7 @@ var LOADER_VERSION = "2";
   const DEFAULT_HANDSHAKE_TIMEOUT_MS = 2500;
   const DEFAULT_FALLBACK_LABEL = "Pay with Canopy";
   const POPUP_POLL_INTERVAL_MS = 500;
+  const INITIAL_FRAME_HEIGHT_PX = 420;
   const MESSAGE_SOURCE = "canopy";
   const PUBLISHABLE_KEY_PREFIX = "cnpy_pk_live_";
   function resolveOrigin() {
@@ -159,6 +160,9 @@ var LOADER_VERSION = "2";
     iframe.src = buildCheckoutUrl(internal);
     iframe.style.width = "100%";
     iframe.style.border = "none";
+    iframe.setAttribute("allow", "clipboard-write");
+    iframe.setAttribute("title", "Canopy checkout");
+    iframe.style.height = INITIAL_FRAME_HEIGHT_PX + "px";
     internal.node.appendChild(iframe);
     internal.frame = iframe;
     if (typeof ResizeObserver !== "undefined") {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@canopypay/checkout-sdk",
   "private": false,
-  "version": "0.2.0",
+  "version": "0.3.0",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -26,10 +26,11 @@
   ],
   "scripts": {
     "build": "tsup --config tsup.config.ts",
-    "build:npm": "tsup --config tsup.npm.config.ts"
+    "build:npm": "tsup --config tsup.npm.config.ts",
+    "prepublishOnly": "npm --prefix ../.. run sdk:build && npm run build:npm"
   },
   "canopy": {
-    "loaderVersion": "2",
+    "loaderVersion": "3",
     "apiVersion": "2026-09-01"
   },
   "publishConfig": {