@flopay/react 1.9.11 → 1.9.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flopay/react",
-  "version": "1.9.11",
+  "version": "1.9.14",
   "type": "module",
   "sideEffects": false,
   "publishConfig": {
@@ -34,8 +34,8 @@
     "@paypal/paypal-js": "^10.0.0",
     "@stripe/react-stripe-js": "^6.6.0",
     "@stripe/stripe-js": "^9.8.0",
-    "@flopay/js": "1.9.11",
-    "@flopay/shared": "1.9.11"
+    "@flopay/js": "1.9.14",
+    "@flopay/shared": "1.9.14"
   },
   "peerDependencies": {
     "react": ">=18.0.0",

package/dist/chunk-M4FGYFX6.mjs

@@ -1,6 +0,0 @@
-import{useEffect as ie,useRef as T}from"react";function ne(e,r){if(!e)return r;let t=r??{},n=Object.keys(t),o=n.some(i=>i.startsWith("background")),a={};for(let[i,u]of Object.entries(e))i in t||o&&i.startsWith("background")||(a[i]=u);for(let i of n)a[i]=t[i];return a}var Re=new Set(["animationIterationCount","aspectRatio","borderImageOutset","borderImageSlice","borderImageWidth","boxFlex","boxFlexGroup","boxOrdinalGroup","columnCount","columns","flex","flexGrow","flexPositive","flexShrink","flexNegative","flexOrder","gridArea","gridRow","gridRowEnd","gridRowSpan","gridRowStart","gridColumn","gridColumnEnd","gridColumnSpan","gridColumnStart","fontWeight","lineClamp","lineHeight","opacity","order","orphans","scale","tabSize","widows","zIndex","zoom","fillOpacity","floodOpacity","stopOpacity","strokeDasharray","strokeDashoffset","strokeMiterlimit","strokeOpacity","strokeWidth"]);function ve(e){let r=e.replace(/^(Webkit|Moz|ms)(?=[A-Z])/,"");return Re.has(r.charAt(0).toLowerCase()+r.slice(1))}function Fe(e,r){return typeof r=="number"&&r!==0&&!ve(e)?`${r}px`:String(r).trim()}function oe(e,r){if(e.style.cssText="",!!r){for(let[t,n]of Object.entries(r))if(!(n==null||n==="")){if(t.startsWith("--")){e.style.setProperty(t,String(n));continue}e.style[t]=Fe(t,n)}}}import{useEffect as Ee,useLayoutEffect as Te}from"react";var ae=typeof window>"u"?Ee:Te;import{jsx as Pe}from"react/jsx-runtime";function se({capture:e,html:r,messageToken:t,expectedOrigin:n,theme:o,containerStyle:a,onReady:i,onError:u,onValidation:s}){let l=T(null),c=T(i),f=T(u),b=T(s);c.current=i,f.current=u,b.current=s;let p=T(o);p.current=o;let F=T(null);return ie(()=>{let C=l.current;if(!C)return;let E=!0,A=!1,L=()=>{!E||A||(A=!0,c.current?.())},D=e.on("ready",()=>{L()}),S=e.on("error",m=>{f.current?.(m.message??"There was a problem loading the secure card form.")}),G=e.on("validation",m=>{b.current?.(m.message??null)}),B={html:r,...t?{messageToken:t}:{},...n?{expectedOrigin:n}:{},...p.current?{theme:p.current}:{}};return F.current=p.current??null,e.mount(C,B).then(()=>{L()}).catch(m=>{E&&f.current?.(m instanceof Error?m.message:"Failed to load the secure card form.")}),()=>{E=!1,D(),S(),G(),e.unmount()}},[e,r,t,n]),ae(()=>{let C=l.current;C&&oe(C,a)},[a]),ie(()=>{o!==void 0&&(o===null&&F.current===null||(F.current=o,e.applyTheme?.(o)))},[e,o]),Pe("div",{ref:l,"data-testid":"flopay-vault-card-fields"})}import{PaymentAPI as qe,PciVaultCardCapture as Ke}from"@flopay/js/card-setup";import{FloPayError as V,isCardSetupCheckoutSession as Ze,resolveBillingApiUrl as Je,resolveTheme as Qe}from"@flopay/shared";import{useEffect as q,useMemo as W,useRef as h,useState as N}from"react";var ue={light:{success:"#166534",error:"#991B1B"},dark:{success:"#4ADE80",error:"#FCA5A5"}};function le(e){let r=e.appearance.variables??{},t=e.buttonsLayout.cardFormContainer??{},n=e.appearance.theme==="night",o=n?ue.dark:ue.light,a=r.colorText??(n?"#F1F5F9":"#262833"),i=e.appearance.rules?.[".Label"];return{panel:{...t.background===void 0?{}:{background:t.background},...t.backgroundColor===void 0?{}:{backgroundColor:t.backgroundColor},...t.border===void 0?{}:{border:t.border},...t.borderRadius===void 0?{}:{borderRadius:t.borderRadius},...t.boxShadow===void 0?{}:{boxShadow:t.boxShadow},color:a,...r.fontFamily?{fontFamily:r.fontFamily}:{}},spinnerTrackColor:e.buttonsLayout.cardInputBorder??(n?"#374151":"#e5e7eb"),spinnerAccentColor:r.colorPrimary??"#4A49FF",labelColors:{processing:a,success:o.success,error:o.error},noteColor:i?.color??a}}function x(e){if(!e)return;let r=t=>{console.error("[FloPay] Merchant callback failed; checkout continued.",t)};try{Promise.resolve(e()).catch(r)}catch(t){r(t)}}import{jsx as y,jsxs as P}from"react/jsx-runtime";var Ve={panel:{background:"white"},spinnerTrackColor:"#e5e7eb",spinnerAccentColor:"#4A49FF",labelColors:{processing:"#374151",success:"#16a34a",error:"#dc2626"},noteColor:"#6b7280"};function ce({status:e,errorMessage:r,authorized:t=!1,processingLabel:n="PROCESSING...",successLabel:o,errorLabel:a="PAYMENT FAILED",successNote:i="You will be automatically redirected, do not close or navigate away from this window.",theme:u=Ve}){let s={fontSize:13,color:u.noteColor,fontWeight:400,maxWidth:260,lineHeight:1.4,margin:0};return y("div",{"data-testid":"flopay-processing-overlay","data-status":e,role:"dialog","aria-modal":"true",style:{position:"fixed",inset:0,background:"rgba(0,0,0,0.35)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3,backdropFilter:"blur(2px)"},children:P("div",{"data-testid":"flopay-processing-overlay-panel",style:{borderRadius:12,boxShadow:"0 8px 32px rgba(0,0,0,0.18)",...u.panel,padding:"2rem 2.5rem",textAlign:"center",minWidth:240,display:"flex",flexDirection:"column",alignItems:"center",gap:16},children:[P("div",{style:{width:48,height:48,position:"relative"},children:[e==="processing"&&P("svg",{"aria-hidden":"true",width:"48",height:"48",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{animation:"flopay-spin 0.8s linear infinite"},children:[y("circle",{cx:"12",cy:"12",r:"10",stroke:u.spinnerTrackColor,strokeWidth:"3"}),y("path",{d:"M4 12a8 8 0 018-8v3a5 5 0 00-5 5H4z",fill:u.spinnerAccentColor})]}),e==="success"&&y("div",{style:{animation:"flopay-pop 0.4s cubic-bezier(0.34,1.56,0.64,1)"},children:P("svg",{"aria-hidden":"true",width:"48",height:"48",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[y("circle",{cx:"12",cy:"12",r:"11",fill:"#22c55e"}),y("path",{d:"M7 12.5l3 3 7-7",stroke:"white",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",style:{strokeDasharray:20,strokeDashoffset:20,animation:"flopay-draw 0.4s 0.15s ease forwards"}})]})}),e==="error"&&y("div",{style:{animation:"flopay-shake 0.4s ease"},children:P("svg",{"aria-hidden":"true",width:"48",height:"48",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[y("circle",{cx:"12",cy:"12",r:"11",fill:"#ef4444"}),y("path",{d:"M8 8l8 8M16 8l-8 8",stroke:"white",strokeWidth:"2.5",strokeLinecap:"round",style:{strokeDasharray:12,strokeDashoffset:12,animation:"flopay-draw 0.3s 0.1s ease forwards"}})]})})]}),P("span",{style:{fontSize:14,fontWeight:600,letterSpacing:"0.05em",color:u.labelColors[e]},children:[e==="processing"&&n,e==="success"&&(o??(t?"PAYMENT AUTHORISED":"PAYMENT SUCCESSFUL")),e==="error"&&a]}),e==="success"&&i!==null&&y("p",{style:s,children:i}),e==="error"&&r&&y("p",{style:s,children:r}),y("style",{children:`
-          @keyframes flopay-spin { to { transform: rotate(360deg); } }
-          @keyframes flopay-pop { 0% { transform: scale(0); } 100% { transform: scale(1); } }
-          @keyframes flopay-draw { to { stroke-dashoffset: 0; } }
-          @keyframes flopay-shake { 0%,100% { transform: translateX(0); } 20%,60% { transform: translateX(-4px); } 40%,80% { transform: translateX(4px); } }
-        `})]})})}var fe=/^#([0-9a-f]{6})$/i,Ae=/^#([0-9a-f]{3})$/i,pe=/^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/i,me=/^rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(0|1|0?\.\d+|1\.0+)\s*\)$/i,Le=/^linear-gradient\(\s*(-?\d+(?:\.\d+)?)deg\s*,\s*(.+)\)$/i,Be=/^(-?\d+(?:\.\d+)?)(?:px)?$/,Oe=/^(-?\d+(?:\.\d+)?)em$/,Ie=/^blur\(\s*(\d+(?:\.\d+)?)(?:px)?\s*\)$/i,Me=/^[a-z][a-z0-9 -]{0,31}$/i,_e=new Set(["none","uppercase","lowercase","capitalize"]);function ge(e){if(typeof e!="string")return null;let r=e.trim(),t=fe.exec(r);if(t){let c=Number.parseInt(t[1],16);return{r:c>>16&255,g:c>>8&255,b:c&255,a:null}}let n=Ae.exec(r);if(n){let[c,f,b]=n[1].split("").map(p=>Number.parseInt(p+p,16));return{r:c,g:f,b,a:null}}let o=pe.exec(r),a=o?null:me.exec(r),i=o??a;if(!i)return null;let u=Number(i[1]),s=Number(i[2]),l=Number(i[3]);return u>255||s>255||l>255?null:{r:u,g:s,b:l,a:a?Number(a[4]):null}}function ye({r:e,g:r,b:t,a:n}){return n===null?`#${(1<<24|e<<16|r<<8|t).toString(16).slice(1)}`:`rgba(${e},${r},${t},${n})`}function M(e){if(typeof e!="string")return;let r=e.trim();if(fe.test(r)||pe.test(r))return r;let t=me.exec(r);if(t&&/^\d/.test(t[4]))return r;let n=ge(r);return n?ye(n):void 0}function z(e,r=.12){let t=ge(e);if(!t)return e;let n=Math.max(0,Math.min(1,1-r));return ye({r:Math.round(t.r*n),g:Math.round(t.g*n),b:Math.round(t.b*n),a:t.a})}function _(e,r){let t=[],n=0,o="";for(let a of e){if(a==="("&&(n+=1),a===")"&&(n-=1),a===r&&n===0){o.trim()&&t.push(o.trim()),o="";continue}o+=a}return o.trim()&&t.push(o.trim()),t}function v(e,r,t){if(typeof e!="number"&&typeof e!="string")return;let n=Be.exec(String(e).trim());if(!n)return;let o=Number(n[1]);return Number.isFinite(o)&&o>=r&&o<=t?o:void 0}function Ne(e,r,t){if(typeof e!="string")return;let n=Oe.exec(e.trim());if(!n)return;let o=Number(n[1]);return Number.isFinite(o)&&o>=r&&o<=t?o:void 0}function De(e){let r=_(e,",");if(r.length<2||r.length>5)return;let t=[];for(let[n,o]of r.entries()){let a=_(o," "),i=M(a[0]);if(!i)return;let u=n/(r.length-1)*100,s=a[1]===void 0?u:Number(/^(\d+(?:\.\d+)?)%$/.exec(a[1])?.[1]),l=t[t.length-1]?.position??-1;if(!Number.isFinite(s)||s<0||s>100||s<l)return;t.push({color:i,position:s})}return{type:"linearGradient",angle:0,stops:t}}function ze(e){if(typeof e!="string")return;let r=e.trim(),t=M(r);if(t)return{type:"solid",color:t};let n=Le.exec(r);if(!n)return;let o=Number(n[1]);if(!Number.isFinite(o)||o<0||o>360)return;let a=De(n[2]);return a&&a.type==="linearGradient"?{...a,angle:o}:void 0}function We(e){return e.type==="solid"?{type:"solid",color:z(e.color)}:{...e,stops:e.stops.map(r=>({...r,color:z(r.color)}))}}function $e(e){let r=!1,t,n=[];for(let s of _(e," ")){if(s.toLowerCase()==="inset"){r=!0;continue}let l=M(s);if(l){t=l;continue}let c=v(s,-128,128);if(c===void 0)return;n.push(c)}if(!t||n.length<2||n.length>4)return;let[o,a,i=0,u=0]=n;if(!(Math.abs(o)>64||Math.abs(a)>64||i>128||Math.abs(u)>32))return{color:t,inset:r,offsetX:o,offsetY:a,blur:i,spread:u}}function Ge(e){if(typeof e!="string")return;let r=e.trim();if(r.toLowerCase()==="none")return[];let t=_(r,",").map($e);if(!(t.length===0||t.length>4))return t.every(n=>n!==void 0)?t:void 0}function de(e){if(typeof e!="string")return;let r=_(e,",").map(t=>t.replace(/^['"]|['"]$/g,"").trim()).filter(t=>Me.test(t)).slice(0,4);return r.length>0?r:void 0}function He(e){let r=typeof e=="string"?e.trim().split(/\s+/):[e],t=v(r[0],0,64),n=v(r[1]??r[0],0,64);if(!(t===void 0||n===void 0))return{paddingBlock:t,paddingInline:n}}function Ye(e){if(e==="bold")return 700;if(e==="normal")return 400;let r=Number(e);return Number.isInteger(r)&&r>=100&&r<=900?r:void 0}function he({appearance:e,buttonsStyles:r,fontFamily:t}){let n=r.submitButton;if(!n)return;let o=e?.variables,a=ze(n.background??n.backgroundColor),i=M(o?.colorPrimaryHover),u=i?{type:"solid",color:i}:a&&We(a),s={fontFamilies:de(n.fontFamily)??de(t),fontSize:v(n.fontSize??r.submitButtonFontSize,10,32)??16,fontWeight:Ye(n.fontWeight)??600,letterSpacing:Ne(n.letterSpacing,-.1,.5)??.01,lineHeight:v(n.lineHeight,.8,2)??1,textTransform:_e.has(String(n.textTransform))?n.textTransform:"uppercase"},l=He(n.padding),c=Ge(n.boxShadow),f=v(n.borderRadius,0,9999),b=typeof n.backdropFilter=="string"?v(Ie.exec(n.backdropFilter.trim())?.[1],0,40):void 0;return{foregroundColor:M(n.color)??"#FFFFFF",...a?{background:a,disabledBackground:a}:{},...u?{hoverBackground:u}:{},typography:s,...l?{spacing:l}:{},...c?{shadow:c}:{},...f===void 0?{}:{borderRadius:f},disabledOpacity:e?.theme==="night"?.8:.6,...b===void 0?{}:{backdropBlur:b}}}function Ue(e,r=.12){let t=e.trim(),n=/^[0-9a-fA-F]{6}$/.test(t)?`#${t}`:t;return/^#[0-9a-fA-F]{6}$/.test(n)?z(n,r):e}function Xe(e){if(typeof e=="number"||typeof e=="string")return e}function be({appearance:e,buttonsStyles:r,layout:t="default"}){let n=e?.variables,o=f=>typeof f=="string"&&f?f:void 0,a=r.submitButton,i=o(n?.colorPrimary)??o(a?.backgroundColor)??"#4A49FF",u=t==="buttons",s=r.nameInput,l=o(s?.fontFamily)??o(n?.fontFamily)??"Poppins, sans-serif",c=he({appearance:e,buttonsStyles:r,fontFamily:l});return{primaryColor:i,primaryHoverColor:o(n?.colorPrimaryHover)??Ue(i,.12),inputBackgroundColor:o(r.cardInputBackground)??o(n?.colorBackground)??"#ffffff",textColor:o(r.cardInputColor)??o(s?.color)??o(n?.colorText)??"#262833",borderColor:o(r.cardInputBorder)??(u?"#e5e7eb":"#A4A4FF"),placeholderColor:o(r.cardInputPlaceholderColor)??"#9ca3af",errorColor:o(n?.colorDanger)??"#dc2626",successColor:"#16a34a",fontFamily:l,fontSize:o(r.cardInputFontSize)??o(n?.fontSizeBase)??"16px",fontWeight:String(Xe(s?.fontWeight)??400),borderRadius:o(n?.borderRadius)??"8px",...c?{submitButton:c}:{}}}import{Fragment as ke,jsx as $,jsxs as er}from"react/jsx-runtime";var K=class extends V{constructor(r,t,n){super(r,t,n),this.name="FloPayCardSetupError",this.retryable=n.retryable}};function Se(e,r={}){let t=e instanceof V?e:void 0,n=t?.statusCode,o=r.retryable??(t?.type==="network_error"||t?.type==="rate_limit_error"||typeof n=="number"&&n>=500||t?.code==="vault_capture_timeout"||!t);return new K(t?.message??(e instanceof Error?e.message:"Failed to load the secure card form."),t?.type??"api_error",{code:r.code??t?.code??"card_setup_load_failed",retryable:o,...t?.param?{param:t.param}:{},...n===void 0?{}:{statusCode:n}})}function vr({sessionId:e,nonce:r,billingApiUrl:t,telemetry:n,theme:o="modern-light",containerStyle:a,loading:i=null,onReady:u,onComplete:s,onDecline:l,onCancel:c,onValidation:f,onError:b}){let[p,F]=N(null),[C,E]=N(null),[A,L]=N(null),[D,S]=N(null),[G,B]=N(null),m=h(!1),H=h(!1),k=W(()=>typeof o=="object"?void 0:Qe(o),[o]),we=W(()=>typeof o=="object"?o:k?be({appearance:k.appearance,buttonsStyles:k.buttonsLayout,layout:"default"}):null,[k,o]),xe=W(()=>ne(k?.buttonsLayout.cardFormContainer,a),[k,a]),Z=W(()=>k?le(k):void 0,[k]),J=h(u),Y=h(b),Q=h(s),ee=h(l),re=h(c),te=h(f),O=h(!1),U=h(!1),X=h(0);return J.current=u,Y.current=b,Q.current=s,ee.current=l,re.current=c,te.current=f,q(()=>{let d=X.current+1;return X.current=d,()=>{queueMicrotask(()=>{X.current===d&&(O.current||U.current||(U.current=!0,x(()=>{re.current?.({status:"cancelled",sessionId:e})})))})}},[e]),q(()=>{let d=!0,R=new qe(Je(t),{telemetry:n});return F(null),E(null),L(null),O.current=!1,U.current=!1,(async()=>{try{if(!e.trim())throw new V("FloPayCardSetup requires a sessionId.","validation_error",{code:"MissingCheckoutSessionId",param:"sessionId"});if(!r.trim())throw new V("FloPayCardSetup requires a session nonce.","validation_error",{code:"MissingCheckoutSessionToken",param:"nonce"});let I=await R.getUnifiedCheckoutSession(e,r);if(!d)return;let w=I.data.session;if(!w||!Ze(w))throw new V("FloPayCardSetup only accepts a zero-amount, productless setup session.","validation_error",{code:"InvalidCardSetupSession",param:"sessionId"});let g=w.vault;if(g?.html?.trim()||(g=await R.getVaultCapture(e,r)),!g.html?.trim())throw new V("FloPay: this setup session has no vault card capability. Upgrade the billing backend integration.","api_error",{code:"UnsupportedBackendVaultCapability"});if(!d)return;E(g),F(new Ke({sessionId:e,operation:"card_setup",telemetry:n}))}catch(I){if(!d)return;let w=Se(I);O.current=!0,L(w),x(()=>Y.current?.(w))}})(),()=>{d=!1,R.destroy()}},[t,r,e,n]),q(()=>{if(!p)return;let d=!1;H.current=!1,m.current=!1;let R=p.on("submitting",()=>{m.current=!0,B(null),S("processing")}),I=p.on("complete",g=>{O.current=!0,m.current=!1,S("success"),(async()=>(await new Promise(j=>setTimeout(j,600)),!H.current&&(H.current=!0,x(()=>{Q.current?.({status:"succeeded",sessionId:e,...g.paymentMethod?{paymentMethod:g.paymentMethod}:{}})}),d||S(null))))()}),w=p.on("decline",g=>{O.current=!0,m.current=!1,B(g.message??null),S("error"),x(()=>{ee.current?.({status:"declined",sessionId:e,...g.declineReason?{reason:g.declineReason}:{},...g.message?{message:g.message}:{}})}),(async()=>(await new Promise(j=>setTimeout(j,400)),d||S(null)))()});return()=>{d=!0,R(),I(),w()}},[p,e]),A?$("div",{role:"alert",children:A.message}):!p||!C?.html?$(ke,{children:i}):er(ke,{children:[D&&$(ce,{status:D,errorMessage:G,processingLabel:"SAVING CARD...",successLabel:"CARD SAVED",errorLabel:"CARD NOT SAVED",successNote:null,...Z?{theme:Z}:{}}),$(se,{capture:p,html:C.html,messageToken:C.messageToken,expectedOrigin:C.expectedOrigin,theme:we,containerStyle:xe,onReady:()=>{x(()=>J.current?.())},onValidation:d=>{x(()=>te.current?.(d))},onError:d=>{if(!d)return;m.current&&(m.current=!1,B(d),S("error"),setTimeout(()=>S(null),400));let R=Se(new Error(d),{code:"card_setup_widget_failed",retryable:!0});x(()=>Y.current?.(R))}})]})}export{x as a,ce as b,ae as c,se as d,Ue as e,Xe as f,be as g,K as h,vr as i};