diff --git a/dist/bundle.js b/dist/bundle.js index 88fc55e..98863c2 100644 --- a/dist/bundle.js +++ b/dist/bundle.js @@ -1,2 +1,2 @@ /*! For license information please see bundle.js.LICENSE.txt */ -!function(e,n){"object"==typeof exports&&"object"==typeof module?module.exports=n(require("react"),require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["react","react/jsx-runtime"],n):"object"==typeof exports?exports.ReactHyperJs=n(require("react"),require("react/jsx-runtime")):e.ReactHyperJs=n(e.React,e[void 0])}(this,(e,n)=>(()=>{"use strict";var t={12(n){n.exports=e},402(e){e.exports=n}},o={};function r(e){var n=o[e];if(void 0!==n)return n.exports;var i=o[e]={exports:{}};return t[e](i,i.exports,r),i.exports}r.d=(e,n)=>{for(var t in n)r.o(n,t)&&!r.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:n[t]})},r.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var i={};r.r(i),r.d(i,{ApplePayElement:()=>Ee,CardCVCElement:()=>de,CardCVCWidget:()=>Pe,CardElement:()=>me,CardExpiryElement:()=>Ce,CardExpiryWidget:()=>ve,CardNumberElement:()=>pe,CardNumberWidget:()=>ye,CardWidget:()=>fe,Elements:()=>ue,ExpressCheckoutElement:()=>Se,GooglePayElement:()=>he,HyperElements:()=>ce,HyperManagementElements:()=>xe,PayPalElement:()=>ke,PaymentElement:()=>le,PaymentMethodsManagementElement:()=>Be,PazeElement:()=>ge,UnifiedCheckout:()=>se,initPaymentSession:()=>oe,useElements:()=>ae,useHyper:()=>ee,usePaymentSession:()=>te,useStripe:()=>ne,useWidgets:()=>ie});var a=r(12),u=r(402),c={on:function(e,n){},collapse:function(){},blur:function(){},update:function(e){},destroy:function(){},unmount:function(){},mount:function(e){},focus:function(){},clear:function(){},onSDKHandleClick:function(e){}},l=function(e){if("string"==typeof e)return e},s=function(e){if("object"==typeof e&&!Array.isArray(e)&&null!==e)return e},m=function(e){if(Array.isArray(e))return e};function f(e,n,t){for(var o=new Array(t),r=0,i=n;r=0)return function(e,n){return function(t){return p(e,n.concat([t]))}}(o,t);n=f(t,i,0|-a),e=o.apply(null,f(t,0,i))}}function y(e){return 1===e.length?e:function(n){return function(e,n){var t=e.length;if(1===t)return e(n);switch(t){case 1:return e(n);case 2:return function(t){return e(n,t)};case 3:return function(t,o){return e(n,t,o)};case 4:return function(t,o,r){return e(n,t,o,r)};case 5:return function(t,o,r,i){return e(n,t,o,r,i)};case 6:return function(t,o,r,i,a){return e(n,t,o,r,i,a)};case 7:return function(t,o,r,i,a,u){return e(n,t,o,r,i,a,u)};default:return p(e,[n])}}(e,n)}}function d(e){return void 0===e?{BS_PRIVATE_NESTED_SOME_NONE:0}:null!==e&&void 0!==e.BS_PRIVATE_NESTED_SOME_NONE?{BS_PRIVATE_NESTED_SOME_NONE:e.BS_PRIVATE_NESTED_SOME_NONE+1|0}:e}function P(e){if(null===e||void 0===e.BS_PRIVATE_NESTED_SOME_NONE)return e;var n=e.BS_PRIVATE_NESTED_SOME_NONE;return 0===n?void 0:{BS_PRIVATE_NESTED_SOME_NONE:n-1|0}}function C(e,n){return function(e,n){if(void 0!==e)return n(P(e))}(e,y(n))}function v(e,n){return void 0!==e?P(e):n}function h(e){return e}var E={getCustomerSavedPaymentMethods:function(e){return Promise.resolve(null)},updateIntent:function(e){return Promise.resolve({})}},g={clientSecret:"",confirmPayment:function(e){return Promise.resolve({})},confirmCardPayment:function(e,n,t){return Promise.resolve({})},retrievePaymentIntent:function(e){return Promise.resolve({})},paymentRequest:h,initPaymentSession:function(e){return E},completeUpdateIntent:function(e){return Promise.resolve({})},initiateUpdateIntent:function(){return Promise.resolve({})},confirmTokenization:function(e){return Promise.resolve({})}},k=a.createContext(g),S={make:k.Provider},x={ephemeralKey:"",paymentRequest:h},B=a.createContext(x),R={make:k.Provider};function T(e,n,t){return v(C(e[n],l),t)}function b(e){var n=v(s(e),{});return{fonts:v(C(n.fonts,m),[]),locale:T(n,"locale",""),clientSecret:T(n,"clientSecret",""),appearance:v(C(n.appearance,s),{}),loader:T(n,"loader","auto")}}function _(e){}function j(e){}function I(){return new Promise(function(e,n){setTimeout(function(){e({})},1e3)})}function O(e,n){return c}var F={options:{fonts:[],locale:"",clientSecret:"",appearance:{},loader:""},update:_,getElement:j,fetchUpdates:I,create:O,updateIntent:function(e){return Promise.resolve({})}},N=a.createContext(F),U={make:N.Provider},M={getCustomerSavedPaymentMethods:function(e){return Promise.resolve({})},updateIntent:function(e){return Promise.resolve({})}},w=a.createContext(M),A={make:w.Provider},q={options:{fonts:[],locale:"",ephemeralKey:"",appearance:{},loader:""},update:_,getElement:j,fetchUpdates:I,create:O},D=a.createContext(q),H={make:D.Provider},z=function(e){var n=e.imperativeRef,t=e.onPaymentButtonClick,o=e.onPaymentComplete,r=e.onClick,i=e.onBlur,c=e.onFocus,l=e.componentType,s=e.onReady,m=e.onChange,f=e.options,p=e.id,y=void 0!==p?p:"payment-Element",C=void 0!==n?P(n):null,v=a.useContext(k),h=a.useContext(N),E=a.useRef(null),g=h.create(l,f);return a.useImperativeHandle(C,function(){return{confirmPayment:v.confirmPayment}},[v]),a.useEffect(function(){h.create(l,f).mount("#orca-elements-payment-element-"+y)},[E,h]),a.useEffect(function(){g.on("ready",s),g.on("focus",c),g.on("blur",i),g.on("clickTriggered",r),g.on("change",m),g.on("completeDoThis",o),g.onSDKHandleClick(t)},[h,v]),u.jsx("div",{ref:d(E),id:"orca-elements-payment-element-"+y})},V=function(e){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"cardCvc",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})};function G(e){return G="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},G(e)}var K=function(e){return null!==e&&"object"===G(e)&&"function"==typeof e.then?e:Promise.resolve(e)};function W(e,n){return e.catch(function(e){return n(function(e){return null!=e&&"string"==typeof e.RE_EXN_ID}(t=e)?t:{RE_EXN_ID:"JsError",_1:t});var t})}new Map;var J=function(e){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"cardExpiry",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},X=function(e){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"cardNumber",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},L=function(e){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"card",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},Q=a.forwardRef(function(e,n){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"payment",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick,imperativeRef:d(n)})});function Y(){var e,n,t="function"==typeof Symbol?Symbol:{},o=t.iterator||"@@iterator",r=t.toStringTag||"@@toStringTag";function i(t,o,r,i){var c=o&&o.prototype instanceof u?o:u,l=Object.create(c.prototype);return Z(l,"_invoke",function(t,o,r){var i,u,c,l=0,s=r||[],m=!1,f={p:0,n:0,v:e,a:p,f:p.bind(e,4),d:function(n,t){return i=n,u=0,c=e,f.n=t,a}};function p(t,o){for(u=t,c=o,n=0;!m&&l&&!r&&n3?(r=y===o)&&(c=i[(u=i[4])?5:(u=3,3)],i[4]=i[5]=e):i[0]<=p&&((r=t<2&&po||o>y)&&(i[4]=t,i[5]=o,f.n=y,u=0))}if(r||t>1)return a;throw m=!0,o}return function(r,s,y){if(l>1)throw TypeError("Generator is already running");for(m&&1===s&&p(s,y),u=s,c=y;(n=u<2?e:c)||!m;){i||(u?u<3?(u>1&&(f.n=-1),p(u,c)):f.n=c:f.v=c);try{if(l=2,i){if(u||(r="next"),n=i[r]){if(!(n=n.call(i,c)))throw TypeError("iterator result is not an object");if(!n.done)return n;c=n.value,u<2&&(u=0)}else 1===u&&(n=i.return)&&n.call(i),u<2&&(c=TypeError("The iterator does not provide a '"+r+"' method"),u=1);i=e}else if((n=(m=f.n<0)?c:t.call(o,f))!==a)break}catch(n){i=e,u=1,c=n}finally{l=1}}return{value:n,done:m}}}(t,r,i),!0),l}var a={};function u(){}function c(){}function l(){}n=Object.getPrototypeOf;var s=[][o]?n(n([][o]())):(Z(n={},o,function(){return this}),n),m=l.prototype=u.prototype=Object.create(s);function f(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,l):(e.__proto__=l,Z(e,r,"GeneratorFunction")),e.prototype=Object.create(m),e}return c.prototype=l,Z(m,"constructor",l),Z(l,"constructor",c),c.displayName="GeneratorFunction",Z(l,r,"GeneratorFunction"),Z(m),Z(m,r,"Generator"),Z(m,o,function(){return this}),Z(m,"toString",function(){return"[object Generator]"}),(Y=function(){return{w:i,m:f}})()}function Z(e,n,t,o){var r=Object.defineProperty;try{r({},"",{})}catch(e){r=0}Z=function(e,n,t,o){function i(n,t){Z(e,n,function(e){return this._invoke(n,t,e)})}n?r?r(e,n,{value:t,enumerable:!o,configurable:!o,writable:!o}):e[n]=t:(i("next",0),i("throw",1),i("return",2))},Z(e,n,t,o)}function $(e,n,t,o,r,i,a){try{var u=e[i](a),c=u.value}catch(e){return void t(e)}u.done?n(c):Promise.resolve(c).then(o,r)}function ee(){return a.useContext(k)}function ne(){return console.warn("useStripe() is deprecated. Use useHyper() instead"),a.useContext(k)}function te(){return a.useContext(w)}function oe(e,n){return re.apply(this,arguments)}function re(){var e;return e=Y().m(function e(n,t){var o;return Y().w(function(e){for(;;)switch(e.n){case 0:return e.n=1,n;case 1:return o=e.v,e.a(2,o.initPaymentSession(t))}},e)}),re=function(){var n=this,t=arguments;return new Promise(function(o,r){var i=e.apply(n,t);function a(e){$(i,o,r,a,u,"next",e)}function u(e){$(i,o,r,a,u,"throw",e)}a(void 0)})},re.apply(this,arguments)}function ie(){return a.useContext(N)}function ae(){return console.warn("useElements() is deprecated. Use useWidgets() instead"),a.useContext(N)}var ue=function(e){var n=e.options,t=e.stripe,o=a.useState(function(){return g}),r=o[1],i=a.useState(function(){return F}),c=i[1];return a.useEffect(function(){W(Promise.all([t,K(n)]).then(function(e){var n=e[1],t=e[0],o=b(n),i=t.elements(n),a={options:o,update:i.update,getElement:i.getElement,fetchUpdates:i.fetchUpdates,create:i.create,updateIntent:i.updateIntent},u={clientSecret:o.clientSecret,confirmPayment:t.confirmPayment,confirmCardPayment:t.confirmCardPayment,retrievePaymentIntent:t.retrievePaymentIntent,paymentRequest:t.paymentRequest,initPaymentSession:t.initPaymentSession,completeUpdateIntent:t.completeUpdateIntent,initiateUpdateIntent:t.initiateUpdateIntent,confirmTokenization:t.confirmTokenization};return r(function(e){return u}),c(function(e){return a}),Promise.resolve(u)}),function(e){return console.warn("[Elements] Failed to initialise hyper promise:",e),Promise.resolve(g)})},[t,n]),u.jsx(S.make,{value:o[0],children:u.jsx(U.make,{value:i[0],children:e.children})})},ce=function(e){var n=e.options,t=e.hyper,o=a.useState(function(){return g}),r=o[1],i=a.useState(function(){return F}),c=i[1],l=a.useState(function(){return M}),s=l[1];return a.useEffect(function(){W(Promise.all([t,K(n)]).then(function(e){var n=e[1],t=e[0],o=b(n),i=t.elements(n),a={options:o,update:i.update,getElement:i.getElement,fetchUpdates:i.fetchUpdates,create:i.create,updateIntent:i.updateIntent},u={clientSecret:o.clientSecret,confirmPayment:t.confirmPayment,confirmCardPayment:t.confirmCardPayment,retrievePaymentIntent:t.retrievePaymentIntent,paymentRequest:t.paymentRequest,initPaymentSession:t.initPaymentSession,completeUpdateIntent:t.completeUpdateIntent,initiateUpdateIntent:t.initiateUpdateIntent,confirmTokenization:t.confirmTokenization},l=t.initPaymentSession(n),m={getCustomerSavedPaymentMethods:l.getCustomerSavedPaymentMethods,updateIntent:l.updateIntent};return r(function(e){return u}),c(function(e){return a}),s(function(e){return m}),Promise.resolve(u)}),function(e){return console.warn("[HyperElements] Failed to initialise hyper promise:",e),Promise.resolve(g)})},[t,n]),u.jsx(S.make,{value:o[0],children:u.jsx(U.make,{value:i[0],children:u.jsx(A.make,{value:l[0],children:e.children})})})},le=Q,se=Q,me=L,fe=L,pe=X,ye=X,de=V,Pe=V,Ce=J,ve=J,he=function(e){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"googlePay",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},Ee=function(e){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"applePay",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},ge=function(e){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"paze",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},ke=function(e){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"payPal",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},Se=function(e){return u.jsx(z,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"expressCheckout",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},xe=function(e){var n=e.options,t=e.hyper,o=a.useState(function(){return g}),r=o[1],i=a.useState(function(){return q}),c=i[1];return a.useEffect(function(){W(Promise.all([t,K(n)]).then(function(e){var n=e[1],t=e[0],o=function(e){var n=v(s(e),{});return{fonts:v(C(n.fonts,m),[]),locale:T(n,"locale",""),ephemeralKey:T(n,"ephemeralKey",""),appearance:v(C(n.appearance,s),{}),loader:T(n,"loader","auto")}}(n),i=t.paymentMethodsManagementElements(n),a={options:o,update:i.update,getElement:i.getElement,fetchUpdates:i.fetchUpdates,create:i.create},u={clientSecret:"",confirmPayment:t.confirmPayment,confirmCardPayment:t.confirmCardPayment,retrievePaymentIntent:t.retrievePaymentIntent,paymentRequest:t.paymentRequest,initPaymentSession:t.initPaymentSession,completeUpdateIntent:t.completeUpdateIntent,initiateUpdateIntent:t.initiateUpdateIntent,confirmTokenization:t.confirmTokenization};return r(function(e){return u}),c(function(e){return a}),Promise.resolve(u)}),function(e){return console.warn("[HyperManagementElements] Failed to initialise hyper promise:",e),Promise.resolve(g)})},[t,n]),u.jsx(R.make,{value:o[0],children:u.jsx(H.make,{value:i[0],children:e.children})})},Be=function(e){var n=e.onClick,t=e.onBlur,o=e.onFocus,r=e.componentType,i=e.onReady,c=e.onChange,l=e.options,s=e.id,m=void 0!==s?s:"payment-management",f=void 0!==r?r:"paymentMethodsManagement",p=a.useContext(B),y=a.useContext(D),P=a.useRef(null),C=y.create(f,l);return a.useEffect(function(){y.create(f,l).mount("#orca-elements-payment-management-"+m)},[P,y]),a.useEffect(function(){return C.on("ready",i),C.on("focus",o),C.on("blur",t),C.on("clickTriggered",n),C.on("change",c),function(){C.on("ready",void 0),C.on("focus",void 0),C.on("blur",void 0),C.on("clickTriggered",void 0),C.on("change",void 0)}},[y,p]),u.jsx("div",{ref:d(P),id:"orca-elements-payment-management-"+m})};return i})()); \ No newline at end of file +!function(e,n){"object"==typeof exports&&"object"==typeof module?module.exports=n(require("react"),require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["react","react/jsx-runtime"],n):"object"==typeof exports?exports.ReactHyperJs=n(require("react"),require("react/jsx-runtime")):e.ReactHyperJs=n(e.React,e[void 0])}(this,(e,n)=>(()=>{"use strict";var t={12(n){n.exports=e},402(e){e.exports=n}},o={};function r(e){var n=o[e];if(void 0!==n)return n.exports;var i=o[e]={exports:{}};return t[e](i,i.exports,r),i.exports}r.d=(e,n)=>{for(var t in n)r.o(n,t)&&!r.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:n[t]})},r.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var i={};r.r(i),r.d(i,{ApplePayElement:()=>Ve,CardCVCElement:()=>Me,CardCVCField:()=>qe,CardCVCWidget:()=>Ue,CardElement:()=>be,CardExpiryElement:()=>we,CardExpiryField:()=>Ae,CardExpiryWidget:()=>ze,CardForm:()=>Te,CardNumberElement:()=>Ne,CardNumberField:()=>He,CardNumberWidget:()=>Oe,CardWidget:()=>Ie,Elements:()=>xe,ExpressCheckoutElement:()=>We,GooglePayElement:()=>De,HyperElements:()=>Be,HyperManagementElements:()=>Je,HyperPaymentMethodsSession:()=>Fe,PayPalElement:()=>Ke,PaymentElement:()=>je,PaymentMethodsManagementElement:()=>Xe,PazeElement:()=>Ge,UnifiedCheckout:()=>_e,initPaymentSession:()=>he,useCardForm:()=>ke,useElements:()=>Se,useHyper:()=>Pe,usePaymentMethodsSession:()=>Re,usePaymentSession:()=>Ce,useStripe:()=>ve,useWidgets:()=>Ee});var u=r(12),a=r(402),c={on:function(e,n){},collapse:function(){},blur:function(){},update:function(e){},destroy:function(){},unmount:function(){},mount:function(e){},focus:function(){},clear:function(){},onSDKHandleClick:function(e){}},s={mount:function(e){},unmount:function(){},destroy:function(){},update:function(e){},focus:function(){},blur:function(){},clear:function(){},on:function(e,n){}};function f(e,n){var t={};t.code=e,t.message=n;var o={status:"error"};return o.error=t,o}function l(){return f("sdk_not_ready","Hyper is not initialized yet — the card form is not ready")}function m(e,n,t){return f("unsupported_on_surface",e+"() is not available on the "+n+" surface — use "+t+"()")}var d=function(e){if("string"==typeof e)return e},p=function(e){if("object"==typeof e&&!Array.isArray(e)&&null!==e)return e},y=function(e){if(Array.isArray(e))return e};function P(e,n,t){for(var o=new Array(t),r=0,i=n;r=0)return function(e,n){return function(t){return v(e,n.concat([t]))}}(o,t);n=P(t,i,0|-u),e=o.apply(null,P(t,0,i))}}function C(e){return 1===e.length?e:function(n){return function(e,n){var t=e.length;if(1===t)return e(n);switch(t){case 1:return e(n);case 2:return function(t){return e(n,t)};case 3:return function(t,o){return e(n,t,o)};case 4:return function(t,o,r){return e(n,t,o,r)};case 5:return function(t,o,r,i){return e(n,t,o,r,i)};case 6:return function(t,o,r,i,u){return e(n,t,o,r,i,u)};case 7:return function(t,o,r,i,u,a){return e(n,t,o,r,i,u,a)};default:return v(e,[n])}}(e,n)}}function h(e){return void 0===e?{BS_PRIVATE_NESTED_SOME_NONE:0}:null!==e&&void 0!==e.BS_PRIVATE_NESTED_SOME_NONE?{BS_PRIVATE_NESTED_SOME_NONE:e.BS_PRIVATE_NESTED_SOME_NONE+1|0}:e}function g(e){if(null===e||void 0===e.BS_PRIVATE_NESTED_SOME_NONE)return e;var n=e.BS_PRIVATE_NESTED_SOME_NONE;return 0===n?void 0:{BS_PRIVATE_NESTED_SOME_NONE:n-1|0}}function E(e,n){return function(e,n){if(void 0!==e)return n(g(e))}(e,C(n))}function k(e,n){if(void 0!==e)return n(g(e))}function R(e,n){return void 0!==e?g(e):n}function S(e){return e}var x={getCustomerSavedPaymentMethods:function(e){return Promise.resolve(null)},updateIntent:function(e){return Promise.resolve({})}},B={clientSecret:"",confirmPayment:function(e){return Promise.resolve({})},confirmCardPayment:function(e,n,t){return Promise.resolve({})},retrievePaymentIntent:function(e){return Promise.resolve({})},paymentRequest:S,initPaymentSession:function(e){return x},completeUpdateIntent:function(e){return Promise.resolve({})},initiateUpdateIntent:function(){return Promise.resolve({})},confirmTokenization:function(e){return Promise.resolve({})}},F=u.createContext(B),T={make:F.Provider},j={ephemeralKey:"",paymentRequest:S},_=u.createContext(j),b={make:F.Provider};function I(e,n,t){return R(E(e[n],d),t)}function N(e){var n=R(p(e),{});return{fonts:R(E(n.fonts,y),[]),locale:I(n,"locale",""),clientSecret:I(n,"clientSecret",""),appearance:R(E(n.appearance,p),{}),loader:I(n,"loader","auto")}}function O(e){}function M(e){}function U(){return new Promise(function(e,n){setTimeout(function(){e({})},1e3)})}function w(e,n){return c}var z={create:function(e,n){return s},on:function(e,n){},confirmPayment:function(){return Promise.resolve(l())},deinit:function(){},update:function(e){},fields:{contents:{}}},H={options:{fonts:[],locale:"",clientSecret:"",appearance:{},loader:""},update:O,getElement:M,fetchUpdates:U,create:w,updateIntent:function(e){return Promise.resolve({})},cardForm:function(){return z},isReady:!1},A=u.createContext(H),q={make:A.Provider},D={createField:function(e,n){return s},confirmPayment:function(){return Promise.resolve(l())},tokenize:function(){return Promise.resolve(l())},on:function(e,n){},update:function(e){},deinit:function(){},getFields:function(){return{}},isReady:!1},V=u.createContext(D),G={make:V.Provider},K={session:void 0,isPresent:!0},W=u.createContext({session:void 0,isPresent:!1}),J={make:W.Provider},X={getCustomerSavedPaymentMethods:function(e){return Promise.resolve({})},updateIntent:function(e){return Promise.resolve({})}},L=u.createContext(X),Q={make:L.Provider},Y={options:{fonts:[],locale:"",ephemeralKey:"",appearance:{},loader:""},update:O,getElement:M,fetchUpdates:U,create:w},Z=u.createContext(Y),$={make:Z.Provider},ee=function(e){var n=e.imperativeRef,t=e.onPaymentButtonClick,o=e.onPaymentComplete,r=e.onClick,i=e.onBlur,c=e.onFocus,s=e.componentType,f=e.onReady,l=e.onChange,m=e.options,d=e.id,p=void 0!==d?d:"payment-Element",y=void 0!==n?g(n):null,P=u.useContext(F),v=u.useContext(A),C=u.useRef(null),E=v.create(s,m);return u.useImperativeHandle(y,function(){return{confirmPayment:P.confirmPayment}},[P]),u.useEffect(function(){v.create(s,m).mount("#orca-elements-payment-element-"+p)},[C,v]),u.useEffect(function(){E.on("ready",f),E.on("focus",c),E.on("blur",i),E.on("clickTriggered",r),E.on("change",l),E.on("completeDoThis",o),E.onSDKHandleClick(t)},[v,P]),a.jsx("div",{ref:h(C),id:"orca-elements-payment-element-"+p})},ne=function(e){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"cardCvc",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},te=u.forwardRef(function(e,n){var t=e.onReady,o=e.onChange,r=u.useContext(A),i=u.useContext(W),c=u.useRef(!1),s=u.useState(function(){return D}),f=s[1],l=s[0];return u.useEffect(function(){if(!c.current)if(i.isPresent)k(i.session,function(e){var n=e.cardForm();c.current=!0,f(function(e){return{createField:n.create,confirmPayment:function(){return Promise.resolve(m("confirmPayment","vault","tokenize"))},tokenize:n.tokenize,on:n.on,update:n.update,deinit:n.deinit,getFields:function(){return n.fields.contents},isReady:!0}})});else if(r.isReady){var e=r.cardForm();c.current=!0,f(function(n){return{createField:e.create,confirmPayment:e.confirmPayment,tokenize:function(){return Promise.resolve(m("tokenize","payments","confirmPayment"))},on:e.on,update:e.update,deinit:e.deinit,getFields:function(){return e.fields.contents},isReady:!0}})}},[r,i]),u.useEffect(function(){l.isReady&&(k(o,function(e){l.on("change",e)}),k(t,function(e){l.on("ready",e)}))}),u.useImperativeHandle(n,function(){return{confirmPayment:l.confirmPayment,tokenize:l.tokenize,update:l.update,deinit:l.deinit,on:l.on,getFields:l.getFields}},[l]),a.jsx(G.make,{value:l,children:e.children})});function oe(e){return Promise.resolve(e)}function re(e,n){return e.catch(function(e){return n(function(e){return null!=e&&"string"==typeof e.RE_EXN_ID}(t=e)?t:{RE_EXN_ID:"JsError",_1:t});var t})}new Map;var ie=function(e){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"cardExpiry",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},ue=function(e){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"cardNumber",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},ae=function(e){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"card",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},ce=function(e){var n=e.imperativeRef,t=e.onBlur,o=e.onFocus,r=e.onReady,i=e.onChange,c=e.fieldType,s=void 0!==n?g(n):null,f=u.useContext(V),l=u.useRef(null),m=u.useRef(void 0),d=u.useRef(!1),p="hyper-card-field-"+R(e.id,c),y=R(e.options,{}),P=JSON.stringify(y),v=function(e){k(i,function(n){e.on("change",n)}),k(r,function(n){e.on("ready",n)}),k(o,function(n){e.on("focus",n)}),k(t,function(n){e.on("blur",n)})};return u.useEffect(function(){if(f.isReady){var e,n=m.current;if(void 0!==n)e=n;else{var t=f.createField(c,y);m.current=t,e=t}return v(e),e.mount("#"+p),function(){e.unmount()}}},[f.isReady,p]),u.useEffect(function(){k(m.current,v)}),u.useEffect(function(){d.current?k(m.current,function(e){e.update(y)}):d.current=!0},[P]),u.useImperativeHandle(s,function(){return{mount:function(e){k(m.current,function(n){n.mount(e)})},unmount:function(){k(m.current,function(e){e.unmount()})},destroy:function(){k(m.current,function(e){e.destroy()})},update:function(e){k(m.current,function(n){n.update(e)})},focus:function(){k(m.current,function(e){e.focus()})},blur:function(){k(m.current,function(e){e.blur()})},clear:function(){k(m.current,function(e){e.clear()})},on:function(e,n){k(m.current,function(t){t.on(e,n)})}}},[]),a.jsx("div",{ref:h(l),id:p})},se=u.forwardRef(function(e,n){return a.jsx(ce,{fieldType:"cardCvc",id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,onFocus:e.onFocus,onBlur:e.onBlur,imperativeRef:h(n)})}),fe=u.forwardRef(function(e,n){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"payment",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick,imperativeRef:h(n)})}),le=u.forwardRef(function(e,n){return a.jsx(ce,{fieldType:"cardExpiry",id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,onFocus:e.onFocus,onBlur:e.onBlur,imperativeRef:h(n)})}),me=u.forwardRef(function(e,n){return a.jsx(ce,{fieldType:"cardNumber",id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,onFocus:e.onFocus,onBlur:e.onBlur,imperativeRef:h(n)})});function de(){var e,n,t="function"==typeof Symbol?Symbol:{},o=t.iterator||"@@iterator",r=t.toStringTag||"@@toStringTag";function i(t,o,r,i){var c=o&&o.prototype instanceof a?o:a,s=Object.create(c.prototype);return pe(s,"_invoke",function(t,o,r){var i,a,c,s=0,f=r||[],l=!1,m={p:0,n:0,v:e,a:d,f:d.bind(e,4),d:function(n,t){return i=n,a=0,c=e,m.n=t,u}};function d(t,o){for(a=t,c=o,n=0;!l&&s&&!r&&n3?(r=p===o)&&(c=i[(a=i[4])?5:(a=3,3)],i[4]=i[5]=e):i[0]<=d&&((r=t<2&&do||o>p)&&(i[4]=t,i[5]=o,m.n=p,a=0))}if(r||t>1)return u;throw l=!0,o}return function(r,f,p){if(s>1)throw TypeError("Generator is already running");for(l&&1===f&&d(f,p),a=f,c=p;(n=a<2?e:c)||!l;){i||(a?a<3?(a>1&&(m.n=-1),d(a,c)):m.n=c:m.v=c);try{if(s=2,i){if(a||(r="next"),n=i[r]){if(!(n=n.call(i,c)))throw TypeError("iterator result is not an object");if(!n.done)return n;c=n.value,a<2&&(a=0)}else 1===a&&(n=i.return)&&n.call(i),a<2&&(c=TypeError("The iterator does not provide a '"+r+"' method"),a=1);i=e}else if((n=(l=m.n<0)?c:t.call(o,m))!==u)break}catch(n){i=e,a=1,c=n}finally{s=1}}return{value:n,done:l}}}(t,r,i),!0),s}var u={};function a(){}function c(){}function s(){}n=Object.getPrototypeOf;var f=[][o]?n(n([][o]())):(pe(n={},o,function(){return this}),n),l=s.prototype=a.prototype=Object.create(f);function m(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,s):(e.__proto__=s,pe(e,r,"GeneratorFunction")),e.prototype=Object.create(l),e}return c.prototype=s,pe(l,"constructor",s),pe(s,"constructor",c),c.displayName="GeneratorFunction",pe(s,r,"GeneratorFunction"),pe(l),pe(l,r,"Generator"),pe(l,o,function(){return this}),pe(l,"toString",function(){return"[object Generator]"}),(de=function(){return{w:i,m}})()}function pe(e,n,t,o){var r=Object.defineProperty;try{r({},"",{})}catch(e){r=0}pe=function(e,n,t,o){function i(n,t){pe(e,n,function(e){return this._invoke(n,t,e)})}n?r?r(e,n,{value:t,enumerable:!o,configurable:!o,writable:!o}):e[n]=t:(i("next",0),i("throw",1),i("return",2))},pe(e,n,t,o)}function ye(e,n,t,o,r,i,u){try{var a=e[i](u),c=a.value}catch(e){return void t(e)}a.done?n(c):Promise.resolve(c).then(o,r)}function Pe(){return u.useContext(F)}function ve(){return console.warn("useStripe() is deprecated. Use useHyper() instead"),u.useContext(F)}function Ce(){return u.useContext(L)}function he(e,n){return ge.apply(this,arguments)}function ge(){var e;return e=de().m(function e(n,t){var o;return de().w(function(e){for(;;)switch(e.n){case 0:return e.n=1,n;case 1:return o=e.v,e.a(2,o.initPaymentSession(t))}},e)}),ge=function(){var n=this,t=arguments;return new Promise(function(o,r){var i=e.apply(n,t);function u(e){ye(i,o,r,u,a,"next",e)}function a(e){ye(i,o,r,u,a,"throw",e)}u(void 0)})},ge.apply(this,arguments)}function Ee(){return u.useContext(A)}function ke(){return u.useContext(V)}function Re(){return u.useContext(W)}function Se(){return console.warn("useElements() is deprecated. Use useWidgets() instead"),u.useContext(A)}var xe=function(e){var n=e.options,t=e.stripe,o=u.useState(function(){return B}),r=o[1],i=u.useState(function(){return H}),c=i[1];return u.useEffect(function(){re(Promise.all([t,oe(n)]).then(function(e){var n=e[1],t=e[0],o=N(n),i=t.elements(n),u={options:o,update:i.update,getElement:i.getElement,fetchUpdates:i.fetchUpdates,create:i.create,updateIntent:i.updateIntent,cardForm:i.cardForm,isReady:!0},a={clientSecret:o.clientSecret,confirmPayment:t.confirmPayment,confirmCardPayment:t.confirmCardPayment,retrievePaymentIntent:t.retrievePaymentIntent,paymentRequest:t.paymentRequest,initPaymentSession:t.initPaymentSession,completeUpdateIntent:t.completeUpdateIntent,initiateUpdateIntent:t.initiateUpdateIntent,confirmTokenization:t.confirmTokenization};return r(function(e){return a}),c(function(e){return u}),Promise.resolve(a)}),function(e){return console.error("[Elements] Failed to initialise hyper promise:",e),Promise.resolve(B)})},[t,n]),a.jsx(T.make,{value:o[0],children:a.jsx(q.make,{value:i[0],children:e.children})})},Be=function(e){var n=e.options,t=e.hyper,o=u.useState(function(){return B}),r=o[1],i=u.useState(function(){return H}),c=i[1],s=u.useState(function(){return X}),f=s[1];return u.useEffect(function(){re(Promise.all([t,oe(n)]).then(function(e){var n=e[1],t=e[0],o=N(n),i=t.elements(n),u={options:o,update:i.update,getElement:i.getElement,fetchUpdates:i.fetchUpdates,create:i.create,updateIntent:i.updateIntent,cardForm:i.cardForm,isReady:!0},a={clientSecret:o.clientSecret,confirmPayment:t.confirmPayment,confirmCardPayment:t.confirmCardPayment,retrievePaymentIntent:t.retrievePaymentIntent,paymentRequest:t.paymentRequest,initPaymentSession:t.initPaymentSession,completeUpdateIntent:t.completeUpdateIntent,initiateUpdateIntent:t.initiateUpdateIntent,confirmTokenization:t.confirmTokenization},s=t.initPaymentSession(n),l={getCustomerSavedPaymentMethods:s.getCustomerSavedPaymentMethods,updateIntent:s.updateIntent};return r(function(e){return a}),c(function(e){return u}),f(function(e){return l}),Promise.resolve(a)}),function(e){return console.error("[HyperElements] Failed to initialise hyper promise:",e),Promise.resolve(B)})},[t,n]),a.jsx(T.make,{value:o[0],children:a.jsx(q.make,{value:i[0],children:a.jsx(Q.make,{value:s[0],children:e.children})})})},Fe=function(e){var n=e.options,t=e.hyper,o=u.useState(function(){return K}),r=o[1];return u.useEffect(function(){re(Promise.all([t,oe(n)]).then(function(e){var n={session:e[0].paymentMethodsSession(e[1]),isPresent:!0};return r(function(e){return n}),Promise.resolve(n)}),function(e){return console.error("[HyperPaymentMethodsSession] Failed to initialise hyper promise:",e),Promise.resolve(K)})},[t,n]),a.jsx(J.make,{value:o[0],children:e.children})},Te=te,je=fe,_e=fe,be=ae,Ie=ae,Ne=ue,Oe=ue,Me=ne,Ue=ne,we=ie,ze=ie,He=me,Ae=le,qe=se,De=function(e){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"googlePay",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},Ve=function(e){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"applePay",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},Ge=function(e){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"paze",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},Ke=function(e){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"payPal",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},We=function(e){return a.jsx(ee,{id:e.id,options:e.options,onChange:e.onChange,onReady:e.onReady,componentType:"expressCheckout",onFocus:e.onFocus,onBlur:e.onBlur,onClick:e.onClick,onPaymentComplete:e.onPaymentComplete,onPaymentButtonClick:e.onPaymentButtonClick})},Je=function(e){var n=e.options,t=e.hyper,o=u.useState(function(){return B}),r=o[1],i=u.useState(function(){return Y}),c=i[1];return u.useEffect(function(){re(Promise.all([t,oe(n)]).then(function(e){var n=e[1],t=e[0],o=function(e){var n=R(p(e),{});return{fonts:R(E(n.fonts,y),[]),locale:I(n,"locale",""),ephemeralKey:I(n,"ephemeralKey",""),appearance:R(E(n.appearance,p),{}),loader:I(n,"loader","auto")}}(n),i=t.paymentMethodsManagementElements(n),u={options:o,update:i.update,getElement:i.getElement,fetchUpdates:i.fetchUpdates,create:i.create},a={clientSecret:"",confirmPayment:t.confirmPayment,confirmCardPayment:t.confirmCardPayment,retrievePaymentIntent:t.retrievePaymentIntent,paymentRequest:t.paymentRequest,initPaymentSession:t.initPaymentSession,completeUpdateIntent:t.completeUpdateIntent,initiateUpdateIntent:t.initiateUpdateIntent,confirmTokenization:t.confirmTokenization};return r(function(e){return a}),c(function(e){return u}),Promise.resolve(a)}),function(e){return console.error("[HyperManagementElements] Failed to initialise hyper promise:",e),Promise.resolve(B)})},[t,n]),a.jsx(b.make,{value:o[0],children:a.jsx($.make,{value:i[0],children:e.children})})},Xe=function(e){var n=e.onClick,t=e.onBlur,o=e.onFocus,r=e.componentType,i=e.onReady,c=e.onChange,s=e.options,f=e.id,l=void 0!==f?f:"payment-management",m=void 0!==r?r:"paymentMethodsManagement",d=u.useContext(_),p=u.useContext(Z),y=u.useRef(null),P=p.create(m,s);return u.useEffect(function(){p.create(m,s).mount("#orca-elements-payment-management-"+l)},[y,p]),u.useEffect(function(){return P.on("ready",i),P.on("focus",o),P.on("blur",t),P.on("clickTriggered",n),P.on("change",c),function(){P.on("ready",void 0),P.on("focus",void 0),P.on("blur",void 0),P.on("clickTriggered",void 0),P.on("change",void 0)}},[p,d]),a.jsx("div",{ref:h(y),id:"orca-elements-payment-management-"+l})};return i})()); \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 608365a..139b380 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@juspay-tech/react-hyper-js", - "version": "2.6.0", + "version": "2.7.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@juspay-tech/react-hyper-js", - "version": "2.6.0", + "version": "2.7.0", "license": "Apache-2.0", "dependencies": { "@rescript/core": "^0.7.0", diff --git a/package.json b/package.json index a9faa10..716e8cc 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@juspay-tech/react-hyper-js", - "version": "2.6.0", + "version": "2.7.0", "main": "dist/bundle.js", "files": [ "dist/", diff --git a/src/Context.bs.js b/src/Context.bs.js index c485cf9..4bb681a 100644 --- a/src/Context.bs.js +++ b/src/Context.bs.js @@ -119,6 +119,39 @@ function create(_componentType, _options) { return OrcaJs.defaultPaymentElement; } +function defaultCardForm_create(_fieldType, _options) { + return OrcaJs.defaultFieldHandle; +} + +function defaultCardForm_on(_str, _func) { + +} + +function defaultCardForm_confirmPayment() { + return Promise.resolve(OrcaJs.sdkNotReadyError()); +} + +function defaultCardForm_deinit() { + +} + +function defaultCardForm_update(_x) { + +} + +var defaultCardForm_fields = { + contents: {} +}; + +var defaultCardForm = { + create: defaultCardForm_create, + on: defaultCardForm_on, + confirmPayment: defaultCardForm_confirmPayment, + deinit: defaultCardForm_deinit, + update: defaultCardForm_update, + fields: defaultCardForm_fields +}; + var defaultElementsContext_options = { fonts: [], locale: "", @@ -131,13 +164,19 @@ function defaultElementsContext_updateIntent(param) { return Promise.resolve({}); } +function defaultElementsContext_cardForm() { + return defaultCardForm; +} + var defaultElementsContext = { options: defaultElementsContext_options, update: update, getElement: getElement, fetchUpdates: fetchUpdates, create: create, - updateIntent: defaultElementsContext_updateIntent + updateIntent: defaultElementsContext_updateIntent, + cardForm: defaultElementsContext_cardForm, + isReady: false }; var elementsContext = React.createContext(defaultElementsContext); @@ -148,6 +187,71 @@ var ElementsContextProvider = { make: make$2 }; +function defaultCardFormContext_createField(_fieldType, _options) { + return OrcaJs.defaultFieldHandle; +} + +function defaultCardFormContext_confirmPayment() { + return Promise.resolve(OrcaJs.sdkNotReadyError()); +} + +function defaultCardFormContext_tokenize() { + return Promise.resolve(OrcaJs.sdkNotReadyError()); +} + +function defaultCardFormContext_on(_str, _func) { + +} + +function defaultCardFormContext_update(_x) { + +} + +function defaultCardFormContext_deinit() { + +} + +function defaultCardFormContext_getFields() { + return {}; +} + +var defaultCardFormContext = { + createField: defaultCardFormContext_createField, + confirmPayment: defaultCardFormContext_confirmPayment, + tokenize: defaultCardFormContext_tokenize, + on: defaultCardFormContext_on, + update: defaultCardFormContext_update, + deinit: defaultCardFormContext_deinit, + getFields: defaultCardFormContext_getFields, + isReady: false +}; + +var cardFormContext = React.createContext(defaultCardFormContext); + +var make$3 = cardFormContext.Provider; + +var CardFormContextProvider = { + make: make$3 +}; + +var defaultPaymentMethodsSessionContext = { + session: undefined, + isPresent: false +}; + +var pendingPaymentMethodsSessionContext = { + session: undefined, + isPresent: true +}; + +var paymentMethodsSessionContext = React.createContext(defaultPaymentMethodsSessionContext); + +var make$4 = paymentMethodsSessionContext.Provider; + +var PaymentMethodsSessionContextProvider = { + make: make$4 +}; + function paymentMethodsManagementElementsOptionObjMapper(options) { var dict = Core__Option.getOr(Core__JSON.Decode.object(options), {}); return { @@ -174,10 +278,10 @@ var defaultPaymentSessionContext = { var paymentSessionContext = React.createContext(defaultPaymentSessionContext); -var make$3 = paymentSessionContext.Provider; +var make$5 = paymentSessionContext.Provider; var PaymentSessionContextProvider = { - make: make$3 + make: make$5 }; var defaultPaymentMethodsManagementElementsContext_options = { @@ -198,10 +302,10 @@ var defaultPaymentMethodsManagementElementsContext = { var paymentMethodsManagementElementsContext = React.createContext(defaultPaymentMethodsManagementElementsContext); -var make$4 = paymentMethodsManagementElementsContext.Provider; +var make$6 = paymentMethodsManagementElementsContext.Provider; var PaymentMethodsManagementElementsContextProvider = { - make: make$4 + make: make$6 }; export { @@ -223,9 +327,17 @@ export { getElement , fetchUpdates , create , + defaultCardForm , defaultElementsContext , elementsContext , ElementsContextProvider , + defaultCardFormContext , + cardFormContext , + CardFormContextProvider , + defaultPaymentMethodsSessionContext , + pendingPaymentMethodsSessionContext , + paymentMethodsSessionContext , + PaymentMethodsSessionContextProvider , paymentMethodsManagementElementsOptionObjMapper , defaultPaymentSessionContext , paymentSessionContext , diff --git a/src/Context.res b/src/Context.res index 4323189..9b18bd9 100644 --- a/src/Context.res +++ b/src/Context.res @@ -61,6 +61,8 @@ type rec elementsType = { fetchUpdates: unit => Promise.t, create: (string, JSON.t) => OrcaJs.paymentElement, // return a react component instead by doing new Payment Element. updateIntent: (unit => promise) => promise, + cardForm: unit => OrcaJs.cardForm, + isReady: bool, } type rec paymentMethodsManagementElementsType = { @@ -192,6 +194,15 @@ let fetchUpdates = () => { let create = (_componentType, _options) => { OrcaJs.defaultPaymentElement } +let defaultCardForm: OrcaJs.cardForm = { + create: (_fieldType, _options) => OrcaJs.defaultFieldHandle, + on: (_str, _func) => (), + confirmPayment: () => Promise.resolve(OrcaJs.sdkNotReadyError()), + deinit: () => (), + update: _x => (), + fields: ref(Dict.make()->JSON.Encode.object), +} + let defaultElementsContext: elementsType = { options: { fonts: [], @@ -205,6 +216,8 @@ let defaultElementsContext: elementsType = { fetchUpdates, create, updateIntent: _ => Promise.resolve(Dict.make()->JSON.Encode.object), + cardForm: () => defaultCardForm, + isReady: false, } let elementsContext = React.createContext(defaultElementsContext) @@ -213,6 +226,55 @@ module ElementsContextProvider = { let make = React.Context.provider(elementsContext) } +type cardFormContextType = { + createField: (string, JSON.t) => OrcaJs.fieldHandle, + confirmPayment: unit => Promise.t, + tokenize: unit => Promise.t, + on: (string, JSON.t => unit) => unit, + update: JSON.t => unit, + deinit: unit => unit, + getFields: unit => JSON.t, + isReady: bool, +} + +let defaultCardFormContext: cardFormContextType = { + createField: (_fieldType, _options) => OrcaJs.defaultFieldHandle, + confirmPayment: () => Promise.resolve(OrcaJs.sdkNotReadyError()), + tokenize: () => Promise.resolve(OrcaJs.sdkNotReadyError()), + on: (_str, _func) => (), + update: _x => (), + deinit: () => (), + getFields: () => Dict.make()->JSON.Encode.object, + isReady: false, +} + +let cardFormContext = React.createContext(defaultCardFormContext) + +module CardFormContextProvider = { + let make = React.Context.provider(cardFormContext) +} + +type paymentMethodsSessionContextType = { + session: option, + isPresent: bool, +} + +let defaultPaymentMethodsSessionContext: paymentMethodsSessionContextType = { + session: None, + isPresent: false, +} + +let pendingPaymentMethodsSessionContext: paymentMethodsSessionContextType = { + ...defaultPaymentMethodsSessionContext, + isPresent: true, +} + +let paymentMethodsSessionContext = React.createContext(defaultPaymentMethodsSessionContext) + +module PaymentMethodsSessionContextProvider = { + let make = React.Context.provider(paymentMethodsSessionContext) +} + let paymentMethodsManagementElementsOptionObjMapper = (options: JSON.t) => { let dict = options->JSON.Decode.object->Option.getOr(Dict.make()) { diff --git a/src/Index.bs.js b/src/Index.bs.js index 05bde87..29724e4 100644 --- a/src/Index.bs.js +++ b/src/Index.bs.js @@ -3,18 +3,23 @@ import * as React from "react"; import * as CardCVC from "./components/CardCVC.bs.js"; import * as Context from "./Context.bs.js"; +import * as CardForm from "./components/CardForm.bs.js"; import * as Elements from "./components/Elements.bs.js"; import * as CardExpiry from "./components/CardExpiry.bs.js"; import * as CardNumber from "./components/CardNumber.bs.js"; import * as CardElement from "./components/CardElement.bs.js"; import * as PazeElement from "./components/PazeElement.bs.js"; +import * as CardCvcField from "./components/CardCvcField.bs.js"; import * as HyperElements from "./components/HyperElements.bs.js"; import * as PayPalElement from "./components/PayPalElement.bs.js"; import * as PaymentElement from "./components/PaymentElement.bs.js"; import * as ApplePayElement from "./components/ApplePayElement.bs.js"; +import * as CardExpiryField from "./components/CardExpiryField.bs.js"; +import * as CardNumberField from "./components/CardNumberField.bs.js"; import * as GooglePayElement from "./components/GooglePayElement.bs.js"; import * as ExpressCheckoutElement from "./components/ExpressCheckoutElement.bs.js"; import * as HyperManagementElements from "./components/HyperManagementElements.bs.js"; +import * as HyperPaymentMethodsSession from "./components/HyperPaymentMethodsSession.bs.js"; import * as PaymentMethodsManagementElement from "./components/PaymentMethodsManagementElement.bs.js"; function useHyper() { @@ -39,6 +44,14 @@ function useWidgets() { return React.useContext(Context.elementsContext); } +function useCardForm() { + return React.useContext(Context.cardFormContext); +} + +function usePaymentMethodsSession() { + return React.useContext(Context.paymentMethodsSessionContext); +} + function useElements() { console.warn("useElements() is deprecated. Use useWidgets() instead"); return React.useContext(Context.elementsContext); @@ -48,6 +61,10 @@ var Elements$1 = Elements.make; var HyperElements$1 = HyperElements.make; +var HyperPaymentMethodsSession$1 = HyperPaymentMethodsSession.make; + +var CardForm$1 = CardForm.make; + var PaymentElement$1 = PaymentElement.make; var UnifiedCheckout = PaymentElement.make; @@ -68,6 +85,12 @@ var CardExpiryElement = CardExpiry.make; var CardExpiryWidget = CardExpiry.make; +var CardNumberField$1 = CardNumberField.make; + +var CardExpiryField$1 = CardExpiryField.make; + +var CardCVCField = CardCvcField.make; + var GooglePayElement$1 = GooglePayElement.make; var ApplePayElement$1 = ApplePayElement.make; @@ -88,9 +111,13 @@ export { useWidgets , useElements , usePaymentSession , + useCardForm , + usePaymentMethodsSession , initPaymentSession , Elements$1 as Elements, HyperElements$1 as HyperElements, + HyperPaymentMethodsSession$1 as HyperPaymentMethodsSession, + CardForm$1 as CardForm, PaymentElement$1 as PaymentElement, UnifiedCheckout , CardElement$1 as CardElement, @@ -101,6 +128,9 @@ export { CardCVCWidget , CardExpiryElement , CardExpiryWidget , + CardNumberField$1 as CardNumberField, + CardExpiryField$1 as CardExpiryField, + CardCVCField , GooglePayElement$1 as GooglePayElement, ApplePayElement$1 as ApplePayElement, PazeElement$1 as PazeElement, diff --git a/src/Index.res b/src/Index.res index 57cbddf..cf04679 100644 --- a/src/Index.res +++ b/src/Index.res @@ -28,6 +28,12 @@ let initPaymentSession = async (hyperPromise: promise, op let useWidgets = () => { React.useContext(Context.elementsContext) } +let useCardForm = () => { + React.useContext(Context.cardFormContext) +} +let usePaymentMethodsSession = () => { + React.useContext(Context.paymentMethodsSessionContext) +} let useElements = () => { Console.warn("useElements() is deprecated. Use useWidgets() instead") useWidgets() @@ -37,6 +43,10 @@ let \"Elements" = Elements.make let \"HyperElements" = HyperElements.make +let \"HyperPaymentMethodsSession" = HyperPaymentMethodsSession.make + +let \"CardForm" = CardForm.make + let \"PaymentElement" = PaymentElement.make let \"UnifiedCheckout" = PaymentElement.make @@ -52,6 +62,12 @@ let \"CardCVCWidget" = CardCVC.make let \"CardExpiryElement" = CardExpiry.make let \"CardExpiryWidget" = CardExpiry.make +let \"CardNumberField" = CardNumberField.make + +let \"CardExpiryField" = CardExpiryField.make + +let \"CardCVCField" = CardCvcField.make + let \"GooglePayElement" = GooglePayElement.make let \"ApplePayElement" = ApplePayElement.make diff --git a/src/Index.resi b/src/Index.resi index 32c2469..d80290e 100644 --- a/src/Index.resi +++ b/src/Index.resi @@ -12,6 +12,8 @@ let useStripe: unit => Context.switchContextType let useWidgets: unit => Context.elementsType let useElements: unit => Context.elementsType let usePaymentSession: unit => Context.paymentSessionContextType +let useCardForm: unit => Context.cardFormContextType +let usePaymentMethodsSession: unit => Context.paymentMethodsSessionContextType let initPaymentSession: ( promise, RescriptCore.JSON.t, @@ -26,6 +28,12 @@ let \"HyperElements": HyperElements.props< RescriptCore.Promise.t, RescriptCore.JSON.t, > => React.element +let \"HyperPaymentMethodsSession": HyperPaymentMethodsSession.props< + React.element, + RescriptCore.Promise.t, + RescriptCore.JSON.t, +> => React.element +let \"CardForm": React.component let \"PaymentElement": React.component let \"UnifiedCheckout": React.component let \"CardElement": CardElement.props< @@ -116,6 +124,9 @@ let \"CardExpiryWidget": CardExpiry.props< option => unit>, unit => RescriptCore.Promise.t, > => React.element +let \"CardNumberField": React.component +let \"CardExpiryField": React.component +let \"CardCVCField": React.component let \"GooglePayElement": GooglePayElement.props< string, RescriptCore.JSON.t, diff --git a/src/OrcaJs.bs.js b/src/OrcaJs.bs.js index 249f0d4..574a0c4 100644 --- a/src/OrcaJs.bs.js +++ b/src/OrcaJs.bs.js @@ -56,8 +56,73 @@ var defaultPaymentElement = { onSDKHandleClick: defaultPaymentElement_onSDKHandleClick }; +function defaultFieldHandle_mount(_string) { + +} + +function defaultFieldHandle_unmount() { + +} + +function defaultFieldHandle_destroy() { + +} + +function defaultFieldHandle_update(_x) { + +} + +function defaultFieldHandle_focus() { + +} + +function defaultFieldHandle_blur() { + +} + +function defaultFieldHandle_clear() { + +} + +function defaultFieldHandle_on(_str, _func) { + +} + +var defaultFieldHandle = { + mount: defaultFieldHandle_mount, + unmount: defaultFieldHandle_unmount, + destroy: defaultFieldHandle_destroy, + update: defaultFieldHandle_update, + focus: defaultFieldHandle_focus, + blur: defaultFieldHandle_blur, + clear: defaultFieldHandle_clear, + on: defaultFieldHandle_on +}; + +function makeErrorResponse(code, message) { + var errorDict = {}; + errorDict["code"] = code; + errorDict["message"] = message; + var resultDict = {}; + resultDict["status"] = "error"; + resultDict["error"] = errorDict; + return resultDict; +} + +function sdkNotReadyError() { + return makeErrorResponse("sdk_not_ready", "Hyper is not initialized yet — the card form is not ready"); +} + +function unsupportedOnSurfaceError(method, surface, alternative) { + return makeErrorResponse("unsupported_on_surface", method + "() is not available on the " + surface + " surface — use " + alternative + "()"); +} + export { This , defaultPaymentElement , + defaultFieldHandle , + makeErrorResponse , + sdkNotReadyError , + unsupportedOnSurfaceError , } /* No side effect */ diff --git a/src/OrcaJs.res b/src/OrcaJs.res index 81adcc1..5c226f5 100644 --- a/src/OrcaJs.res +++ b/src/OrcaJs.res @@ -42,12 +42,61 @@ let defaultPaymentElement = { onSDKHandleClick: _ => (), } +type fieldHandle = { + mount: string => unit, + unmount: unit => unit, + destroy: unit => unit, + update: JSON.t => unit, + focus: unit => unit, + blur: unit => unit, + clear: unit => unit, + on: (string, JSON.t => unit) => unit, +} + +let defaultFieldHandle = { + mount: _string => (), + unmount: () => (), + destroy: () => (), + update: _x => (), + focus: () => (), + blur: () => (), + clear: () => (), + on: (_str, _func) => (), +} + +type cardForm = { + create: (string, JSON.t) => fieldHandle, + on: (string, JSON.t => unit) => unit, + confirmPayment: unit => Promise.t, + deinit: unit => unit, + update: JSON.t => unit, + fields: ref, +} + +type vaultCardForm = { + create: (string, JSON.t) => fieldHandle, + on: (string, JSON.t => unit) => unit, + tokenize: unit => Promise.t, + deinit: unit => unit, + update: JSON.t => unit, + fields: ref, +} + +type paymentMethodsSession = { + cardForm: unit => vaultCardForm, + update: JSON.t => unit, + on: (string, JSON.t => unit) => unit, + deinit: unit => unit, + fields: ref, +} + type element = { getElement: string => option, update: JSON.t => unit, fetchUpdates: unit => Promise.t, create: (string, JSON.t) => paymentElement, updateIntent: (unit => promise) => promise, + cardForm: unit => cardForm, } type confirmParams = {return_url: string} @@ -80,6 +129,7 @@ type switchInstance = { completeUpdateIntent: string => promise, initiateUpdateIntent: unit => promise, confirmTokenization: JSON.t => Promise.t, + paymentMethodsSession: JSON.t => paymentMethodsSession, } type paymentElementProps = { @@ -95,3 +145,59 @@ type paymentElementProps = { } type paymentElementHandle = {confirmPayment: JSON.t => Promise.t} +type cardFormHandle = { + confirmPayment: unit => Promise.t, + tokenize: unit => Promise.t, + update: JSON.t => unit, + deinit: unit => unit, + on: (string, JSON.t => unit) => unit, + getFields: unit => JSON.t, +} + +type cardFieldHandle = { + mount: string => unit, + unmount: unit => unit, + destroy: unit => unit, + update: JSON.t => unit, + focus: unit => unit, + blur: unit => unit, + clear: unit => unit, + on: (string, JSON.t => unit) => unit, +} + +type cardFormProps = { + children: React.element, + onChange: option unit>, + onReady: option unit>, +} + +type cardFieldProps = { + id: option, + options: option, + onChange: option unit>, + onReady: option unit>, + onFocus: option unit>, + onBlur: option unit>, +} + +let makeErrorResponse = (code: string, message: string): JSON.t => { + let errorDict = Dict.make() + errorDict->Dict.set("code", code->JSON.Encode.string) + errorDict->Dict.set("message", message->JSON.Encode.string) + let resultDict = Dict.make() + resultDict->Dict.set("status", "error"->JSON.Encode.string) + resultDict->Dict.set("error", errorDict->JSON.Encode.object) + resultDict->JSON.Encode.object +} + +let sdkNotReadyError = (): JSON.t => + makeErrorResponse( + "sdk_not_ready", + "Hyper is not initialized yet — the card form is not ready", + ) + +let unsupportedOnSurfaceError = (~method: string, ~surface: string, ~alternative: string): JSON.t => + makeErrorResponse( + "unsupported_on_surface", + `${method}() is not available on the ${surface} surface — use ${alternative}()`, + ) diff --git a/src/components/CardCvcField.bs.js b/src/components/CardCvcField.bs.js new file mode 100644 index 0000000..2b4097e --- /dev/null +++ b/src/components/CardCvcField.bs.js @@ -0,0 +1,24 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + +import * as React from "react"; +import * as Caml_option from "rescript/lib/es6/caml_option.js"; +import * as CardFieldWrapper from "./CardFieldWrapper.bs.js"; +import * as JsxRuntime from "react/jsx-runtime"; + +var make = React.forwardRef(function (param, imperativeRef) { + return JsxRuntime.jsx(CardFieldWrapper.make, { + fieldType: "cardCvc", + id: param.id, + options: param.options, + onChange: param.onChange, + onReady: param.onReady, + onFocus: param.onFocus, + onBlur: param.onBlur, + imperativeRef: Caml_option.some(imperativeRef) + }); + }); + +export { + make , +} +/* make Not a pure module */ diff --git a/src/components/CardCvcField.res b/src/components/CardCvcField.res new file mode 100644 index 0000000..b86703f --- /dev/null +++ b/src/components/CardCvcField.res @@ -0,0 +1,24 @@ +open OrcaJs + +let make = React.forwardRef(( + { + id, + options, + onChange, + onReady, + onFocus, + onBlur, + }: cardFieldProps, + imperativeRef, +) => { + +}) diff --git a/src/components/CardExpiryField.bs.js b/src/components/CardExpiryField.bs.js new file mode 100644 index 0000000..a956703 --- /dev/null +++ b/src/components/CardExpiryField.bs.js @@ -0,0 +1,24 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + +import * as React from "react"; +import * as Caml_option from "rescript/lib/es6/caml_option.js"; +import * as CardFieldWrapper from "./CardFieldWrapper.bs.js"; +import * as JsxRuntime from "react/jsx-runtime"; + +var make = React.forwardRef(function (param, imperativeRef) { + return JsxRuntime.jsx(CardFieldWrapper.make, { + fieldType: "cardExpiry", + id: param.id, + options: param.options, + onChange: param.onChange, + onReady: param.onReady, + onFocus: param.onFocus, + onBlur: param.onBlur, + imperativeRef: Caml_option.some(imperativeRef) + }); + }); + +export { + make , +} +/* make Not a pure module */ diff --git a/src/components/CardExpiryField.res b/src/components/CardExpiryField.res new file mode 100644 index 0000000..c45b02c --- /dev/null +++ b/src/components/CardExpiryField.res @@ -0,0 +1,24 @@ +open OrcaJs + +let make = React.forwardRef(( + { + id, + options, + onChange, + onReady, + onFocus, + onBlur, + }: cardFieldProps, + imperativeRef, +) => { + +}) diff --git a/src/components/CardFieldWrapper.bs.js b/src/components/CardFieldWrapper.bs.js new file mode 100644 index 0000000..c0fa735 --- /dev/null +++ b/src/components/CardFieldWrapper.bs.js @@ -0,0 +1,128 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + +import * as React from "react"; +import * as Context from "../Context.bs.js"; +import * as Caml_option from "rescript/lib/es6/caml_option.js"; +import * as Core__Option from "@rescript/core/src/Core__Option.bs.js"; +import * as JsxRuntime from "react/jsx-runtime"; + +function CardFieldWrapper(props) { + var __imperativeRef = props.imperativeRef; + var onBlur = props.onBlur; + var onFocus = props.onFocus; + var onReady = props.onReady; + var onChange = props.onChange; + var fieldType = props.fieldType; + var imperativeRef = __imperativeRef !== undefined ? Caml_option.valFromOption(__imperativeRef) : null; + var cardFormCtx = React.useContext(Context.cardFormContext); + var divRef = React.useRef(null); + var handleRef = React.useRef(undefined); + var didMountRef = React.useRef(false); + var resolvedId = Core__Option.getOr(props.id, fieldType); + var containerId = "hyper-card-field-" + resolvedId; + var resolvedOptions = Core__Option.getOr(props.options, {}); + var serializedOptions = JSON.stringify(resolvedOptions); + var bindCallbacks = function (handle) { + Core__Option.forEach(onChange, (function (cb) { + handle.on("change", cb); + })); + Core__Option.forEach(onReady, (function (cb) { + handle.on("ready", cb); + })); + Core__Option.forEach(onFocus, (function (cb) { + handle.on("focus", cb); + })); + Core__Option.forEach(onBlur, (function (cb) { + handle.on("blur", cb); + })); + }; + React.useEffect((function () { + if (!cardFormCtx.isReady) { + return ; + } + var existingHandle = handleRef.current; + var handle; + if (existingHandle !== undefined) { + handle = existingHandle; + } else { + var createdHandle = cardFormCtx.createField(fieldType, resolvedOptions); + handleRef.current = createdHandle; + handle = createdHandle; + } + bindCallbacks(handle); + handle.mount("#" + containerId); + return (function () { + handle.unmount(); + }); + }), [ + cardFormCtx.isReady, + containerId + ]); + React.useEffect(function () { + Core__Option.forEach(handleRef.current, bindCallbacks); + }); + React.useEffect((function () { + if (didMountRef.current) { + Core__Option.forEach(handleRef.current, (function (handle) { + handle.update(resolvedOptions); + })); + } else { + didMountRef.current = true; + } + }), [serializedOptions]); + React.useImperativeHandle(imperativeRef, (function () { + return { + mount: (function (selector) { + Core__Option.forEach(handleRef.current, (function (handle) { + handle.mount(selector); + })); + }), + unmount: (function () { + Core__Option.forEach(handleRef.current, (function (handle) { + handle.unmount(); + })); + }), + destroy: (function () { + Core__Option.forEach(handleRef.current, (function (handle) { + handle.destroy(); + })); + }), + update: (function (updatedOptions) { + Core__Option.forEach(handleRef.current, (function (handle) { + handle.update(updatedOptions); + })); + }), + focus: (function () { + Core__Option.forEach(handleRef.current, (function (handle) { + handle.focus(); + })); + }), + blur: (function () { + Core__Option.forEach(handleRef.current, (function (handle) { + handle.blur(); + })); + }), + clear: (function () { + Core__Option.forEach(handleRef.current, (function (handle) { + handle.clear(); + })); + }), + on: (function (eventName, cb) { + Core__Option.forEach(handleRef.current, (function (handle) { + handle.on(eventName, cb); + })); + }) + }; + }), []); + return JsxRuntime.jsx("div", { + ref: Caml_option.some(divRef), + id: containerId + }); +} + +var make = CardFieldWrapper; + +export { + make , +} +/* react Not a pure module */ diff --git a/src/components/CardFieldWrapper.res b/src/components/CardFieldWrapper.res new file mode 100644 index 0000000..51a322d --- /dev/null +++ b/src/components/CardFieldWrapper.res @@ -0,0 +1,75 @@ +open OrcaJs + +@react.component +let make = ( + ~fieldType: string, + ~id: option, + ~options: option, + ~onChange: option unit>, + ~onReady: option unit>, + ~onFocus: option unit>, + ~onBlur: option unit>, + ~imperativeRef: Nullable.t>=Nullable.null, +) => { + let cardFormCtx = React.useContext(Context.cardFormContext) + let divRef = React.useRef(Nullable.null) + let handleRef = React.useRef(None) + let didMountRef = React.useRef(false) + + let resolvedId = id->Option.getOr(fieldType) + let containerId = `hyper-card-field-${resolvedId}` + let resolvedOptions = options->Option.getOr(Dict.make()->JSON.Encode.object) + let serializedOptions = resolvedOptions->JSON.stringify + + let bindCallbacks = (handle: fieldHandle) => { + onChange->Option.forEach(cb => handle.on("change", cb)) + onReady->Option.forEach(cb => handle.on("ready", cb)) + onFocus->Option.forEach(cb => handle.on("focus", cb)) + onBlur->Option.forEach(cb => handle.on("blur", cb)) + } + + React.useEffect(() => { + if cardFormCtx.isReady { + let handle = switch handleRef.current { + | Some(existingHandle) => existingHandle + | None => + let createdHandle = cardFormCtx.createField(fieldType, resolvedOptions) + handleRef.current = Some(createdHandle) + createdHandle + } + bindCallbacks(handle) + handle.mount("#" ++ containerId) + Some(() => handle.unmount()) + } else { + None + } + }, (cardFormCtx.isReady, containerId)) + + React.useEffectOnEveryRender(() => { + handleRef.current->Option.forEach(bindCallbacks) + None + }) + + React.useEffect(() => { + if didMountRef.current { + handleRef.current->Option.forEach(handle => handle.update(resolvedOptions)) + } else { + didMountRef.current = true + } + None + }, [serializedOptions]) + + React.useImperativeHandle0(imperativeRef, (): cardFieldHandle => { + mount: selector => handleRef.current->Option.forEach(handle => handle.mount(selector)), + unmount: () => handleRef.current->Option.forEach(handle => handle.unmount()), + destroy: () => handleRef.current->Option.forEach(handle => handle.destroy()), + update: updatedOptions => + handleRef.current->Option.forEach(handle => handle.update(updatedOptions)), + focus: () => handleRef.current->Option.forEach(handle => handle.focus()), + blur: () => handleRef.current->Option.forEach(handle => handle.blur()), + clear: () => handleRef.current->Option.forEach(handle => handle.clear()), + on: (eventName, cb) => handleRef.current->Option.forEach(handle => handle.on(eventName, cb)), + }) + +
ReactDOM.Ref.domRef} id={containerId} /> +} diff --git a/src/components/CardForm.bs.js b/src/components/CardForm.bs.js new file mode 100644 index 0000000..eb29af2 --- /dev/null +++ b/src/components/CardForm.bs.js @@ -0,0 +1,100 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + +import * as React from "react"; +import * as OrcaJs from "../OrcaJs.bs.js"; +import * as Context from "../Context.bs.js"; +import * as Core__Option from "@rescript/core/src/Core__Option.bs.js"; +import * as JsxRuntime from "react/jsx-runtime"; + +var make = React.forwardRef(function (param, imperativeRef) { + var onReady = param.onReady; + var onChange = param.onChange; + var elementsState = React.useContext(Context.elementsContext); + var sessionState = React.useContext(Context.paymentMethodsSessionContext); + var createdRef = React.useRef(false); + var match = React.useState(function () { + return Context.defaultCardFormContext; + }); + var setCardFormValue = match[1]; + var cardFormValue = match[0]; + React.useEffect((function () { + if (!createdRef.current) { + if (sessionState.isPresent) { + Core__Option.forEach(sessionState.session, (function (session) { + var group = session.cardForm(); + createdRef.current = true; + setCardFormValue(function (param) { + return { + createField: group.create, + confirmPayment: (function () { + return Promise.resolve(OrcaJs.unsupportedOnSurfaceError("confirmPayment", "vault", "tokenize")); + }), + tokenize: group.tokenize, + on: group.on, + update: group.update, + deinit: group.deinit, + getFields: (function () { + return group.fields.contents; + }), + isReady: true + }; + }); + })); + } else if (elementsState.isReady) { + var group = elementsState.cardForm(); + createdRef.current = true; + setCardFormValue(function (param) { + return { + createField: group.create, + confirmPayment: group.confirmPayment, + tokenize: (function () { + return Promise.resolve(OrcaJs.unsupportedOnSurfaceError("tokenize", "payments", "confirmPayment")); + }), + on: group.on, + update: group.update, + deinit: group.deinit, + getFields: (function () { + return group.fields.contents; + }), + isReady: true + }; + }); + } + + } + + }), [ + elementsState, + sessionState + ]); + React.useEffect(function () { + if (cardFormValue.isReady) { + Core__Option.forEach(onChange, (function (cb) { + cardFormValue.on("change", cb); + })); + Core__Option.forEach(onReady, (function (cb) { + cardFormValue.on("ready", cb); + })); + } + + }); + React.useImperativeHandle(imperativeRef, (function () { + return { + confirmPayment: cardFormValue.confirmPayment, + tokenize: cardFormValue.tokenize, + update: cardFormValue.update, + deinit: cardFormValue.deinit, + on: cardFormValue.on, + getFields: cardFormValue.getFields + }; + }), [cardFormValue]); + return JsxRuntime.jsx(Context.CardFormContextProvider.make, { + value: cardFormValue, + children: param.children + }); + }); + +export { + make , +} +/* make Not a pure module */ diff --git a/src/components/CardForm.res b/src/components/CardForm.res new file mode 100644 index 0000000..9dabd96 --- /dev/null +++ b/src/components/CardForm.res @@ -0,0 +1,87 @@ +open OrcaJs + +let make = React.forwardRef(( + {children, onChange, onReady}: cardFormProps, + imperativeRef, +) => { + let elementsState = React.useContext(Context.elementsContext) + let sessionState = React.useContext(Context.paymentMethodsSessionContext) + let createdRef = React.useRef(false) + let (cardFormValue, setCardFormValue) = React.useState(() => Context.defaultCardFormContext) + + React.useEffect(() => { + if !createdRef.current { + if sessionState.isPresent { + sessionState.session->Option.forEach( + session => { + let group = session.cardForm() + createdRef.current = true + setCardFormValue(_ => { + createField: group.create, + confirmPayment: () => + Promise.resolve( + unsupportedOnSurfaceError( + ~method="confirmPayment", + ~surface="vault", + ~alternative="tokenize", + ), + ), + tokenize: group.tokenize, + on: group.on, + update: group.update, + deinit: group.deinit, + getFields: () => group.fields.contents, + isReady: true, + }) + }, + ) + } else if elementsState.isReady { + let group = elementsState.cardForm() + createdRef.current = true + setCardFormValue(_ => { + createField: group.create, + confirmPayment: group.confirmPayment, + tokenize: () => + Promise.resolve( + unsupportedOnSurfaceError( + ~method="tokenize", + ~surface="payments", + ~alternative="confirmPayment", + ), + ), + on: group.on, + update: group.update, + deinit: group.deinit, + getFields: () => group.fields.contents, + isReady: true, + }) + } + } + None + }, (elementsState, sessionState)) + + React.useEffectOnEveryRender(() => { + if cardFormValue.isReady { + onChange->Option.forEach(cb => cardFormValue.on("change", cb)) + onReady->Option.forEach(cb => cardFormValue.on("ready", cb)) + } + None + }) + + React.useImperativeHandle( + imperativeRef, + (): cardFormHandle => { + confirmPayment: cardFormValue.confirmPayment, + tokenize: cardFormValue.tokenize, + update: cardFormValue.update, + deinit: cardFormValue.deinit, + on: cardFormValue.on, + getFields: cardFormValue.getFields, + }, + [cardFormValue], + ) + + + {children} + +}) diff --git a/src/components/CardNumberField.bs.js b/src/components/CardNumberField.bs.js new file mode 100644 index 0000000..b213591 --- /dev/null +++ b/src/components/CardNumberField.bs.js @@ -0,0 +1,24 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + +import * as React from "react"; +import * as Caml_option from "rescript/lib/es6/caml_option.js"; +import * as CardFieldWrapper from "./CardFieldWrapper.bs.js"; +import * as JsxRuntime from "react/jsx-runtime"; + +var make = React.forwardRef(function (param, imperativeRef) { + return JsxRuntime.jsx(CardFieldWrapper.make, { + fieldType: "cardNumber", + id: param.id, + options: param.options, + onChange: param.onChange, + onReady: param.onReady, + onFocus: param.onFocus, + onBlur: param.onBlur, + imperativeRef: Caml_option.some(imperativeRef) + }); + }); + +export { + make , +} +/* make Not a pure module */ diff --git a/src/components/CardNumberField.res b/src/components/CardNumberField.res new file mode 100644 index 0000000..3ea2040 --- /dev/null +++ b/src/components/CardNumberField.res @@ -0,0 +1,24 @@ +open OrcaJs + +let make = React.forwardRef(( + { + id, + options, + onChange, + onReady, + onFocus, + onBlur, + }: cardFieldProps, + imperativeRef, +) => { + +}) diff --git a/src/components/Elements.bs.js b/src/components/Elements.bs.js index dcf5dd4..3fd1520 100644 --- a/src/components/Elements.bs.js +++ b/src/components/Elements.bs.js @@ -31,13 +31,16 @@ function Elements(props) { var newElemValues_fetchUpdates = orcaElementsConfig.fetchUpdates; var newElemValues_create = orcaElementsConfig.create; var newElemValues_updateIntent = orcaElementsConfig.updateIntent; + var newElemValues_cardForm = orcaElementsConfig.cardForm; var newElemValues = { options: elementOptions, update: newElemValues_update, getElement: newElemValues_getElement, fetchUpdates: newElemValues_fetchUpdates, create: newElemValues_create, - updateIntent: newElemValues_updateIntent + updateIntent: newElemValues_updateIntent, + cardForm: newElemValues_cardForm, + isReady: true }; var switchValClone_clientSecret = elementOptions.clientSecret; var switchValClone_confirmPayment = switchInstance.confirmPayment; diff --git a/src/components/Elements.res b/src/components/Elements.res index 5685711..27c3c0e 100644 --- a/src/components/Elements.res +++ b/src/components/Elements.res @@ -15,6 +15,8 @@ let make = (~children, ~stripe: Promise.t, ~options: JSON fetchUpdates: orcaElementsConfig.fetchUpdates, create: orcaElementsConfig.create, updateIntent: orcaElementsConfig.updateIntent, + cardForm: orcaElementsConfig.cardForm, + isReady: true, } let switchValClone: Context.switchContextType = { confirmPayment: switchInstance.confirmPayment, diff --git a/src/components/HyperElements.bs.js b/src/components/HyperElements.bs.js index 560f24d..5937a77 100644 --- a/src/components/HyperElements.bs.js +++ b/src/components/HyperElements.bs.js @@ -35,13 +35,16 @@ function HyperElements(props) { var newElemValues_fetchUpdates = orcaElementsConfig.fetchUpdates; var newElemValues_create = orcaElementsConfig.create; var newElemValues_updateIntent = orcaElementsConfig.updateIntent; + var newElemValues_cardForm = orcaElementsConfig.cardForm; var newElemValues = { options: elementOptions, update: newElemValues_update, getElement: newElemValues_getElement, fetchUpdates: newElemValues_fetchUpdates, create: newElemValues_create, - updateIntent: newElemValues_updateIntent + updateIntent: newElemValues_updateIntent, + cardForm: newElemValues_cardForm, + isReady: true }; var switchValClone_clientSecret = elementOptions.clientSecret; var switchValClone_confirmPayment = switchInstance.confirmPayment; diff --git a/src/components/HyperElements.res b/src/components/HyperElements.res index 9ebc26a..1e2405a 100644 --- a/src/components/HyperElements.res +++ b/src/components/HyperElements.res @@ -18,6 +18,8 @@ let make = (~children, ~hyper: Promise.t, ~options: 'a) = fetchUpdates: orcaElementsConfig.fetchUpdates, create: orcaElementsConfig.create, updateIntent: orcaElementsConfig.updateIntent, + cardForm: orcaElementsConfig.cardForm, + isReady: true, } let switchValClone: Context.switchContextType = { confirmPayment: switchInstance.confirmPayment, diff --git a/src/components/HyperPaymentMethodsSession.bs.js b/src/components/HyperPaymentMethodsSession.bs.js new file mode 100644 index 0000000..db643d8 --- /dev/null +++ b/src/components/HyperPaymentMethodsSession.bs.js @@ -0,0 +1,50 @@ +// Generated by ReScript, PLEASE EDIT WITH CARE + +import * as Utils from "../Utils.bs.js"; +import * as React from "react"; +import * as Context from "../Context.bs.js"; +import * as Core__Promise from "@rescript/core/src/Core__Promise.bs.js"; +import * as JsxRuntime from "react/jsx-runtime"; + +function HyperPaymentMethodsSession(props) { + var options = props.options; + var hyper = props.hyper; + var match = React.useState(function () { + return Context.pendingPaymentMethodsSessionContext; + }); + var setSessionState = match[1]; + React.useEffect((function () { + Core__Promise.$$catch(Promise.all([ + hyper, + Utils.normalizeToPromise(options) + ]).then(function (param) { + var session = param[0].paymentMethodsSession(param[1]); + var newSessionValues_session = session; + var newSessionValues = { + session: newSessionValues_session, + isPresent: true + }; + setSessionState(function (param) { + return newSessionValues; + }); + return Promise.resolve(newSessionValues); + }), (function (err) { + console.error("[HyperPaymentMethodsSession] Failed to initialise hyper promise:", err); + return Promise.resolve(Context.pendingPaymentMethodsSessionContext); + })); + }), [ + hyper, + options + ]); + return JsxRuntime.jsx(Context.PaymentMethodsSessionContextProvider.make, { + value: match[0], + children: props.children + }); +} + +var make = HyperPaymentMethodsSession; + +export { + make , +} +/* react Not a pure module */ diff --git a/src/components/HyperPaymentMethodsSession.res b/src/components/HyperPaymentMethodsSession.res new file mode 100644 index 0000000..f05f69b --- /dev/null +++ b/src/components/HyperPaymentMethodsSession.res @@ -0,0 +1,29 @@ +@react.component +let make = (~children, ~hyper: Promise.t, ~options: JSON.t) => { + let (sessionState, setSessionState) = React.useState(() => + Context.pendingPaymentMethodsSessionContext + ) + + React.useEffect(() => { + Promise.all2((hyper, options->Utils.normalizeToPromise)) + ->Promise.then(((switchInstance: OrcaJs.switchInstance, resolvedOptions)) => { + let session = switchInstance.paymentMethodsSession(resolvedOptions) + let newSessionValues: Context.paymentMethodsSessionContextType = { + session: Some(session), + isPresent: true, + } + setSessionState(_ => newSessionValues) + Promise.resolve(newSessionValues) + }) + ->Promise.catch(err => { + Console.error2("[HyperPaymentMethodsSession] Failed to initialise hyper promise:", err) + Promise.resolve(Context.pendingPaymentMethodsSessionContext) + }) + ->ignore + None + }, (hyper, options)) + + + {children} + +}