@tap-payments/connect-v2 0.0.33-test β†’ 0.0.34-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 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://expamle.com`). |
106
- | **scope** | `ConnectScope` | βœ… | Defines the integration scope [**auth**, **merchant**]. |
107
- | **onReady** | `() => void` | ❌ | Called when the app configurations are loaded successfully initializing. |
108
- | **onClose** | `() => void` | ❌ | Triggered when the Connect element is closed by the user. |
109
- | **onError** | `(eror: CustomError) => void` | ❌ | Triggered on any error. |
110
- | **onSuccess** | `(response: Record<string, string \| number>) => void` | ❌ | Callback triggered when the flow completes successfully. |
111
- | **theme** | `ConnectTheme` | ❌ | Customize the app theme [**light**, **dark**]. |
112
- | **language** | `ConnectLanguage` | ❌ | Language code for localization [**en**, **ar**]. |
113
- | **businessCountryCode** | `string` | ❌ | Country ISO2 code of the merchant country. |
114
- | **showBoard** | `boolean` | ❌ | Show the merchant board UI. |
115
- | **leadId** | `string` | ❌ | Optional lead ID for loading lead data. |
116
- | **platforms** | `string` | ❌ | - |
117
- | **paymentProvider** | `ConnectPaymentProvider` | ❌ | Information about the payment provider configuration. |
118
- | β€” technologyId | `string` | βœ… | - |
119
- | β€” institutionId | `string` | βœ… | - |
120
- | **features** | `ConnectAppFeatures` | ❌ | Additional configuration options for appearance and UI. |
121
- | β€” poweredBy | `boolean` | ❌ | Show or hide the β€œPowered by Tap” logo. |
122
- | β€” merchantLogo | `boolean` | ❌ | Show or hide the merchant’s logo in the widget. |
123
- | β€” closeButton | `boolean` | ❌ | Display a close button on the widget. |
124
- | β€” dialogStartTransition | `ConnectDialogTransition` | ❌ | Transition animation when the dialog opens [**left**,**right**,**up**,**down**]. |
125
- | β€” dialogEndTransition | `ConnectDialogTransition` | ❌ | Transition animation when the dialog closes [**left**,**right**,**up**,**down**]. |
126
- | β€” dialogEdgeFormat | `ConnectDialogEdgeFormat` | ❌ | Controls the shape/format of the dialog edges [**curved**, **straight**]. |
127
- | **postUrl** | `string` | ❌ | Endpoint to post our data to merchant's server. |
128
- | **redirectUrl** | `string` | ❌ | Redirect URL after success. |
129
- | **data** | `string[]` | ❌ | Merchant data array (e.g. **operator**, **brand**, **entity**, etc.). |
130
- | **mode** | `ConnectMode` | ❌ | Controls the display behavior of the Connect Element, using the ConnectMode enum to specify whether it appears as a full page, popup, or display content only. |
131
- | **notification** | `ConnectNotification` | ❌ | Notification configuration to notify the user after account creation. |
132
- | β€” email | `boolean` | βœ… | Enable or disable email notifications. |
133
- | β€” sms | `boolean` | ❌ | Enable or disable mobile SMS notifications. |
134
- | **boardEditable** | `boolean` | ❌ | Allow merchant board to be editable. |
135
- | **loginMode** | `boolean` | ❌ | Opens Connect in login/auth mode. |
136
- | **region** | `string` | ❌ | Region code that changes the target middlware (e.g., **sa** for Saudi). |
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
 
@@ -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://connect.alpha.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.34-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: (res: Record<string, string | number>) => void;
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
- loginMode?: boolean;
78
- region?: string;
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
  };
@@ -1,9 +1,9 @@
1
- import { jsx as n, jsxs as d, Fragment as _ } from "react/jsx-runtime";
1
+ import { jsx as n, jsxs as u, Fragment as y } from "react/jsx-runtime";
2
2
  import * as f from "react";
3
- import v from "react";
4
- import R from "react-dom";
5
- var E = /* @__PURE__ */ ((e) => (e.PAGE = "page", e.POPUP = "popup", e.CONTENT = "content", e))(E || {}), L = /* @__PURE__ */ ((e) => (e.AUTH = "auth", e.MERCHANT = "merchant", e))(L || {}), G = /* @__PURE__ */ ((e) => (e.SET_PASSWORD = "set_password", e.RESET_PASSWORD = "reset_password", e))(G || {}), A = /* @__PURE__ */ ((e) => (e.DARK = "dark", e.LIGHT = "light", e.DYNAMIC = "dynamic", e))(A || {}), S = /* @__PURE__ */ ((e) => (e.AR = "ar", e.EN = "en", e.DYNAMIC = "dynamic", e))(S || {}), k = /* @__PURE__ */ ((e) => (e.STRAIGHT = "straight", e.CURVED = "curved", e))(k || {}), C = /* @__PURE__ */ ((e) => (e.LEFT = "left", e.RIGHT = "right", e.UP = "up", e.DOWN = "down", e))(C || {}), m = /* @__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))(m || {}), h = /* @__PURE__ */ ((e) => (e.CONFIG_TOKEN = "config_token", e.THEME = "theme", e.LANGUAGE = "lang", e))(h || {});
6
- const T = ({
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__ */ d("svg", { width: "199", height: "197", viewBox: "0 0 199 197", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
34
- /* @__PURE__ */ d("g", { children: [
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__ */ d(_, { children: [
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__ */ d(_, { children: [
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__ */ d("defs", { children: [
109
- /* @__PURE__ */ d(
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__ */ d(
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__ */ d(
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
- ), D = v.memo(T), I = v.createContext({}), N = () => v.useContext(I);
216
- function P({ children: e, props: r }) {
217
- const [t, o] = v.useState(!1), a = (i) => {
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(I.Provider, { value: { ...r, onLoadingHandler: a, loading: t, onLoaded: s }, children: e });
222
+ return /* @__PURE__ */ n(T.Provider, { value: { ...r, onLoadingHandler: a, loading: t, onLoaded: s }, children: e });
223
223
  }
224
- const B = "https://connect-mw.dev.tap.company/middleware/v3/connect", M = "https://connect-mw.dev.tap.company/middleware/v3/connect", $ = "https://connect-mw.dev.tap.company/middleware/v3/connect", F = "tap-connect-sdk-iframe", y = "https://connect.alpha.tap.company", j = ({ src: e }) => {
225
- const { loading: r } = N();
226
- return /* @__PURE__ */ d(_, { children: [
227
- r && /* @__PURE__ */ n(D, { toggleAnimation: !0 }),
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://connect.alpha.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: F,
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 W = function(e) {
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
- }, H = function(e) {
249
+ }, F = function(e) {
250
250
  return e instanceof Error;
251
- }, K = function(e) {
251
+ }, V = function(e) {
252
252
  return typeof e == "string";
253
- }, Y = function(e) {
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
- }, V = function(e) {
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
- }, q = function(e) {
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
- }, z = function() {
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
- }), W(r)) {
305
- var t = Y(r);
304
+ }), Y(r)) {
305
+ var t = q(r);
306
306
  this.code = t.code, this.message = t.message;
307
- } else if (H(r)) {
308
- var t = V(r);
307
+ } else if (F(r)) {
308
+ var t = z(r);
309
309
  this.code = t.code, this.message = t.message;
310
- } else if (K(r)) {
311
- var t = q(r);
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 J = (e = "tap-connect-sdk-element") => {
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
- }, Q = (e) => e ? ["sa", "sau"].includes(e.toLowerCase()) : !1, X = (e) => e === "dr", Z = (e = "") => {
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 Q(r) ? X(t) ? $ : M : B;
350
- }, ee = (e) => {
351
- var r, t, o, a, s, i, l, u, c, p, b, w, O, g;
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, w, k;
352
352
  return {
353
353
  operator: { public_key: e.publicKey },
354
354
  scope: e.scope,
355
- mode: e.mode || E.PAGE,
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 || A.DYNAMIC,
365
- locale: e.language || S.DYNAMIC,
366
- edges: ((r = e.features) == null ? void 0 : r.dialogEdgeFormat) || k.CURVED,
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) || C.UP,
370
- end: ((a = e.features) == null ? void 0 : a.dialogEndTransition) || C.DOWN
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: ((u = e.features) == null ? void 0 : u.closeButton) ?? !1
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
- ...(((c = e.paymentProvider) == null ? void 0 : c.institutionId) || ((p = e.paymentProvider) == null ? void 0 : p.technologyId)) && {
386
+ ...(((O = e.paymentProvider) == null ? void 0 : O.institutionId) || ((C = e.paymentProvider) == null ? void 0 : C.technologyId)) && {
386
387
  payment_provider: {
387
- ...((b = e.paymentProvider) == null ? void 0 : b.institutionId) && { institution: { id: (w = e.paymentProvider) == null ? void 0 : w.institutionId } },
388
- ...((O = e.paymentProvider) == null ? void 0 : O.technologyId) && { technology: { id: (g = e.paymentProvider) == null ? void 0 : g.technologyId } }
388
+ ...((g = e.paymentProvider) == null ? void 0 : g.institutionId) && { institution: { id: (A = e.paymentProvider) == null ? void 0 : A.institutionId } },
389
+ ...((w = e.paymentProvider) == null ? void 0 : w.technologyId) && { technology: { id: (k = e.paymentProvider) == null ? void 0 : k.technologyId } }
389
390
  }
390
391
  },
391
392
  app_info: {
392
393
  name: window.location.hostname || window.location.origin,
393
- version: "0.0.33-test"
394
+ version: "0.0.34-test"
394
395
  }
395
396
  };
396
- }, te = (e, r, t, o) => {
397
- const a = new URLSearchParams();
398
- e && a.append(h.THEME, e), r && a.append(h.LANGUAGE, r);
399
- const s = o ? `${y}/auth` : y;
400
- return a.append(h.CONFIG_TOKEN, t), `${s}?${a.toString()}`;
401
- }, re = async ({ region: e, ...r }) => {
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 ${r.publicKey}`,
407
- mdn: r.merchantDomain || y
406
+ Authorization: `Bearer ${e.publicKey}`,
407
+ mdn: e.merchantDomain || b
408
408
  },
409
- body: JSON.stringify(ee(r))
409
+ body: JSON.stringify(re(e))
410
410
  });
411
- if (!t.ok)
412
- throw new Error(`${t.status}::${t.statusText}`);
413
- return t.json();
414
- }, ne = () => {
415
- const [e, r] = f.useState(""), { onError: t, onLoadingHandler: o, loginMode: a, ...s } = N(), i = async () => {
416
- var l, u;
417
- o(!0);
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
- const c = await re(s), p = te((l = c.interface) == null ? void 0 : l.theme, (u = c.interface) == null ? void 0 : u.locale, c.token, a);
420
- if (s.mode !== E.PAGE) return r(p);
421
- window.location.href = p;
422
- } catch (c) {
423
- const p = new z(c);
424
- t == null || t(p.getClientError()), o(!1);
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
- i();
440
+ o();
429
441
  }, []), { connectLink: e };
430
- }, oe = () => {
431
- const { onSuccess: e, onClose: r, onError: t, onReady: o, onLoaded: a } = N(), s = f.useCallback(
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 !== y) return;
434
- const { data: l, event: u } = i.data;
435
- switch (u) {
436
- case m.ON_CLOSE:
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 m.ON_ERROR:
451
+ case c.ON_ERROR:
440
452
  t == null || t(l);
441
453
  break;
442
- case m.ON_SUCCESS:
443
- e(l);
454
+ case c.ON_SUCCESS:
455
+ e == null || e(l);
444
456
  break;
445
- case m.ON_LOADED:
457
+ case c.ON_LOADED:
446
458
  a();
447
459
  break;
448
- case m.ON_READY:
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
- }, ae = () => {
459
- const { connectLink: e } = ne();
460
- return oe(), /* @__PURE__ */ n(
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(j, { src: e })
487
+ children: /* @__PURE__ */ n(W, { src: e })
476
488
  }
477
489
  );
478
- }, se = (e) => /* @__PURE__ */ n(P, { props: e, children: e.open && /* @__PURE__ */ n(ae, {}) }), ie = f.memo(se);
479
- var U, x = R;
480
- U = x.createRoot, x.hydrateRoot;
481
- const ue = (e, r) => {
482
- const t = J(e), o = U(t);
483
- return o.render(/* @__PURE__ */ n(ie, { ...r })), { unmount: () => o.unmount() };
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
- k as ConnectDialogEdgeFormat,
487
- C as ConnectDialogTransition,
488
- ie as ConnectElement,
489
- S as ConnectLanguage,
490
- E as ConnectMode,
491
- G as ConnectPasswordOperationType,
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
- A as ConnectTheme,
494
- ue as renderConnectElement
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.33-test",
4
+ "version": "0.0.34-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 --tag latest"
36
+ "push": "npm publish --access public"
37
37
  },
38
38
  "dependencies": {
39
39
  "@tap-payments/web-error-handing": "^1.0.1"