@canopypay/checkout-sdk 0.2.1 → 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

@@ -31,6 +31,15 @@
  * | "auto"`, default `"popup"`), seven events (`ready`, `resize`, `paid`,
  * `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.
+ *
+ * Every other event reaches both surfaces.
+ */
 type CanopyEventType = "ready" | "resize" | "paid" | "error" | "close" | "surface_unavailable" | "fallback_offered";
 type CanopyEvent = {
     type: CanopyEventType;

package/dist/index.d.ts

@@ -31,6 +31,15 @@
  * | "auto"`, default `"popup"`), seven events (`ready`, `resize`, `paid`,
  * `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.
+ *
+ * Every other event reaches both surfaces.
+ */
 type CanopyEventType = "ready" | "resize" | "paid" | "error" | "close" | "surface_unavailable" | "fallback_offered";
 type CanopyEvent = {
     type: CanopyEventType;

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.1",
+  "version": "0.3.0",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -30,7 +30,7 @@
     "prepublishOnly": "npm --prefix ../.. run sdk:build && npm run build:npm"
   },
   "canopy": {
-    "loaderVersion": "2",
+    "loaderVersion": "3",
     "apiVersion": "2026-09-01"
   },
   "publishConfig": {