@tap-payments/connect-v2 0.0.33-test β 0.0.35-test
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +55 -36
- package/build/index.cjs.js +1 -1
- package/build/index.d.ts +25 -9
- package/build/index.esm.js +117 -104
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -98,42 +98,61 @@ You can also use the SDK without a React build setup by including the UMD bundle
|
|
|
98
98
|
|
|
99
99
|
## π§ Props
|
|
100
100
|
|
|
101
|
-
| Prop | Type | Required | Description
|
|
102
|
-
| ----------------------- | ------------------------------------------------------ | -------- |
|
|
103
|
-
| **open** | `boolean` | β
| Controls whether Connect element is open or closed.
|
|
104
|
-
| **publicKey** | `string` | β
| Your public API key provided by Tap Payments.
|
|
105
|
-
| **merchantDomain** | `string` | β
| Merchant's domain (e.g. `https://
|
|
106
|
-
| **scope** | `ConnectScope` | β
| Defines the integration scope
|
|
107
|
-
| **onReady** | `() => void` | β | Called when the app configurations are loaded successfully
|
|
108
|
-
| **onClose** | `() => void` | β | Triggered when the Connect element is closed
|
|
109
|
-
| **onError** | `(
|
|
110
|
-
| **onSuccess** | `(response: Record<string, string \| number>) => void` | β |
|
|
111
|
-
| **theme** | `ConnectTheme` | β |
|
|
112
|
-
| **language** | `ConnectLanguage` | β |
|
|
113
|
-
| **businessCountryCode** | `string` | β |
|
|
114
|
-
| **
|
|
115
|
-
| **
|
|
116
|
-
| **
|
|
117
|
-
| **
|
|
118
|
-
|
|
|
119
|
-
|
|
|
120
|
-
| **
|
|
121
|
-
|
|
|
122
|
-
|
|
|
123
|
-
|
|
|
124
|
-
|
|
|
125
|
-
|
|
|
126
|
-
|
|
|
127
|
-
| **
|
|
128
|
-
| **
|
|
129
|
-
| **
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
|
134
|
-
|
|
|
135
|
-
|
|
|
136
|
-
|
|
|
101
|
+
| Prop | Type | Required | Description |
|
|
102
|
+
| ----------------------- | ------------------------------------------------------ | -------- | ---------------------------------------------------------------------------------------------- |
|
|
103
|
+
| **open** | `boolean` | β
| Controls whether the Connect element is open or closed. |
|
|
104
|
+
| **publicKey** | `string` | β
| Your public API key provided by Tap Payments. |
|
|
105
|
+
| **merchantDomain** | `string` | β
| Merchant's domain (e.g. `https://example.com`). |
|
|
106
|
+
| **scope** | `ConnectScope` | β
| Defines the integration scope. |
|
|
107
|
+
| **onReady** | `() => void` | β | Called when the app configurations are loaded successfully. |
|
|
108
|
+
| **onClose** | `() => void` | β | Triggered when the Connect element is closed. |
|
|
109
|
+
| **onError** | `(error: CustomError) => void` | β | Triggered when an error occurs. |
|
|
110
|
+
| **onSuccess** | `(response: Record<string, string \| number>) => void` | β | Triggered when the flow completes successfully. |
|
|
111
|
+
| **theme** | `ConnectTheme` | β | UI theme configuration. |
|
|
112
|
+
| **language** | `ConnectLanguage` | β | Localization language. |
|
|
113
|
+
| **businessCountryCode** | `string` | β | ISO2 country code of the merchant. |
|
|
114
|
+
| **leadId** | `string` | β | ID to Load an existing lead. |
|
|
115
|
+
| **showBoard** | `boolean` | β | Show merchant board UI. |
|
|
116
|
+
| **boardEditable** | `boolean` | β | Allow merchant board editing. |
|
|
117
|
+
| **platforms** | `string[]` | β | List of merchant platforms. |
|
|
118
|
+
| **features** | `ConnectAppFeatures` | β | UI and behavior customization options. |
|
|
119
|
+
| **paymentProvider** | `ConnectPaymentProvider` | β | Payment provider configuration. |
|
|
120
|
+
| **postUrl** | `string` | β | Endpoint to post collected data to your backend. |
|
|
121
|
+
| **redirectUrl** | `string` | β | Redirect URL after success. |
|
|
122
|
+
| **data** | `string[]` | β | Data modules to collect (e.g. `brand`, `entity`). |
|
|
123
|
+
| **mode** | `ConnectMode` | β | Controls display behavior (page, popup, content). |
|
|
124
|
+
| **notification** | `ConnectNotification` | β | Notification configuration. |
|
|
125
|
+
| **flow** | `ConnectFlows` | β | Specifies a predefined flow to open directly (e.g., `brand`, `entity`, `kyc`, etc.). |
|
|
126
|
+
| **token** | `string` | β | Connect session token. Required when `flow` is provided and the flow is not `board` or `auth`. |
|
|
127
|
+
| **boardId** | `string` | β | Identifier of the board to load. Required when `flow` is set to `board`. |
|
|
128
|
+
| **configToken** | `string` | β | Pre-generated configuration token from backend. |
|
|
129
|
+
| **region** | `ConnectRegions` | β | Region code determining middleware domain. |
|
|
130
|
+
|
|
131
|
+
##### `ConnectAppFeatures`
|
|
132
|
+
|
|
133
|
+
| Field | Type | Description |
|
|
134
|
+
| --------------------- | ------------------------- | ------------------------------ |
|
|
135
|
+
| poweredBy | `boolean` | Show or hide βPowered by Tapβ. |
|
|
136
|
+
| embedded | `boolean` | Enable embedded layout mode. |
|
|
137
|
+
| merchantLogo | `boolean` | Show or hide merchant logo. |
|
|
138
|
+
| closeButton | `boolean` | Display close button. |
|
|
139
|
+
| dialogStartTransition | `ConnectDialogTransition` | Dialog opening animation. |
|
|
140
|
+
| dialogEndTransition | `ConnectDialogTransition` | Dialog closing animation. |
|
|
141
|
+
| dialogEdgeFormat | `ConnectDialogEdgeFormat` | Dialog edge style. |
|
|
142
|
+
|
|
143
|
+
##### `ConnectPaymentProvider`
|
|
144
|
+
|
|
145
|
+
| Field | Type | Required | Description |
|
|
146
|
+
| ------------- | -------- | -------- | --------------------------------- |
|
|
147
|
+
| technologyId | `string` | β
| Payment technology identifier. |
|
|
148
|
+
| institutionId | `string` | β
| Financial institution identifier. |
|
|
149
|
+
|
|
150
|
+
##### `ConnectNotification`
|
|
151
|
+
|
|
152
|
+
| Field | Type | Required | Description |
|
|
153
|
+
| ----- | --------- | -------- | --------------------------- |
|
|
154
|
+
| email | `boolean` | β
| Enable email notifications. |
|
|
155
|
+
| sms | `boolean` | β | Enable SMS notifications. |
|
|
137
156
|
|
|
138
157
|
---
|
|
139
158
|
|
package/build/index.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),f=require("react"),U=require("react-dom");function L(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return n.default=e,Object.freeze(n)}const m=L(f);var v=(e=>(e.PAGE="page",e.POPUP="popup",e.CONTENT="content",e))(v||{}),S=(e=>(e.AUTH="auth",e.MERCHANT="merchant",e))(S||{}),k=(e=>(e.SET_PASSWORD="set_password",e.RESET_PASSWORD="reset_password",e))(k||{}),C=(e=>(e.DARK="dark",e.LIGHT="light",e.DYNAMIC="dynamic",e))(C||{}),j=(e=>(e.AR="ar",e.EN="en",e.DYNAMIC="dynamic",e))(j||{}),_=(e=>(e.STRAIGHT="straight",e.CURVED="curved",e))(_||{}),x=(e=>(e.LEFT="left",e.RIGHT="right",e.UP="up",e.DOWN="down",e))(x||{}),p=(e=>(e.ON_CLOSE="connect:onClose",e.ON_ERROR="connect:onError",e.ON_SUCCESS="connect:onSuccess",e.ON_READY="connect:onReady",e.ON_LOADED="connect:onLoaded",e))(p||{}),h=(e=>(e.CONFIG_TOKEN="config_token",e.THEME="theme",e.LANGUAGE="lang",e))(h||{});const T=({outerStartColor:e="rgba(244, 244, 244, 1)",outerEndColor:n="rgba(238, 238, 238, 1)",innerStartColor:r="rgba(244, 244, 244, 1)",innerEndColor:o="rgba(238, 238, 238, 1)",duration:s=3,toggleAnimation:a=!1})=>t.jsx("div",{style:{position:"relative",width:"135px",height:"135px"},children:t.jsx("div",{style:{position:"absolute",display:"flex",justifyContent:"center",alignItems:"center",width:"100%",height:"100%",opacity:.9},children:t.jsxs("svg",{width:"199",height:"197",viewBox:"0 0 199 197",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t.jsxs("g",{children:[t.jsx("circle",{cx:"89.5",cy:"86.5",r:"67.5",fill:"none",stroke:"url(#strokeGradientOuter_1427_22275)",strokeWidth:"9.6",strokeLinecap:"round",strokeDasharray:"425 125",children:a&&t.jsxs(t.Fragment,{children:[t.jsx("animateTransform",{attributeName:"transform",type:"rotate",from:"0 89.5 86.5",to:"360 89.5 86.5",dur:`${s/3}s`,repeatCount:"indefinite"}),t.jsx("animate",{attributeName:"stroke-dashoffset",values:"0; 425; 425; 0; 0",keyTimes:"0; 0.45; 0.55; 0.9; 1",dur:`${s}s`,repeatCount:"indefinite"})]})}),t.jsx("circle",{cx:"89.5",cy:"86.5",r:"48",fill:"none",stroke:"url(#strokeGradientInner_1427_22275)",strokeWidth:"9.6",strokeLinecap:"round",strokeDasharray:"300 100",children:a&&t.jsxs(t.Fragment,{children:[t.jsx("animateTransform",{attributeName:"transform",type:"rotate",from:"360 89.5 86.5",to:"0 89.5 86.5",dur:`${s/3}s`,repeatCount:"indefinite"}),t.jsx("animate",{attributeName:"stroke-dashoffset",values:"0; -300; -300; 0; 0",keyTimes:"0; 0.45; 0.55; 0.9; 1",dur:`${s}s`,repeatCount:"indefinite"})]})})]}),t.jsxs("defs",{children:[t.jsxs("filter",{id:"filter0_dddi_1427_22275",x:"0.882668",y:"0.899429",width:"198.08",height:"195.314",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB",children:[t.jsx("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),t.jsx("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",result:"hardAlpha"}),t.jsx("feOffset",{dy:"1.68224"}),t.jsx("feGaussianBlur",{stdDeviation:"4.20656"}),t.jsx("feComposite",{in2:"hardAlpha",operator:"out"}),t.jsx("feColorMatrix",{type:"matrix",values:"0 0 0 0 0.824495 0 0 0 0 0.824495 0 0 0 0 0.824495 0 0 0 1 0"}),t.jsx("feBlend",{mode:"normal",in2:"BackgroundImageFix",result:"effect1_dropShadow_1427_22275"}),t.jsx("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",result:"hardAlpha"}),t.jsx("feOffset",{dx:"22.3542",dy:"22.6047"}),t.jsx("feGaussianBlur",{stdDeviation:"9.80447"}),t.jsx("feComposite",{in2:"hardAlpha",operator:"out"}),t.jsx("feColorMatrix",{type:"matrix",values:"0 0 0 0 0.740723 0 0 0 0 0.740723 0 0 0 0 0.740723 0 0 0 0.6 0"}),t.jsx("feBlend",{mode:"normal",in2:"effect1_dropShadow_1427_22275",result:"effect2_dropShadow_1427_22275"}),t.jsx("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",result:"hardAlpha"}),t.jsx("feOffset",{dx:"-6.03352",dy:"-3.01676"}),t.jsx("feGaussianBlur",{stdDeviation:"7.5419"}),t.jsx("feComposite",{in2:"hardAlpha",operator:"out"}),t.jsx("feColorMatrix",{type:"matrix",values:"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.7 0"}),t.jsx("feBlend",{mode:"normal",in2:"effect2_dropShadow_1427_22275",result:"effect3_dropShadow_1427_22275"}),t.jsx("feBlend",{mode:"normal",in:"SourceGraphic",in2:"effect3_dropShadow_1427_22275",result:"shape"}),t.jsx("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",result:"hardAlpha"}),t.jsx("feOffset",{dy:"1.50838"}),t.jsx("feComposite",{in2:"hardAlpha",operator:"arithmetic",k2:"-1",k3:"1"}),t.jsx("feColorMatrix",{type:"matrix",values:"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0"}),t.jsx("feBlend",{mode:"normal",in2:"shape",result:"effect4_innerShadow_1427_22275"})]}),t.jsxs("linearGradient",{id:"strokeGradientOuter_1427_22275",x1:"89.5",y1:"19",x2:"89.5",y2:"154",gradientUnits:"userSpaceOnUse",children:[t.jsx("stop",{stopColor:e}),t.jsx("stop",{offset:"1",stopColor:n})]}),t.jsxs("linearGradient",{id:"strokeGradientInner_1427_22275",x1:"89.4991",y1:"38.2849",x2:"89.4991",y2:"134.713",gradientUnits:"userSpaceOnUse",children:[t.jsx("stop",{stopColor:r}),t.jsx("stop",{offset:"1",stopColor:o})]})]})]})})}),D=f.memo(T),A=f.createContext({}),g=()=>f.useContext(A);function G({children:e,props:n}){const[r,o]=f.useState(!1),s=i=>{o(i)},a=()=>{o(!1)};return t.jsx(A.Provider,{value:{...n,onLoadingHandler:s,loading:r,onLoaded:a},children:e})}const P="https://connect-mw.dev.tap.company/middleware/v3/connect",M="https://connect-mw.dev.tap.company/middleware/v3/connect",B="https://connect-mw.dev.tap.company/middleware/v3/connect",F="tap-connect-sdk-iframe",y="https://connect.alpha.tap.company",$=({src:e})=>{const{loading:n}=g();return t.jsxs(t.Fragment,{children:[n&&t.jsx(D,{toggleAnimation:!0}),e&&t.jsx("iframe",{id:F,title:"connect",src:e,style:{width:"100%",height:"100%",border:"none",position:"absolute",top:0,left:0}})]})};var W=function(e){var n,r;return((r=(n=e==null?void 0:e.response)===null||n===void 0?void 0:n.data)===null||r===void 0?void 0:r.errors)!==void 0},H=function(e){return e instanceof Error},K=function(e){return typeof e=="string"},Y=function(e){try{var n=e.response.data.errors,r=n[0],o=r.description,s=r.code;return{message:o,code:s}}catch(a){return{message:a.message,code:"UNKNOWN"}}},q=function(e){try{var n=e.message,r=n.split("::"),o=r[0],s=r[1];return{message:s,code:o}}catch(a){return{message:a.message,code:"UNKNOWN"}}},z=function(e){try{var n=e.split("::"),r=n[0],o=n[1];return{message:o,code:r}}catch(s){return{message:s,code:"UNKNOWN"}}},V=function(){function e(n){if(Object.defineProperty(this,"code",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"message",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),W(n)){var r=Y(n);this.code=r.code,this.message=r.message}else if(H(n)){var r=q(n);this.code=r.code,this.message=r.message}else if(K(n)){var r=z(n);this.code=r.code,this.message=r.message}else this.code="UNKNOWN",this.message="Unknown error"}return Object.defineProperty(e.prototype,"getCode",{enumerable:!1,configurable:!0,writable:!0,value:function(){return this.code}}),Object.defineProperty(e.prototype,"getMessage",{enumerable:!1,configurable:!0,writable:!0,value:function(){return this.message}}),Object.defineProperty(e.prototype,"getClientError",{enumerable:!1,configurable:!0,writable:!0,value:function(){return{message:this.message,code:this.code}}}),e}();const J=(e="tap-connect-sdk-element")=>{const n=document.getElementById(e);if(n)return n;const r=document.createElement("div");return r.setAttribute("id",e),document.body.prepend(r),r},Q=e=>e?["sa","sau"].includes(e.toLowerCase()):!1,X=e=>e==="dr",Z=(e="")=>{const[n,r]=e.split("-");return Q(n)?X(r)?B:M:P},ee=e=>{var n,r,o,s,a,i,d,l,c,u,b,E,O,N;return{operator:{public_key:e.publicKey},scope:e.scope,mode:e.mode||v.PAGE,domain:e.merchantDomain,...e.businessCountryCode&&{country:e.businessCountryCode},...e.data&&{data:e.data},board:{display:e.showBoard??!0,editable:e.boardEditable??!0},interface:{theme:e.theme||C.DYNAMIC,locale:e.language||j.DYNAMIC,edges:((n=e.features)==null?void 0:n.dialogEdgeFormat)||_.CURVED,parnter_logo:((r=e.features)==null?void 0:r.merchantLogo)??!1,dialog_transition:{start:((o=e.features)==null?void 0:o.dialogStartTransition)||x.UP,end:((s=e.features)==null?void 0:s.dialogEndTransition)||x.DOWN}},notification:{email:((a=e.notification)==null?void 0:a.email)??!1,sms:((i=e.notification)==null?void 0:i.sms)??!1},features:{poweredby:((d=e.features)==null?void 0:d.poweredBy)??!0,close_button:((l=e.features)==null?void 0:l.closeButton)??!1},...e.leadId&&{lead:{id:e.leadId}},...e.postUrl&&{post:{url:e.postUrl}},...e.redirectUrl&&{redirect:{url:e.redirectUrl}},...e.platforms&&{platforms:e.platforms},...(((c=e.paymentProvider)==null?void 0:c.institutionId)||((u=e.paymentProvider)==null?void 0:u.technologyId))&&{payment_provider:{...((b=e.paymentProvider)==null?void 0:b.institutionId)&&{institution:{id:(E=e.paymentProvider)==null?void 0:E.institutionId}},...((O=e.paymentProvider)==null?void 0:O.technologyId)&&{technology:{id:(N=e.paymentProvider)==null?void 0:N.technologyId}}}},app_info:{name:window.location.hostname||window.location.origin,version:"0.0.33-test"}}},te=(e,n,r,o)=>{const s=new URLSearchParams;e&&s.append(h.THEME,e),n&&s.append(h.LANGUAGE,n);const a=o?`${y}/auth`:y;return s.append(h.CONFIG_TOKEN,r),`${a}?${s.toString()}`},re=async({region:e,...n})=>{const r=await fetch(Z(e),{method:"POST",headers:{"Content-Type":"application/json",Authorization:`Bearer ${n.publicKey}`,mdn:n.merchantDomain||y},body:JSON.stringify(ee(n))});if(!r.ok)throw new Error(`${r.status}::${r.statusText}`);return r.json()},ne=()=>{const[e,n]=m.useState(""),{onError:r,onLoadingHandler:o,loginMode:s,...a}=g(),i=async()=>{var d,l;o(!0);try{const c=await re(a),u=te((d=c.interface)==null?void 0:d.theme,(l=c.interface)==null?void 0:l.locale,c.token,s);if(a.mode!==v.PAGE)return n(u);window.location.href=u}catch(c){const u=new V(c);r==null||r(u.getClientError()),o(!1)}};return m.useEffect(()=>{i()},[]),{connectLink:e}},oe=()=>{const{onSuccess:e,onClose:n,onError:r,onReady:o,onLoaded:s}=g(),a=m.useCallback(async i=>{if(i.origin!==y)return;const{data:d,event:l}=i.data;switch(l){case p.ON_CLOSE:n==null||n();break;case p.ON_ERROR:r==null||r(d);break;case p.ON_SUCCESS:e(d);break;case p.ON_LOADED:s();break;case p.ON_READY:o==null||o();break}},[n,r,s,o,e]);m.useEffect(()=>(window.addEventListener("message",a,!1),()=>{window.removeEventListener("message",a)}),[a])},se=()=>{const{connectLink:e}=ne();return oe(),t.jsx("div",{id:"tap-connect-main-container",style:{display:"flex",alignItems:"center",justifyContent:"center",background:"rgba(0, 0, 0, 0.5)",position:"fixed",top:0,left:0,width:"100%",height:"100%"},children:t.jsx($,{src:e})})},ae=e=>t.jsx(G,{props:e,children:e.open&&t.jsx(se,{})}),I=m.memo(ae);var R,w=U;R=w.createRoot,w.hydrateRoot;const ie=(e,n)=>{const r=J(e),o=R(r);return o.render(t.jsx(I,{...n})),{unmount:()=>o.unmount()}};exports.ConnectDialogEdgeFormat=_;exports.ConnectDialogTransition=x;exports.ConnectElement=I;exports.ConnectLanguage=j;exports.ConnectMode=v;exports.ConnectPasswordOperationType=k;exports.ConnectScope=S;exports.ConnectTheme=C;exports.renderConnectElement=ie;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),f=require("react"),D=require("react-dom");function L(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const m=L(f);var y=(e=>(e.PAGE="page",e.POPUP="popup",e.CONTENT="content",e))(y||{}),I=(e=>(e.AUTH="auth",e.MERCHANT="merchant",e))(I||{}),h=(e=>(e.AUTH="auth",e.BANK="bank",e.BOARD="board",e.BRAND="brand",e.ENTITY="entity",e.INDIVIDUAL="individual",e.KYC="kyc",e.TAX="tax",e.TERMINAL="terminal",e))(h||{}),T=(e=>(e.SA="sa",e.SA_DR="sa-dr",e))(T||{}),v=(e=>(e.DARK="dark",e.LIGHT="light",e.DYNAMIC="dynamic",e))(v||{}),b=(e=>(e.AR="ar",e.EN="en",e.DYNAMIC="dynamic",e))(b||{}),g=(e=>(e.STRAIGHT="straight",e.CURVED="curved",e))(g||{}),x=(e=>(e.LEFT="left",e.RIGHT="right",e.UP="up",e.DOWN="down",e))(x||{}),c=(e=>(e.ON_CLOSE="connect:onClose",e.ON_ERROR="connect:onError",e.ON_SUCCESS="connect:onSuccess",e.ON_READY="connect:onReady",e.ON_LOADED="connect:onLoaded",e))(c||{}),u=(e=>(e.AUTH_TOKEN="token",e.CONFIG_TOKEN="config_token",e.THEME="theme",e.LANGUAGE="lang",e.BOARD_ID="board_id",e))(u||{});const G=({outerStartColor:e="rgba(244, 244, 244, 1)",outerEndColor:n="rgba(238, 238, 238, 1)",innerStartColor:t="rgba(244, 244, 244, 1)",innerEndColor:o="rgba(238, 238, 238, 1)",duration:a=3,toggleAnimation:s=!1})=>r.jsx("div",{style:{position:"relative",width:"135px",height:"135px"},children:r.jsx("div",{style:{position:"absolute",display:"flex",justifyContent:"center",alignItems:"center",width:"100%",height:"100%",opacity:.9},children:r.jsxs("svg",{width:"199",height:"197",viewBox:"0 0 199 197",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[r.jsxs("g",{children:[r.jsx("circle",{cx:"89.5",cy:"86.5",r:"67.5",fill:"none",stroke:"url(#strokeGradientOuter_1427_22275)",strokeWidth:"9.6",strokeLinecap:"round",strokeDasharray:"425 125",children:s&&r.jsxs(r.Fragment,{children:[r.jsx("animateTransform",{attributeName:"transform",type:"rotate",from:"0 89.5 86.5",to:"360 89.5 86.5",dur:`${a/3}s`,repeatCount:"indefinite"}),r.jsx("animate",{attributeName:"stroke-dashoffset",values:"0; 425; 425; 0; 0",keyTimes:"0; 0.45; 0.55; 0.9; 1",dur:`${a}s`,repeatCount:"indefinite"})]})}),r.jsx("circle",{cx:"89.5",cy:"86.5",r:"48",fill:"none",stroke:"url(#strokeGradientInner_1427_22275)",strokeWidth:"9.6",strokeLinecap:"round",strokeDasharray:"300 100",children:s&&r.jsxs(r.Fragment,{children:[r.jsx("animateTransform",{attributeName:"transform",type:"rotate",from:"360 89.5 86.5",to:"0 89.5 86.5",dur:`${a/3}s`,repeatCount:"indefinite"}),r.jsx("animate",{attributeName:"stroke-dashoffset",values:"0; -300; -300; 0; 0",keyTimes:"0; 0.45; 0.55; 0.9; 1",dur:`${a}s`,repeatCount:"indefinite"})]})})]}),r.jsxs("defs",{children:[r.jsxs("filter",{id:"filter0_dddi_1427_22275",x:"0.882668",y:"0.899429",width:"198.08",height:"195.314",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB",children:[r.jsx("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),r.jsx("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",result:"hardAlpha"}),r.jsx("feOffset",{dy:"1.68224"}),r.jsx("feGaussianBlur",{stdDeviation:"4.20656"}),r.jsx("feComposite",{in2:"hardAlpha",operator:"out"}),r.jsx("feColorMatrix",{type:"matrix",values:"0 0 0 0 0.824495 0 0 0 0 0.824495 0 0 0 0 0.824495 0 0 0 1 0"}),r.jsx("feBlend",{mode:"normal",in2:"BackgroundImageFix",result:"effect1_dropShadow_1427_22275"}),r.jsx("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",result:"hardAlpha"}),r.jsx("feOffset",{dx:"22.3542",dy:"22.6047"}),r.jsx("feGaussianBlur",{stdDeviation:"9.80447"}),r.jsx("feComposite",{in2:"hardAlpha",operator:"out"}),r.jsx("feColorMatrix",{type:"matrix",values:"0 0 0 0 0.740723 0 0 0 0 0.740723 0 0 0 0 0.740723 0 0 0 0.6 0"}),r.jsx("feBlend",{mode:"normal",in2:"effect1_dropShadow_1427_22275",result:"effect2_dropShadow_1427_22275"}),r.jsx("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",result:"hardAlpha"}),r.jsx("feOffset",{dx:"-6.03352",dy:"-3.01676"}),r.jsx("feGaussianBlur",{stdDeviation:"7.5419"}),r.jsx("feComposite",{in2:"hardAlpha",operator:"out"}),r.jsx("feColorMatrix",{type:"matrix",values:"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.7 0"}),r.jsx("feBlend",{mode:"normal",in2:"effect2_dropShadow_1427_22275",result:"effect3_dropShadow_1427_22275"}),r.jsx("feBlend",{mode:"normal",in:"SourceGraphic",in2:"effect3_dropShadow_1427_22275",result:"shape"}),r.jsx("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",result:"hardAlpha"}),r.jsx("feOffset",{dy:"1.50838"}),r.jsx("feComposite",{in2:"hardAlpha",operator:"arithmetic",k2:"-1",k3:"1"}),r.jsx("feColorMatrix",{type:"matrix",values:"0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0"}),r.jsx("feBlend",{mode:"normal",in2:"shape",result:"effect4_innerShadow_1427_22275"})]}),r.jsxs("linearGradient",{id:"strokeGradientOuter_1427_22275",x1:"89.5",y1:"19",x2:"89.5",y2:"154",gradientUnits:"userSpaceOnUse",children:[r.jsx("stop",{stopColor:e}),r.jsx("stop",{offset:"1",stopColor:n})]}),r.jsxs("linearGradient",{id:"strokeGradientInner_1427_22275",x1:"89.4991",y1:"38.2849",x2:"89.4991",y2:"134.713",gradientUnits:"userSpaceOnUse",children:[r.jsx("stop",{stopColor:t}),r.jsx("stop",{offset:"1",stopColor:o})]})]})]})})}),B=f.memo(G),S=f.createContext({}),_=()=>f.useContext(S);function P({children:e,props:n}){const[t,o]=f.useState(!1),a=i=>{o(i)},s=()=>{o(!1)};return r.jsx(S.Provider,{value:{...n,onLoadingHandler:a,loading:t,onLoaded:s},children:e})}const M="https://connect-mw.dev.tap.company/middleware/v3/connect",H="https://connect-mw.dev.tap.company/middleware/v3/connect",$="https://connect-mw.dev.tap.company/middleware/v3/connect",K="tap-connect-sdk-iframe",j="https://sdk-connect.dev.tap.company",W=({src:e})=>{const{loading:n}=_();return r.jsxs(r.Fragment,{children:[n&&r.jsx(B,{toggleAnimation:!0}),e&&r.jsx("iframe",{id:K,title:"connect",src:e,style:{width:"100%",height:"100%",border:"none",position:"absolute",top:0,left:0}})]})};var F=function(e){var n,t;return((t=(n=e==null?void 0:e.response)===null||n===void 0?void 0:n.data)===null||t===void 0?void 0:t.errors)!==void 0},Y=function(e){return e instanceof Error},q=function(e){return typeof e=="string"},V=function(e){try{var n=e.response.data.errors,t=n[0],o=t.description,a=t.code;return{message:o,code:a}}catch(s){return{message:s.message,code:"UNKNOWN"}}},z=function(e){try{var n=e.message,t=n.split("::"),o=t[0],a=t[1];return{message:a,code:o}}catch(s){return{message:s.message,code:"UNKNOWN"}}},J=function(e){try{var n=e.split("::"),t=n[0],o=n[1];return{message:o,code:t}}catch(a){return{message:a,code:"UNKNOWN"}}},X=function(){function e(n){if(Object.defineProperty(this,"code",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"message",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),F(n)){var t=V(n);this.code=t.code,this.message=t.message}else if(Y(n)){var t=z(n);this.code=t.code,this.message=t.message}else if(q(n)){var t=J(n);this.code=t.code,this.message=t.message}else this.code="UNKNOWN",this.message="Unknown error"}return Object.defineProperty(e.prototype,"getCode",{enumerable:!1,configurable:!0,writable:!0,value:function(){return this.code}}),Object.defineProperty(e.prototype,"getMessage",{enumerable:!1,configurable:!0,writable:!0,value:function(){return this.message}}),Object.defineProperty(e.prototype,"getClientError",{enumerable:!1,configurable:!0,writable:!0,value:function(){return{message:this.message,code:this.code}}}),e}();const Q=(e="tap-connect-sdk-element")=>{const n=document.getElementById(e);if(n)return n;const t=document.createElement("div");return t.setAttribute("id",e),document.body.prepend(t),t},Z=e=>e?["sa","sau"].includes(e.toLowerCase()):!1,ee=e=>e==="dr",te=(e="")=>{const[n,t]=e.split("-");return Z(n)?ee(t)?$:H:M},re=e=>{var n,t,o,a,s,i,l,d,p,C,N,E,O,A,w;return{operator:{public_key:e.publicKey},scope:e.scope,mode:e.mode||y.PAGE,domain:e.merchantDomain,...e.businessCountryCode&&{country:e.businessCountryCode},...e.data&&{data:e.data},board:{display:e.showBoard??!0,editable:e.boardEditable??!0},interface:{theme:e.theme||v.DYNAMIC,locale:e.language||b.DYNAMIC,edges:((n=e.features)==null?void 0:n.dialogEdgeFormat)||g.CURVED,parnter_logo:((t=e.features)==null?void 0:t.merchantLogo)??!1,dialog_transition:{start:((o=e.features)==null?void 0:o.dialogStartTransition)||x.UP,end:((a=e.features)==null?void 0:a.dialogEndTransition)||x.DOWN}},notification:{email:((s=e.notification)==null?void 0:s.email)??!1,sms:((i=e.notification)==null?void 0:i.sms)??!1},features:{poweredby:((l=e.features)==null?void 0:l.poweredBy)??!0,close_button:((d=e.features)==null?void 0:d.closeButton)??!1,embedded:((p=e.features)==null?void 0:p.embedded)??!1},...e.leadId&&{lead:{id:e.leadId}},...e.postUrl&&{post:{url:e.postUrl}},...e.redirectUrl&&{redirect:{url:e.redirectUrl}},...e.platforms&&{platforms:e.platforms},...(((C=e.paymentProvider)==null?void 0:C.institutionId)||((N=e.paymentProvider)==null?void 0:N.technologyId))&&{payment_provider:{...((E=e.paymentProvider)==null?void 0:E.institutionId)&&{institution:{id:(O=e.paymentProvider)==null?void 0:O.institutionId}},...((A=e.paymentProvider)==null?void 0:A.technologyId)&&{technology:{id:(w=e.paymentProvider)==null?void 0:w.technologyId}}}},app_info:{name:window.location.hostname||window.location.origin,version:"0.0.35-test"}}},ne=({theme:e,language:n,configToken:t,flow:o,token:a,boardId:s})=>{const i=new URLSearchParams;let l="";return o&&(l=o,o===h.BOARD&&s?i.append(u.BOARD_ID,s):o!==h.AUTH&&a&&i.append(u.AUTH_TOKEN,a)),e&&i.append(u.THEME,e),n&&i.append(u.LANGUAGE,n),i.append(u.CONFIG_TOKEN,t),`${j}/${l}?${i.toString()}`},oe=async e=>{const n=await fetch(te(e.region),{method:"POST",headers:{"Content-Type":"application/json",Authorization:`Bearer ${e.publicKey}`,mdn:e.merchantDomain||j},body:JSON.stringify(re(e))});if(!n.ok)throw new Error(`${n.status}::${n.statusText}`);return n.json()},ae=()=>{const[e,n]=m.useState(""),t=_(),o=async()=>{var a,s,i;t.onLoadingHandler(!0);try{let l=t.configToken,d;if(!l){if(d=await oe(t),!d.token)throw new Error("500::Config token is missing");l=d.token}const p=ne({theme:(a=d==null?void 0:d.interface)==null?void 0:a.theme,language:(s=d==null?void 0:d.interface)==null?void 0:s.locale,configToken:l,flow:t.flow,token:t.token,boardId:t.boardId});if(t.mode!==y.PAGE)return n(p);window.location.href=p}catch(l){const d=new X(l);(i=t.onError)==null||i.call(t,d.getClientError()),t.onLoadingHandler(!1)}};return m.useEffect(()=>{o()},[]),{connectLink:e}},se=()=>{const{onSuccess:e,onClose:n,onError:t,onReady:o,onLoaded:a}=_(),s=m.useCallback(async i=>{if(i.origin!==j)return;const{data:l,event:d}=i.data;switch(d){case c.ON_CLOSE:n==null||n();break;case c.ON_ERROR:t==null||t(l);break;case c.ON_SUCCESS:e==null||e(l);break;case c.ON_LOADED:a();break;case c.ON_READY:o==null||o();break}},[n,t,a,o,e]);m.useEffect(()=>(window.addEventListener("message",s,!1),()=>{window.removeEventListener("message",s)}),[s])},ie=()=>{const{connectLink:e}=ae();return se(),r.jsx("div",{id:"tap-connect-main-container",style:{display:"flex",alignItems:"center",justifyContent:"center",background:"rgba(0, 0, 0, 0.5)",position:"fixed",top:0,left:0,width:"100%",height:"100%"},children:r.jsx(W,{src:e})})},de=e=>r.jsx(P,{props:e,children:e.open&&r.jsx(ie,{})}),R=m.memo(de);var U,k=D;U=k.createRoot,k.hydrateRoot;const le=(e,n)=>{const t=Q(e),o=U(t);return o.render(r.jsx(R,{...n})),{unmount:()=>o.unmount()}};exports.ConnectDialogEdgeFormat=g;exports.ConnectDialogTransition=x;exports.ConnectElement=R;exports.ConnectFlows=h;exports.ConnectLanguage=b;exports.ConnectMode=y;exports.ConnectRegions=T;exports.ConnectScope=I;exports.ConnectTheme=v;exports.renderConnectElement=le;
|
package/build/index.d.ts
CHANGED
|
@@ -3,6 +3,7 @@ import * as React_2 from 'react';
|
|
|
3
3
|
|
|
4
4
|
declare type ConnectAppFeatures = {
|
|
5
5
|
poweredBy?: boolean;
|
|
6
|
+
embedded?: boolean;
|
|
6
7
|
merchantLogo?: boolean;
|
|
7
8
|
closeButton?: boolean;
|
|
8
9
|
dialogStartTransition?: ConnectDialogTransition;
|
|
@@ -24,6 +25,18 @@ export declare enum ConnectDialogTransition {
|
|
|
24
25
|
|
|
25
26
|
export declare const ConnectElement: React_2.MemoExoticComponent<(props: ConnectProps) => JSX_2.Element>;
|
|
26
27
|
|
|
28
|
+
export declare enum ConnectFlows {
|
|
29
|
+
AUTH = "auth",
|
|
30
|
+
BANK = "bank",
|
|
31
|
+
BOARD = "board",
|
|
32
|
+
BRAND = "brand",
|
|
33
|
+
ENTITY = "entity",
|
|
34
|
+
INDIVIDUAL = "individual",
|
|
35
|
+
KYC = "kyc",
|
|
36
|
+
TAX = "tax",
|
|
37
|
+
TERMINAL = "terminal"
|
|
38
|
+
}
|
|
39
|
+
|
|
27
40
|
export declare enum ConnectLanguage {
|
|
28
41
|
AR = "ar",
|
|
29
42
|
EN = "en",
|
|
@@ -41,11 +54,6 @@ export declare type ConnectNotification = {
|
|
|
41
54
|
sms?: boolean;
|
|
42
55
|
};
|
|
43
56
|
|
|
44
|
-
export declare enum ConnectPasswordOperationType {
|
|
45
|
-
SET_PASSWORD = "set_password",
|
|
46
|
-
RESET_PASSWORD = "reset_password"
|
|
47
|
-
}
|
|
48
|
-
|
|
49
57
|
export declare type ConnectPaymentProvider = {
|
|
50
58
|
technologyId: string;
|
|
51
59
|
institutionId: string;
|
|
@@ -53,7 +61,7 @@ export declare type ConnectPaymentProvider = {
|
|
|
53
61
|
|
|
54
62
|
export declare type ConnectProps = {
|
|
55
63
|
onClose?: () => void;
|
|
56
|
-
onSuccess
|
|
64
|
+
onSuccess?: (res: Record<string, string | number>) => void;
|
|
57
65
|
onError?: (error: CustomError) => void;
|
|
58
66
|
onReady?: () => void;
|
|
59
67
|
open: boolean;
|
|
@@ -74,10 +82,18 @@ export declare type ConnectProps = {
|
|
|
74
82
|
data?: Array<string>;
|
|
75
83
|
mode?: ConnectMode;
|
|
76
84
|
notification?: ConnectNotification;
|
|
77
|
-
|
|
78
|
-
|
|
85
|
+
token?: string;
|
|
86
|
+
boardId?: string;
|
|
87
|
+
flow?: ConnectFlows;
|
|
88
|
+
configToken?: string;
|
|
89
|
+
region?: ConnectRegions;
|
|
79
90
|
};
|
|
80
91
|
|
|
92
|
+
export declare enum ConnectRegions {
|
|
93
|
+
SA = "sa",
|
|
94
|
+
SA_DR = "sa-dr"
|
|
95
|
+
}
|
|
96
|
+
|
|
81
97
|
export declare enum ConnectScope {
|
|
82
98
|
AUTH = "auth",
|
|
83
99
|
MERCHANT = "merchant"
|
|
@@ -89,7 +105,7 @@ export declare enum ConnectTheme {
|
|
|
89
105
|
DYNAMIC = "dynamic"
|
|
90
106
|
}
|
|
91
107
|
|
|
92
|
-
declare type CustomError = {
|
|
108
|
+
export declare type CustomError = {
|
|
93
109
|
code: string;
|
|
94
110
|
message: string;
|
|
95
111
|
};
|
package/build/index.esm.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { jsx as n, jsxs as
|
|
1
|
+
import { jsx as n, jsxs as u, Fragment as y } from "react/jsx-runtime";
|
|
2
2
|
import * as f from "react";
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
var
|
|
6
|
-
const
|
|
3
|
+
import h from "react";
|
|
4
|
+
import D from "react-dom";
|
|
5
|
+
var N = /* @__PURE__ */ ((e) => (e.PAGE = "page", e.POPUP = "popup", e.CONTENT = "content", e))(N || {}), L = /* @__PURE__ */ ((e) => (e.AUTH = "auth", e.MERCHANT = "merchant", e))(L || {}), v = /* @__PURE__ */ ((e) => (e.AUTH = "auth", e.BANK = "bank", e.BOARD = "board", e.BRAND = "brand", e.ENTITY = "entity", e.INDIVIDUAL = "individual", e.KYC = "kyc", e.TAX = "tax", e.TERMINAL = "terminal", e))(v || {}), G = /* @__PURE__ */ ((e) => (e.SA = "sa", e.SA_DR = "sa-dr", e))(G || {}), I = /* @__PURE__ */ ((e) => (e.DARK = "dark", e.LIGHT = "light", e.DYNAMIC = "dynamic", e))(I || {}), U = /* @__PURE__ */ ((e) => (e.AR = "ar", e.EN = "en", e.DYNAMIC = "dynamic", e))(U || {}), R = /* @__PURE__ */ ((e) => (e.STRAIGHT = "straight", e.CURVED = "curved", e))(R || {}), _ = /* @__PURE__ */ ((e) => (e.LEFT = "left", e.RIGHT = "right", e.UP = "up", e.DOWN = "down", e))(_ || {}), c = /* @__PURE__ */ ((e) => (e.ON_CLOSE = "connect:onClose", e.ON_ERROR = "connect:onError", e.ON_SUCCESS = "connect:onSuccess", e.ON_READY = "connect:onReady", e.ON_LOADED = "connect:onLoaded", e))(c || {}), p = /* @__PURE__ */ ((e) => (e.AUTH_TOKEN = "token", e.CONFIG_TOKEN = "config_token", e.THEME = "theme", e.LANGUAGE = "lang", e.BOARD_ID = "board_id", e))(p || {});
|
|
6
|
+
const B = ({
|
|
7
7
|
outerStartColor: e = "rgba(244, 244, 244, 1)",
|
|
8
8
|
outerEndColor: r = "rgba(238, 238, 238, 1)",
|
|
9
9
|
innerStartColor: t = "rgba(244, 244, 244, 1)",
|
|
@@ -30,8 +30,8 @@ const T = ({
|
|
|
30
30
|
height: "100%",
|
|
31
31
|
opacity: 0.9
|
|
32
32
|
},
|
|
33
|
-
children: /* @__PURE__ */
|
|
34
|
-
/* @__PURE__ */
|
|
33
|
+
children: /* @__PURE__ */ u("svg", { width: "199", height: "197", viewBox: "0 0 199 197", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
34
|
+
/* @__PURE__ */ u("g", { children: [
|
|
35
35
|
/* @__PURE__ */ n(
|
|
36
36
|
"circle",
|
|
37
37
|
{
|
|
@@ -43,7 +43,7 @@ const T = ({
|
|
|
43
43
|
strokeWidth: "9.6",
|
|
44
44
|
strokeLinecap: "round",
|
|
45
45
|
strokeDasharray: "425 125",
|
|
46
|
-
children: s && /* @__PURE__ */
|
|
46
|
+
children: s && /* @__PURE__ */ u(y, { children: [
|
|
47
47
|
/* @__PURE__ */ n(
|
|
48
48
|
"animateTransform",
|
|
49
49
|
{
|
|
@@ -79,7 +79,7 @@ const T = ({
|
|
|
79
79
|
strokeWidth: "9.6",
|
|
80
80
|
strokeLinecap: "round",
|
|
81
81
|
strokeDasharray: "300 100",
|
|
82
|
-
children: s && /* @__PURE__ */
|
|
82
|
+
children: s && /* @__PURE__ */ u(y, { children: [
|
|
83
83
|
/* @__PURE__ */ n(
|
|
84
84
|
"animateTransform",
|
|
85
85
|
{
|
|
@@ -105,8 +105,8 @@ const T = ({
|
|
|
105
105
|
}
|
|
106
106
|
)
|
|
107
107
|
] }),
|
|
108
|
-
/* @__PURE__ */
|
|
109
|
-
/* @__PURE__ */
|
|
108
|
+
/* @__PURE__ */ u("defs", { children: [
|
|
109
|
+
/* @__PURE__ */ u(
|
|
110
110
|
"filter",
|
|
111
111
|
{
|
|
112
112
|
id: "filter0_dddi_1427_22275",
|
|
@@ -177,7 +177,7 @@ const T = ({
|
|
|
177
177
|
]
|
|
178
178
|
}
|
|
179
179
|
),
|
|
180
|
-
/* @__PURE__ */
|
|
180
|
+
/* @__PURE__ */ u(
|
|
181
181
|
"linearGradient",
|
|
182
182
|
{
|
|
183
183
|
id: "strokeGradientOuter_1427_22275",
|
|
@@ -192,7 +192,7 @@ const T = ({
|
|
|
192
192
|
]
|
|
193
193
|
}
|
|
194
194
|
),
|
|
195
|
-
/* @__PURE__ */
|
|
195
|
+
/* @__PURE__ */ u(
|
|
196
196
|
"linearGradient",
|
|
197
197
|
{
|
|
198
198
|
id: "strokeGradientInner_1427_22275",
|
|
@@ -212,23 +212,23 @@ const T = ({
|
|
|
212
212
|
}
|
|
213
213
|
)
|
|
214
214
|
}
|
|
215
|
-
),
|
|
216
|
-
function
|
|
217
|
-
const [t, o] =
|
|
215
|
+
), P = h.memo(B), T = h.createContext({}), E = () => h.useContext(T);
|
|
216
|
+
function H({ children: e, props: r }) {
|
|
217
|
+
const [t, o] = h.useState(!1), a = (i) => {
|
|
218
218
|
o(i);
|
|
219
219
|
}, s = () => {
|
|
220
220
|
o(!1);
|
|
221
221
|
};
|
|
222
|
-
return /* @__PURE__ */ n(
|
|
222
|
+
return /* @__PURE__ */ n(T.Provider, { value: { ...r, onLoadingHandler: a, loading: t, onLoaded: s }, children: e });
|
|
223
223
|
}
|
|
224
|
-
const
|
|
225
|
-
const { loading: r } =
|
|
226
|
-
return /* @__PURE__ */
|
|
227
|
-
r && /* @__PURE__ */ n(
|
|
224
|
+
const M = "https://connect-mw.dev.tap.company/middleware/v3/connect", $ = "https://connect-mw.dev.tap.company/middleware/v3/connect", K = "https://connect-mw.dev.tap.company/middleware/v3/connect", j = "tap-connect-sdk-iframe", b = "https://sdk-connect.dev.tap.company", W = ({ src: e }) => {
|
|
225
|
+
const { loading: r } = E();
|
|
226
|
+
return /* @__PURE__ */ u(y, { children: [
|
|
227
|
+
r && /* @__PURE__ */ n(P, { toggleAnimation: !0 }),
|
|
228
228
|
e && /* @__PURE__ */ n(
|
|
229
229
|
"iframe",
|
|
230
230
|
{
|
|
231
|
-
id:
|
|
231
|
+
id: j,
|
|
232
232
|
title: "connect",
|
|
233
233
|
src: e,
|
|
234
234
|
style: {
|
|
@@ -243,14 +243,14 @@ const B = "https://connect-mw.dev.tap.company/middleware/v3/connect", M = "https
|
|
|
243
243
|
)
|
|
244
244
|
] });
|
|
245
245
|
};
|
|
246
|
-
var
|
|
246
|
+
var Y = function(e) {
|
|
247
247
|
var r, t;
|
|
248
248
|
return ((t = (r = e == null ? void 0 : e.response) === null || r === void 0 ? void 0 : r.data) === null || t === void 0 ? void 0 : t.errors) !== void 0;
|
|
249
|
-
},
|
|
249
|
+
}, F = function(e) {
|
|
250
250
|
return e instanceof Error;
|
|
251
|
-
},
|
|
251
|
+
}, V = function(e) {
|
|
252
252
|
return typeof e == "string";
|
|
253
|
-
},
|
|
253
|
+
}, q = function(e) {
|
|
254
254
|
try {
|
|
255
255
|
var r = e.response.data.errors, t = r[0], o = t.description, a = t.code;
|
|
256
256
|
return {
|
|
@@ -263,7 +263,7 @@ var W = function(e) {
|
|
|
263
263
|
code: "UNKNOWN"
|
|
264
264
|
};
|
|
265
265
|
}
|
|
266
|
-
},
|
|
266
|
+
}, z = function(e) {
|
|
267
267
|
try {
|
|
268
268
|
var r = e.message, t = r.split("::"), o = t[0], a = t[1];
|
|
269
269
|
return {
|
|
@@ -276,7 +276,7 @@ var W = function(e) {
|
|
|
276
276
|
code: "UNKNOWN"
|
|
277
277
|
};
|
|
278
278
|
}
|
|
279
|
-
},
|
|
279
|
+
}, J = function(e) {
|
|
280
280
|
try {
|
|
281
281
|
var r = e.split("::"), t = r[0], o = r[1];
|
|
282
282
|
return {
|
|
@@ -289,7 +289,7 @@ var W = function(e) {
|
|
|
289
289
|
code: "UNKNOWN"
|
|
290
290
|
};
|
|
291
291
|
}
|
|
292
|
-
},
|
|
292
|
+
}, X = function() {
|
|
293
293
|
function e(r) {
|
|
294
294
|
if (Object.defineProperty(this, "code", {
|
|
295
295
|
enumerable: !0,
|
|
@@ -301,14 +301,14 @@ var W = function(e) {
|
|
|
301
301
|
configurable: !0,
|
|
302
302
|
writable: !0,
|
|
303
303
|
value: void 0
|
|
304
|
-
}),
|
|
305
|
-
var t =
|
|
304
|
+
}), Y(r)) {
|
|
305
|
+
var t = q(r);
|
|
306
306
|
this.code = t.code, this.message = t.message;
|
|
307
|
-
} else if (
|
|
308
|
-
var t =
|
|
307
|
+
} else if (F(r)) {
|
|
308
|
+
var t = z(r);
|
|
309
309
|
this.code = t.code, this.message = t.message;
|
|
310
|
-
} else if (
|
|
311
|
-
var t =
|
|
310
|
+
} else if (V(r)) {
|
|
311
|
+
var t = J(r);
|
|
312
312
|
this.code = t.code, this.message = t.message;
|
|
313
313
|
} else
|
|
314
314
|
this.code = "UNKNOWN", this.message = "Unknown error";
|
|
@@ -339,20 +339,20 @@ var W = function(e) {
|
|
|
339
339
|
}
|
|
340
340
|
}), e;
|
|
341
341
|
}();
|
|
342
|
-
const
|
|
342
|
+
const Q = (e = "tap-connect-sdk-element") => {
|
|
343
343
|
const r = document.getElementById(e);
|
|
344
344
|
if (r) return r;
|
|
345
345
|
const t = document.createElement("div");
|
|
346
346
|
return t.setAttribute("id", e), document.body.prepend(t), t;
|
|
347
|
-
},
|
|
347
|
+
}, Z = (e) => e ? ["sa", "sau"].includes(e.toLowerCase()) : !1, ee = (e) => e === "dr", te = (e = "") => {
|
|
348
348
|
const [r, t] = e.split("-");
|
|
349
|
-
return
|
|
350
|
-
},
|
|
351
|
-
var r, t, o, a, s, i, l,
|
|
349
|
+
return Z(r) ? ee(t) ? K : $ : M;
|
|
350
|
+
}, re = (e) => {
|
|
351
|
+
var r, t, o, a, s, i, l, d, m, O, C, g, A, k, w;
|
|
352
352
|
return {
|
|
353
353
|
operator: { public_key: e.publicKey },
|
|
354
354
|
scope: e.scope,
|
|
355
|
-
mode: e.mode ||
|
|
355
|
+
mode: e.mode || N.PAGE,
|
|
356
356
|
domain: e.merchantDomain,
|
|
357
357
|
...e.businessCountryCode && { country: e.businessCountryCode },
|
|
358
358
|
...e.data && { data: e.data },
|
|
@@ -361,13 +361,13 @@ const J = (e = "tap-connect-sdk-element") => {
|
|
|
361
361
|
editable: e.boardEditable ?? !0
|
|
362
362
|
},
|
|
363
363
|
interface: {
|
|
364
|
-
theme: e.theme ||
|
|
365
|
-
locale: e.language ||
|
|
366
|
-
edges: ((r = e.features) == null ? void 0 : r.dialogEdgeFormat) ||
|
|
364
|
+
theme: e.theme || I.DYNAMIC,
|
|
365
|
+
locale: e.language || U.DYNAMIC,
|
|
366
|
+
edges: ((r = e.features) == null ? void 0 : r.dialogEdgeFormat) || R.CURVED,
|
|
367
367
|
parnter_logo: ((t = e.features) == null ? void 0 : t.merchantLogo) ?? !1,
|
|
368
368
|
dialog_transition: {
|
|
369
|
-
start: ((o = e.features) == null ? void 0 : o.dialogStartTransition) ||
|
|
370
|
-
end: ((a = e.features) == null ? void 0 : a.dialogEndTransition) ||
|
|
369
|
+
start: ((o = e.features) == null ? void 0 : o.dialogStartTransition) || _.UP,
|
|
370
|
+
end: ((a = e.features) == null ? void 0 : a.dialogEndTransition) || _.DOWN
|
|
371
371
|
}
|
|
372
372
|
},
|
|
373
373
|
notification: {
|
|
@@ -376,76 +376,88 @@ const J = (e = "tap-connect-sdk-element") => {
|
|
|
376
376
|
},
|
|
377
377
|
features: {
|
|
378
378
|
poweredby: ((l = e.features) == null ? void 0 : l.poweredBy) ?? !0,
|
|
379
|
-
close_button: ((
|
|
379
|
+
close_button: ((d = e.features) == null ? void 0 : d.closeButton) ?? !1,
|
|
380
|
+
embedded: ((m = e.features) == null ? void 0 : m.embedded) ?? !1
|
|
380
381
|
},
|
|
381
382
|
...e.leadId && { lead: { id: e.leadId } },
|
|
382
383
|
...e.postUrl && { post: { url: e.postUrl } },
|
|
383
384
|
...e.redirectUrl && { redirect: { url: e.redirectUrl } },
|
|
384
385
|
...e.platforms && { platforms: e.platforms },
|
|
385
|
-
...(((
|
|
386
|
+
...(((O = e.paymentProvider) == null ? void 0 : O.institutionId) || ((C = e.paymentProvider) == null ? void 0 : C.technologyId)) && {
|
|
386
387
|
payment_provider: {
|
|
387
|
-
...((
|
|
388
|
-
...((
|
|
388
|
+
...((g = e.paymentProvider) == null ? void 0 : g.institutionId) && { institution: { id: (A = e.paymentProvider) == null ? void 0 : A.institutionId } },
|
|
389
|
+
...((k = e.paymentProvider) == null ? void 0 : k.technologyId) && { technology: { id: (w = e.paymentProvider) == null ? void 0 : w.technologyId } }
|
|
389
390
|
}
|
|
390
391
|
},
|
|
391
392
|
app_info: {
|
|
392
393
|
name: window.location.hostname || window.location.origin,
|
|
393
|
-
version: "0.0.
|
|
394
|
+
version: "0.0.35-test"
|
|
394
395
|
}
|
|
395
396
|
};
|
|
396
|
-
},
|
|
397
|
-
const
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
const t = await fetch(Z(e), {
|
|
397
|
+
}, ne = ({ theme: e, language: r, configToken: t, flow: o, token: a, boardId: s }) => {
|
|
398
|
+
const i = new URLSearchParams();
|
|
399
|
+
let l = "";
|
|
400
|
+
return o && (l = o, o === v.BOARD && s ? i.append(p.BOARD_ID, s) : o !== v.AUTH && a && i.append(p.AUTH_TOKEN, a)), e && i.append(p.THEME, e), r && i.append(p.LANGUAGE, r), i.append(p.CONFIG_TOKEN, t), `${b}/${l}?${i.toString()}`;
|
|
401
|
+
}, oe = async (e) => {
|
|
402
|
+
const r = await fetch(te(e.region), {
|
|
403
403
|
method: "POST",
|
|
404
404
|
headers: {
|
|
405
405
|
"Content-Type": "application/json",
|
|
406
|
-
Authorization: `Bearer ${
|
|
407
|
-
mdn:
|
|
406
|
+
Authorization: `Bearer ${e.publicKey}`,
|
|
407
|
+
mdn: e.merchantDomain || b
|
|
408
408
|
},
|
|
409
|
-
body: JSON.stringify(
|
|
409
|
+
body: JSON.stringify(re(e))
|
|
410
410
|
});
|
|
411
|
-
if (!
|
|
412
|
-
throw new Error(`${
|
|
413
|
-
return
|
|
414
|
-
},
|
|
415
|
-
const [e, r] = f.useState(""),
|
|
416
|
-
var
|
|
417
|
-
|
|
411
|
+
if (!r.ok)
|
|
412
|
+
throw new Error(`${r.status}::${r.statusText}`);
|
|
413
|
+
return r.json();
|
|
414
|
+
}, ae = () => {
|
|
415
|
+
const [e, r] = f.useState(""), t = E(), o = async () => {
|
|
416
|
+
var a, s, i;
|
|
417
|
+
t.onLoadingHandler(!0);
|
|
418
418
|
try {
|
|
419
|
-
|
|
420
|
-
if (
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
419
|
+
let l = t.configToken, d;
|
|
420
|
+
if (!l) {
|
|
421
|
+
if (d = await oe(t), !d.token) throw new Error("500::Config token is missing");
|
|
422
|
+
l = d.token;
|
|
423
|
+
}
|
|
424
|
+
const m = ne({
|
|
425
|
+
theme: (a = d == null ? void 0 : d.interface) == null ? void 0 : a.theme,
|
|
426
|
+
language: (s = d == null ? void 0 : d.interface) == null ? void 0 : s.locale,
|
|
427
|
+
configToken: l,
|
|
428
|
+
flow: t.flow,
|
|
429
|
+
token: t.token,
|
|
430
|
+
boardId: t.boardId
|
|
431
|
+
});
|
|
432
|
+
if (t.mode !== N.PAGE) return r(m);
|
|
433
|
+
window.location.href = m;
|
|
434
|
+
} catch (l) {
|
|
435
|
+
const d = new X(l);
|
|
436
|
+
(i = t.onError) == null || i.call(t, d.getClientError()), t.onLoadingHandler(!1);
|
|
425
437
|
}
|
|
426
438
|
};
|
|
427
439
|
return f.useEffect(() => {
|
|
428
|
-
|
|
440
|
+
o();
|
|
429
441
|
}, []), { connectLink: e };
|
|
430
|
-
},
|
|
431
|
-
const { onSuccess: e, onClose: r, onError: t, onReady: o, onLoaded: a } =
|
|
442
|
+
}, se = () => {
|
|
443
|
+
const { onSuccess: e, onClose: r, onError: t, onReady: o, onLoaded: a } = E(), s = f.useCallback(
|
|
432
444
|
async (i) => {
|
|
433
|
-
if (i.origin !==
|
|
434
|
-
const { data: l, event:
|
|
435
|
-
switch (
|
|
436
|
-
case
|
|
445
|
+
if (i.origin !== b) return;
|
|
446
|
+
const { data: l, event: d } = i.data;
|
|
447
|
+
switch (d) {
|
|
448
|
+
case c.ON_CLOSE:
|
|
437
449
|
r == null || r();
|
|
438
450
|
break;
|
|
439
|
-
case
|
|
451
|
+
case c.ON_ERROR:
|
|
440
452
|
t == null || t(l);
|
|
441
453
|
break;
|
|
442
|
-
case
|
|
443
|
-
e(l);
|
|
454
|
+
case c.ON_SUCCESS:
|
|
455
|
+
e == null || e(l);
|
|
444
456
|
break;
|
|
445
|
-
case
|
|
457
|
+
case c.ON_LOADED:
|
|
446
458
|
a();
|
|
447
459
|
break;
|
|
448
|
-
case
|
|
460
|
+
case c.ON_READY:
|
|
449
461
|
o == null || o();
|
|
450
462
|
break;
|
|
451
463
|
}
|
|
@@ -455,9 +467,9 @@ const J = (e = "tap-connect-sdk-element") => {
|
|
|
455
467
|
f.useEffect(() => (window.addEventListener("message", s, !1), () => {
|
|
456
468
|
window.removeEventListener("message", s);
|
|
457
469
|
}), [s]);
|
|
458
|
-
},
|
|
459
|
-
const { connectLink: e } =
|
|
460
|
-
return
|
|
470
|
+
}, ie = () => {
|
|
471
|
+
const { connectLink: e } = ae();
|
|
472
|
+
return se(), /* @__PURE__ */ n(
|
|
461
473
|
"div",
|
|
462
474
|
{
|
|
463
475
|
id: "tap-connect-main-container",
|
|
@@ -472,24 +484,25 @@ const J = (e = "tap-connect-sdk-element") => {
|
|
|
472
484
|
width: "100%",
|
|
473
485
|
height: "100%"
|
|
474
486
|
},
|
|
475
|
-
children: /* @__PURE__ */ n(
|
|
487
|
+
children: /* @__PURE__ */ n(W, { src: e })
|
|
476
488
|
}
|
|
477
489
|
);
|
|
478
|
-
},
|
|
479
|
-
var
|
|
480
|
-
|
|
481
|
-
const
|
|
482
|
-
const t =
|
|
483
|
-
return o.render(/* @__PURE__ */ n(
|
|
490
|
+
}, de = (e) => /* @__PURE__ */ n(H, { props: e, children: e.open && /* @__PURE__ */ n(ie, {}) }), le = f.memo(de);
|
|
491
|
+
var S, x = D;
|
|
492
|
+
S = x.createRoot, x.hydrateRoot;
|
|
493
|
+
const me = (e, r) => {
|
|
494
|
+
const t = Q(e), o = S(t);
|
|
495
|
+
return o.render(/* @__PURE__ */ n(le, { ...r })), { unmount: () => o.unmount() };
|
|
484
496
|
};
|
|
485
497
|
export {
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
498
|
+
R as ConnectDialogEdgeFormat,
|
|
499
|
+
_ as ConnectDialogTransition,
|
|
500
|
+
le as ConnectElement,
|
|
501
|
+
v as ConnectFlows,
|
|
502
|
+
U as ConnectLanguage,
|
|
503
|
+
N as ConnectMode,
|
|
504
|
+
G as ConnectRegions,
|
|
492
505
|
L as ConnectScope,
|
|
493
|
-
|
|
494
|
-
|
|
506
|
+
I as ConnectTheme,
|
|
507
|
+
me as renderConnectElement
|
|
495
508
|
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tap-payments/connect-v2",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.35-test",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "build/index.cjs.js",
|
|
7
7
|
"module": "build/index.esm.js",
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"prettier": "prettier . --check",
|
|
34
34
|
"prettier:fix": "prettier . --write",
|
|
35
35
|
"prepare": "husky",
|
|
36
|
-
"push": "npm publish --access public
|
|
36
|
+
"push": "npm publish --access public"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@tap-payments/web-error-handing": "^1.0.1"
|