@tap-payments/connect-v2 0.0.27-test → 0.0.29-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 +147 -40
- package/build/index.cjs.js +1 -1
- package/build/index.d.ts +12 -10
- package/build/index.esm.js +74 -65
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -1,50 +1,157 @@
|
|
|
1
|
-
#
|
|
1
|
+
# Connect SDK V2
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
A React SDK that allows merchants to easily integrate with Tap Connect in their applications, handling identification and authentication seamlessly.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
This package provides:
|
|
6
6
|
|
|
7
|
-
-
|
|
8
|
-
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
|
|
7
|
+
- **_ConnectElement_**: a React component that can be embedded directly in your app to enable secure, localized, and customizable connections.
|
|
9
8
|
|
|
10
|
-
|
|
9
|
+
- **_renderTapConnect_**: a UMD helper function (available on the global TapConnectSDK object) that lets you render the widget in plain JavaScript environments without a React build setup.
|
|
11
10
|
|
|
12
|
-
|
|
11
|
+
---
|
|
13
12
|
|
|
14
|
-
|
|
13
|
+
## 📦 Installation
|
|
15
14
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
15
|
+
- Using `npm`:
|
|
16
|
+
```bash
|
|
17
|
+
npm install @tap-payments/connect-v2
|
|
18
|
+
```
|
|
19
|
+
- Using `yarn`:
|
|
20
|
+
```bash
|
|
21
|
+
yarn add @tap-payments/connect-v2
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
---
|
|
25
|
+
|
|
26
|
+
## ⚡ Quick Start
|
|
27
|
+
|
|
28
|
+
```tsx
|
|
29
|
+
import React, { useState } from 'react';
|
|
30
|
+
import { ConnectElement, ConnectScope, ConnectTheme, ConnectMode } from '@tap-payments/connect-v2';
|
|
31
|
+
|
|
32
|
+
const App = () => {
|
|
33
|
+
const [open, setOpen] = useState(false);
|
|
34
|
+
|
|
35
|
+
return (
|
|
36
|
+
<div>
|
|
37
|
+
<button onClick={() => setOpen(true)}>Open Connect Element</button>
|
|
38
|
+
|
|
39
|
+
<ConnectElement
|
|
40
|
+
open={open}
|
|
41
|
+
publicKey="pk_test_XXXXXXXXXXXXXXXXXXXXXXX"
|
|
42
|
+
merchantDomain="https://example.com"
|
|
43
|
+
theme={ConnectTheme.DARK}
|
|
44
|
+
scope={ConnectScope.MERCHANT}
|
|
45
|
+
appInfo={{
|
|
46
|
+
name: 'My App',
|
|
47
|
+
version: '1.0.0',
|
|
48
|
+
}}
|
|
49
|
+
onClose={() => setOpen(false)}
|
|
50
|
+
features={{ poweredBy: true, closeButton: true }}
|
|
51
|
+
mode={ConnectMode.POPUP}
|
|
52
|
+
/>
|
|
53
|
+
</div>
|
|
54
|
+
);
|
|
55
|
+
};
|
|
56
|
+
|
|
57
|
+
export default App;
|
|
26
58
|
```
|
|
27
59
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
```
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
60
|
+
## 🌐 Vanilla JS Demo
|
|
61
|
+
|
|
62
|
+
You can also use the SDK without a React build setup by including the UMD bundle directly in your HTML file. The global TapConnectSDK object provides a helper method to render the widget into any container element.
|
|
63
|
+
|
|
64
|
+
```html
|
|
65
|
+
<!doctype html>
|
|
66
|
+
<html>
|
|
67
|
+
<head>
|
|
68
|
+
<title>Tap Connect SDK Demo</title>
|
|
69
|
+
</head>
|
|
70
|
+
<body>
|
|
71
|
+
<div id="connect-container"></div>
|
|
72
|
+
|
|
73
|
+
<button onclick="openConnect()">Open Connect</button>
|
|
74
|
+
|
|
75
|
+
<!-- React and ReactDOM (required for the widget to work) -->
|
|
76
|
+
<script src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
|
|
77
|
+
<script src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
|
|
78
|
+
|
|
79
|
+
<!-- Tap Connect SDK UMD bundle -->
|
|
80
|
+
<script src="https://cdn.tap.company/tap-sdks/connect-v2/build-0.0.28-test/index.js"></script>
|
|
81
|
+
|
|
82
|
+
<script>
|
|
83
|
+
function openConnect() {
|
|
84
|
+
TapConnectSDK.renderConnectElement('connect-container', {
|
|
85
|
+
open: true,
|
|
86
|
+
publicKey: 'pk_test_lat64TEDSvHrUOYAxVRe28PQ',
|
|
87
|
+
merchantDomain: 'https://connect.dev.tap.company',
|
|
88
|
+
language: TapConnectSDK.ConnectLanguage.EN,
|
|
89
|
+
appInfo: {
|
|
90
|
+
name: 'My App',
|
|
91
|
+
},
|
|
92
|
+
theme: TapConnectSDK.ConnectTheme.DARK,
|
|
93
|
+
scope: TapConnectSDK.ConnectScope.MERCHANT,
|
|
94
|
+
data: ['brand', 'entity'],
|
|
95
|
+
showBoard: true,
|
|
96
|
+
mode: TapConnectSDK.ConnectMode.PAGE,
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
</script>
|
|
100
|
+
</body>
|
|
101
|
+
</html>
|
|
50
102
|
```
|
|
103
|
+
|
|
104
|
+
---
|
|
105
|
+
|
|
106
|
+
## 🧠 Props
|
|
107
|
+
|
|
108
|
+
| Prop | Type | Required | Description |
|
|
109
|
+
| ----------------------- | ------------------------------------------------------ | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
110
|
+
| **open** | `boolean` | ✅ | Controls whether Connect element is open or closed. |
|
|
111
|
+
| **publicKey** | `string` | ✅ | Your public API key provided by Tap Payments. |
|
|
112
|
+
| **merchantDomain** | `string` | ✅ | Merchant's domain (e.g. `https://expamle.com`). |
|
|
113
|
+
| **scope** | `ConnectScope` | ✅ | Defines the integration scope [**auth**, **merchant**]. |
|
|
114
|
+
| **appInfo** | `ConnectAppInfo` | ✅ | Information about the merchant’s host application. |
|
|
115
|
+
| — name | `string` | ✅ | The display name of your application. |
|
|
116
|
+
| — identifier | `string` | ❌ | A unique identifier for your application (e.g., bundle ID or package name). |
|
|
117
|
+
| — version | `string` | ❌ | The current version of your application (e.g., `1.0.0`). |
|
|
118
|
+
| **onReady** | `() => void` | ❌ | Called when the app configurations are loaded successfully initializing. |
|
|
119
|
+
| **onClose** | `() => void` | ❌ | Triggered when the Connect element is closed by the user. |
|
|
120
|
+
| **onError** | `(eror: CustomError) => void` | ❌ | Triggered on any error. |
|
|
121
|
+
| **onSuccess** | `(response: Record<string, string \| number>) => void` | ❌ | Callback triggered when the flow completes successfully. |
|
|
122
|
+
| **theme** | `ConnectTheme` | ❌ | Customize the app theme [**light**, **dark**]. |
|
|
123
|
+
| **language** | `ConnectLanguage` | ❌ | Language code for localization [**en**, **ar**]. |
|
|
124
|
+
| **businessCountryCode** | `string` | ❌ | Country ISO2 code of the merchant country. |
|
|
125
|
+
| **showBoard** | `boolean` | ❌ | Show the merchant board UI. |
|
|
126
|
+
| **leadId** | `string` | ❌ | Optional lead ID for loading lead data. |
|
|
127
|
+
| **platforms** | `string` | ❌ | - |
|
|
128
|
+
| **paymentProvider** | `ConnectPaymentProvider` | ❌ | Information about the payment provider configuration. |
|
|
129
|
+
| — technologyId | `string` | ✅ | - |
|
|
130
|
+
| — settlementBy | `string` | ✅ | - |
|
|
131
|
+
| **features** | `ConnectAppFeatures` | ❌ | Additional configuration options for appearance and UI. |
|
|
132
|
+
| — poweredBy | `boolean` | ❌ | Show or hide the “Powered by Tap” logo. |
|
|
133
|
+
| — merchantLogo | `boolean` | ❌ | Show or hide the merchant’s logo in the widget. |
|
|
134
|
+
| — closeButton | `boolean` | ❌ | Display a close button on the widget. |
|
|
135
|
+
| — dialogStartTransition | `ConnectDialogTransition` | ❌ | Transition animation when the dialog opens [**left**,**right**,**up**,**down**]. |
|
|
136
|
+
| — dialogEndTransition | `ConnectDialogTransition` | ❌ | Transition animation when the dialog closes [**left**,**right**,**up**,**down**]. |
|
|
137
|
+
| — dialogEdgeFormat | `ConnectDialogEdgeFormat` | ❌ | Controls the shape/format of the dialog edges [**curved**, **straight**]. |
|
|
138
|
+
| **postUrl** | `string` | ❌ | Endpoint to post our data to merchant's server. |
|
|
139
|
+
| **redirectUrl** | `string` | ❌ | Redirect URL after success. |
|
|
140
|
+
| **data** | `string[]` | ❌ | Merchant data array (e.g. **operator**, **brand**, **entity**, etc.). |
|
|
141
|
+
| **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. |
|
|
142
|
+
| **notification** | `ConnectNotification` | ❌ | Notification configuration to notify the user after account creation. |
|
|
143
|
+
| — email | `boolean` | ✅ | Enable or disable email notifications. |
|
|
144
|
+
| — mobile | `boolean` | ❌ | Enable or disable mobile (SMS) notifications. |
|
|
145
|
+
| **boardEditable** | `boolean` | ❌ | Allow merchant board to be editable. |
|
|
146
|
+
| **boardId** | `string` | ❌ | Specify existing board ID. |
|
|
147
|
+
| **boardInfoId** | `string` | ❌ | Specify board info ID for password kit. |
|
|
148
|
+
| **userId** | `string` | ❌ | User ID for password kit. |
|
|
149
|
+
| **userType** | `string` | ❌ | Type of the user for password kit. |
|
|
150
|
+
| **operationType** | `ConnectPasswordOperationType` | ❌ | Operation type for password kit. |
|
|
151
|
+
| **loginMode** | `boolean` | ❌ | Opens Connect in login/auth mode. |
|
|
152
|
+
| **region** | `string` | ❌ | Region code that changes the target middlware (e.g., **sa** for Saudi). |
|
|
153
|
+
|
|
154
|
+
---
|
|
155
|
+
|
|
156
|
+
Developed by **Tap Payments**
|
|
157
|
+
🌐 [Website](https://www.tap.company) · 💬 [Support](https://www.tap.company/support) · 💼 [LinkedIn](https://www.linkedin.com/company/tappayments)
|
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"),A=require("react-dom");function R(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 u=R(f);var g=(e=>(e.PAGE="page",e.POPUP="popup",e.CONTENT="content",e))(g||{}),_=(e=>(e.AUTH="auth",e.MERCHANT="merchant",e))(_||{}),y=(e=>(e.SET_PASSWORD="set_password",e.RESET_PASSWORD="reset_password",e))(y||{}),C=(e=>(e.DARK="dark",e.LIGHT="light",e))(C||{}),O=(e=>(e.AR="ar",e.EN="en",e))(O||{}),E=(e=>(e.STRAIGHT="straight",e.CURVED="curved",e))(E||{}),b=(e=>(e.LEFT="left",e.RIGHT="right",e.UP="up",e.DOWN="down",e))(b||{}),l=(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))(l||{}),h=(e=>(e.PROFILE_TOKEN="profile_token",e.THEME="theme",e.LANGUAGE="lang",e))(h||{});const L=({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:i=!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:i&&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:i&&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})]})]})]})})}),T=f.memo(L),N=f.createContext({}),v=()=>f.useContext(N);function U({children:e,props:n}){const[r,o]=f.useState(!1),s=a=>{o(a)},i=()=>{o(!1)};return t.jsx(N.Provider,{value:{...n,onLoadingHandler:s,loading:r,onLoaded:i},children:e})}const G="https://68b564fae5dc090291aeddd7.mockapi.io/api/config",I="https://68b564fae5dc090291aeddd7.mockapi.io/api/config",P="https://68b564fae5dc090291aeddd7.mockapi.io/api/config",D="tap-connect-sdk-iframe",x="https://connect.alpha.tap.company",F=({src:e})=>{const{loading:n}=v();return t.jsxs(t.Fragment,{children:[n&&t.jsx(T,{toggleAnimation:!0}),e&&t.jsx("iframe",{id:D,title:"connect",src:e,style:{width:"100%",height:"100%",border:"none",position:"absolute",top:0,left:0}})]})};var M=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},B=function(e){return e instanceof Error},$=function(e){return typeof e=="string"},H=function(e){try{var n=e.response.data.errors,r=n[0],o=r.description,s=r.code;return{message:o,code:s}}catch(i){return{message:i.message,code:"UNKNOWN"}}},W=function(e){try{var n=e.message,r=n.split("::"),o=r[0],s=r[1];return{message:s,code:o}}catch(i){return{message:i.message,code:"UNKNOWN"}}},K=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"}}},q=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}),M(n)){var r=H(n);this.code=r.code,this.message=r.message}else if(B(n)){var r=W(n);this.code=r.code,this.message=r.message}else if($(n)){var r=K(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 Y=(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},z=e=>e?["sa","sau"].includes(e.toLowerCase()):!1,J=e=>e==="dr",V=(e="")=>{const[n,r]=e.split("-");return z(n)?J(r)?P:I:G},Q=()=>{const[e,n]=u.useState(""),{onError:r,onLoadingHandler:o,loginMode:s,region:i,...a}=v(),p=async()=>{o(!0);try{const c=await fetch(V(i),{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(a)});if(!c.ok)throw new Error(`${c.status}::${c.statusText}`);const d=await c.json();if(!d.redirect_url){const m=new URLSearchParams;a!=null&&a.theme&&m.append(h.THEME,a.theme),a!=null&&a.language&&m.append(h.LANGUAGE,a.language),m.append(h.PROFILE_TOKEN,d.id);const k=s?`${x}/auth`:x;d.redirect_url=`${k}?${m.toString()}`}if(a.mode!==g.PAGE)return n(d.redirect_url);window.location.href=d.redirect_url}catch(c){const d=new q(c);r==null||r(d.getClientError()),o(!1)}};return u.useEffect(()=>{p()},[]),{connectLink:e}},X=()=>{const{onSuccess:e,onClose:n,onError:r,onReady:o,onLoaded:s}=v(),i=u.useCallback(async a=>{if(a.origin!==x)return;const{data:p,event:c}=a.data;switch(c){case l.ON_CLOSE:n==null||n();break;case l.ON_ERROR:r==null||r(p);break;case l.ON_SUCCESS:e(p);break;case l.ON_LOADED:s();break;case l.ON_READY:o==null||o();break}},[n,r,s,o,e]);u.useEffect(()=>(window.addEventListener("message",i,!1),()=>{window.removeEventListener("message",i)}),[i])},Z=()=>{const{connectLink:e}=Q();return X(),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(F,{src:e})})},ee=e=>t.jsx(U,{props:e,children:e.open&&t.jsx(Z,{})}),w=u.memo(ee);var S,j=A;S=j.createRoot,j.hydrateRoot;const te=(e,n)=>{const r=Y(e),o=S(r);return o.render(t.jsx(w,{...n})),{unmount:()=>o.unmount()}};exports.ConnectDialogEdgeFormat=E;exports.ConnectDialogTransition=b;exports.ConnectElement=w;exports.ConnectLanguage=O;exports.ConnectMode=g;exports.ConnectPasswordOperationType=y;exports.ConnectScope=_;exports.ConnectTheme=C;exports.renderConnectElement=te;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),p=require("react"),A=require("react-dom");function R(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 u=R(p);var g=(e=>(e.PAGE="page",e.POPUP="popup",e.CONTENT="content",e))(g||{}),j=(e=>(e.AUTH="auth",e.MERCHANT="merchant",e))(j||{}),_=(e=>(e.SET_PASSWORD="set_password",e.RESET_PASSWORD="reset_password",e))(_||{}),C=(e=>(e.DARK="dark",e.LIGHT="light",e))(C||{}),O=(e=>(e.AR="ar",e.EN="en",e))(O||{}),E=(e=>(e.STRAIGHT="straight",e.CURVED="curved",e))(E||{}),b=(e=>(e.LEFT="left",e.RIGHT="right",e.UP="up",e.DOWN="down",e))(b||{}),l=(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))(l||{}),h=(e=>(e.PROFILE_TOKEN="profile_token",e.CONFIG_TOKEN="config_token",e.THEME="theme",e.LANGUAGE="lang",e))(h||{});const L=({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:i=!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:i&&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:i&&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})]})]})]})})}),T=p.memo(L),N=p.createContext({}),v=()=>p.useContext(N);function U({children:e,props:n}){const[r,o]=p.useState(!1),s=a=>{o(a)},i=()=>{o(!1)};return t.jsx(N.Provider,{value:{...n,onLoadingHandler:s,loading:r,onLoaded:i},children:e})}const G="https://connect-mw.dev.tap.company/middleware/v3/connect",I="https://connect-mw.dev.tap.company/middleware/v3/connect",D="https://connect-mw.dev.tap.company/middleware/v3/connect",P="tap-connect-sdk-iframe",x="https://connect.alpha.tap.company",F=({src:e})=>{const{loading:n}=v();return t.jsxs(t.Fragment,{children:[n&&t.jsx(T,{toggleAnimation:!0}),e&&t.jsx("iframe",{id:P,title:"connect",src:e,style:{width:"100%",height:"100%",border:"none",position:"absolute",top:0,left:0}})]})};var B=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},M=function(e){return e instanceof Error},$=function(e){return typeof e=="string"},H=function(e){try{var n=e.response.data.errors,r=n[0],o=r.description,s=r.code;return{message:o,code:s}}catch(i){return{message:i.message,code:"UNKNOWN"}}},W=function(e){try{var n=e.message,r=n.split("::"),o=r[0],s=r[1];return{message:s,code:o}}catch(i){return{message:i.message,code:"UNKNOWN"}}},K=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"}}},q=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}),B(n)){var r=H(n);this.code=r.code,this.message=r.message}else if(M(n)){var r=W(n);this.code=r.code,this.message=r.message}else if($(n)){var r=K(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 z=(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},Y=e=>e?["sa","sau"].includes(e.toLowerCase()):!1,J=e=>e==="dr",V=(e="")=>{const[n,r]=e.split("-");return Y(n)?J(r)?D:I:G},Q=e=>{var n;return{...e,board:{display:e.showBoard,editable:e.boardEditable},operator:{public_key:e.publicKey},...((n=e.features)==null?void 0:n.dialogEdgeFormat)&&{interface:{edges:e.features.dialogEdgeFormat}},...e.leadId&&{lead:{id:e.leadId}},...e.postUrl&&{post:{url:e.postUrl}},...e.redirectUrl&&{redirect:{url:e.redirectUrl}}}},X=()=>{const[e,n]=u.useState(""),{onError:r,onLoadingHandler:o,loginMode:s,region:i,...a}=v(),f=async()=>{o(!0);try{const c=await fetch(V(i),{method:"POST",headers:{"Content-Type":"application/json",Authorization:`Bearer ${a.publicKey}`,mdn:x},body:JSON.stringify(Q(a))});if(!c.ok)throw new Error(`${c.status}::${c.statusText}`);const d=await c.json(),m=new URLSearchParams;a!=null&&a.theme&&m.append(h.THEME,a.theme),a!=null&&a.language&&m.append(h.LANGUAGE,a.language);const k=s?`${x}/auth`:x;if(m.append(h.CONFIG_TOKEN,d.token),d.connect.url=`${k}?${m.toString()}`,a.mode!==g.PAGE)return n(d.connect.url);window.location.href=d.connect.url}catch(c){const d=new q(c);r==null||r(d.getClientError()),o(!1)}};return u.useEffect(()=>{f()},[]),{connectLink:e}},Z=()=>{const{onSuccess:e,onClose:n,onError:r,onReady:o,onLoaded:s}=v(),i=u.useCallback(async a=>{if(a.origin!==x)return;const{data:f,event:c}=a.data;switch(c){case l.ON_CLOSE:n==null||n();break;case l.ON_ERROR:r==null||r(f);break;case l.ON_SUCCESS:e(f);break;case l.ON_LOADED:s();break;case l.ON_READY:o==null||o();break}},[n,r,s,o,e]);u.useEffect(()=>(window.addEventListener("message",i,!1),()=>{window.removeEventListener("message",i)}),[i])},ee=()=>{const{connectLink:e}=X();return Z(),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(F,{src:e})})},te=e=>t.jsx(U,{props:e,children:e.open&&t.jsx(ee,{})}),w=u.memo(te);var S,y=A;S=y.createRoot,y.hydrateRoot;const re=(e,n)=>{const r=z(e),o=S(r);return o.render(t.jsx(w,{...n})),{unmount:()=>o.unmount()}};exports.ConnectDialogEdgeFormat=E;exports.ConnectDialogTransition=b;exports.ConnectElement=w;exports.ConnectLanguage=O;exports.ConnectMode=g;exports.ConnectPasswordOperationType=_;exports.ConnectScope=j;exports.ConnectTheme=C;exports.renderConnectElement=re;
|
package/build/index.d.ts
CHANGED
|
@@ -1,6 +1,15 @@
|
|
|
1
1
|
import { JSX as JSX_2 } from 'react/jsx-runtime';
|
|
2
2
|
import * as React_2 from 'react';
|
|
3
3
|
|
|
4
|
+
declare type ConnectAppFeatures = {
|
|
5
|
+
poweredBy?: boolean;
|
|
6
|
+
merchantLogo?: boolean;
|
|
7
|
+
closeButton?: boolean;
|
|
8
|
+
dialogStartTransition?: ConnectDialogTransition;
|
|
9
|
+
dialogEndTransition?: ConnectDialogTransition;
|
|
10
|
+
dialogEdgeFormat?: ConnectDialogEdgeFormat;
|
|
11
|
+
};
|
|
12
|
+
|
|
4
13
|
export declare type ConnectAppInfo = {
|
|
5
14
|
name: string;
|
|
6
15
|
identifier?: string;
|
|
@@ -43,8 +52,8 @@ export declare enum ConnectPasswordOperationType {
|
|
|
43
52
|
}
|
|
44
53
|
|
|
45
54
|
export declare type ConnectPaymentProvider = {
|
|
46
|
-
|
|
47
|
-
|
|
55
|
+
technologyId: string;
|
|
56
|
+
settlementBy: string;
|
|
48
57
|
};
|
|
49
58
|
|
|
50
59
|
export declare type ConnectProps = {
|
|
@@ -64,14 +73,7 @@ export declare type ConnectProps = {
|
|
|
64
73
|
leadId?: string;
|
|
65
74
|
platforms?: Array<string>;
|
|
66
75
|
paymentProvider?: ConnectPaymentProvider;
|
|
67
|
-
features?:
|
|
68
|
-
poweredBy?: boolean;
|
|
69
|
-
merchantLogo?: boolean;
|
|
70
|
-
closeButton?: boolean;
|
|
71
|
-
dialogStartTransition?: ConnectDialogTransition;
|
|
72
|
-
dialogEndTransition?: ConnectDialogTransition;
|
|
73
|
-
dialogEdgeFormat?: ConnectDialogEdgeFormat;
|
|
74
|
-
};
|
|
76
|
+
features?: ConnectAppFeatures;
|
|
75
77
|
postUrl?: string;
|
|
76
78
|
redirectUrl?: string;
|
|
77
79
|
data?: Array<string>;
|
package/build/index.esm.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { jsx as t, jsxs as
|
|
2
|
-
import * as
|
|
1
|
+
import { jsx as t, jsxs as d, Fragment as y } from "react/jsx-runtime";
|
|
2
|
+
import * as p from "react";
|
|
3
3
|
import g from "react";
|
|
4
4
|
import w from "react-dom";
|
|
5
|
-
var
|
|
5
|
+
var C = /* @__PURE__ */ ((e) => (e.PAGE = "page", e.POPUP = "popup", e.CONTENT = "content", e))(C || {}), x = /* @__PURE__ */ ((e) => (e.AUTH = "auth", e.MERCHANT = "merchant", e))(x || {}), k = /* @__PURE__ */ ((e) => (e.SET_PASSWORD = "set_password", e.RESET_PASSWORD = "reset_password", e))(k || {}), S = /* @__PURE__ */ ((e) => (e.DARK = "dark", e.LIGHT = "light", e))(S || {}), A = /* @__PURE__ */ ((e) => (e.AR = "ar", e.EN = "en", e))(A || {}), R = /* @__PURE__ */ ((e) => (e.STRAIGHT = "straight", e.CURVED = "curved", e))(R || {}), L = /* @__PURE__ */ ((e) => (e.LEFT = "left", e.RIGHT = "right", e.UP = "up", e.DOWN = "down", e))(L || {}), u = /* @__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))(u || {}), h = /* @__PURE__ */ ((e) => (e.PROFILE_TOKEN = "profile_token", e.CONFIG_TOKEN = "config_token", e.THEME = "theme", e.LANGUAGE = "lang", e))(h || {});
|
|
6
6
|
const U = ({
|
|
7
7
|
outerStartColor: e = "rgba(244, 244, 244, 1)",
|
|
8
8
|
outerEndColor: n = "rgba(238, 238, 238, 1)",
|
|
@@ -30,8 +30,8 @@ const U = ({
|
|
|
30
30
|
height: "100%",
|
|
31
31
|
opacity: 0.9
|
|
32
32
|
},
|
|
33
|
-
children: /* @__PURE__ */
|
|
34
|
-
/* @__PURE__ */
|
|
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: [
|
|
35
35
|
/* @__PURE__ */ t(
|
|
36
36
|
"circle",
|
|
37
37
|
{
|
|
@@ -43,7 +43,7 @@ const U = ({
|
|
|
43
43
|
strokeWidth: "9.6",
|
|
44
44
|
strokeLinecap: "round",
|
|
45
45
|
strokeDasharray: "425 125",
|
|
46
|
-
children: i && /* @__PURE__ */
|
|
46
|
+
children: i && /* @__PURE__ */ d(y, { children: [
|
|
47
47
|
/* @__PURE__ */ t(
|
|
48
48
|
"animateTransform",
|
|
49
49
|
{
|
|
@@ -79,7 +79,7 @@ const U = ({
|
|
|
79
79
|
strokeWidth: "9.6",
|
|
80
80
|
strokeLinecap: "round",
|
|
81
81
|
strokeDasharray: "300 100",
|
|
82
|
-
children: i && /* @__PURE__ */
|
|
82
|
+
children: i && /* @__PURE__ */ d(y, { children: [
|
|
83
83
|
/* @__PURE__ */ t(
|
|
84
84
|
"animateTransform",
|
|
85
85
|
{
|
|
@@ -105,8 +105,8 @@ const U = ({
|
|
|
105
105
|
}
|
|
106
106
|
)
|
|
107
107
|
] }),
|
|
108
|
-
/* @__PURE__ */
|
|
109
|
-
/* @__PURE__ */
|
|
108
|
+
/* @__PURE__ */ d("defs", { children: [
|
|
109
|
+
/* @__PURE__ */ d(
|
|
110
110
|
"filter",
|
|
111
111
|
{
|
|
112
112
|
id: "filter0_dddi_1427_22275",
|
|
@@ -177,7 +177,7 @@ const U = ({
|
|
|
177
177
|
]
|
|
178
178
|
}
|
|
179
179
|
),
|
|
180
|
-
/* @__PURE__ */
|
|
180
|
+
/* @__PURE__ */ d(
|
|
181
181
|
"linearGradient",
|
|
182
182
|
{
|
|
183
183
|
id: "strokeGradientOuter_1427_22275",
|
|
@@ -192,7 +192,7 @@ const U = ({
|
|
|
192
192
|
]
|
|
193
193
|
}
|
|
194
194
|
),
|
|
195
|
-
/* @__PURE__ */
|
|
195
|
+
/* @__PURE__ */ d(
|
|
196
196
|
"linearGradient",
|
|
197
197
|
{
|
|
198
198
|
id: "strokeGradientInner_1427_22275",
|
|
@@ -212,23 +212,23 @@ const U = ({
|
|
|
212
212
|
}
|
|
213
213
|
)
|
|
214
214
|
}
|
|
215
|
-
), G = g.memo(U),
|
|
216
|
-
function
|
|
215
|
+
), G = g.memo(U), N = g.createContext({}), _ = () => g.useContext(N);
|
|
216
|
+
function I({ children: e, props: n }) {
|
|
217
217
|
const [r, o] = g.useState(!1), a = (s) => {
|
|
218
218
|
o(s);
|
|
219
219
|
}, i = () => {
|
|
220
220
|
o(!1);
|
|
221
221
|
};
|
|
222
|
-
return /* @__PURE__ */ t(
|
|
222
|
+
return /* @__PURE__ */ t(N.Provider, { value: { ...n, onLoadingHandler: a, loading: r, onLoaded: i }, children: e });
|
|
223
223
|
}
|
|
224
|
-
const
|
|
225
|
-
const { loading: n } =
|
|
226
|
-
return /* @__PURE__ */
|
|
224
|
+
const T = "https://connect-mw.dev.tap.company/middleware/v3/connect", B = "https://connect-mw.dev.tap.company/middleware/v3/connect", D = "https://connect-mw.dev.tap.company/middleware/v3/connect", F = "tap-connect-sdk-iframe", v = "https://connect.alpha.tap.company", P = ({ src: e }) => {
|
|
225
|
+
const { loading: n } = _();
|
|
226
|
+
return /* @__PURE__ */ d(y, { children: [
|
|
227
227
|
n && /* @__PURE__ */ t(G, { toggleAnimation: !0 }),
|
|
228
228
|
e && /* @__PURE__ */ t(
|
|
229
229
|
"iframe",
|
|
230
230
|
{
|
|
231
|
-
id:
|
|
231
|
+
id: F,
|
|
232
232
|
title: "connect",
|
|
233
233
|
src: e,
|
|
234
234
|
style: {
|
|
@@ -243,10 +243,10 @@ const I = "https://68b564fae5dc090291aeddd7.mockapi.io/api/config", P = "https:/
|
|
|
243
243
|
)
|
|
244
244
|
] });
|
|
245
245
|
};
|
|
246
|
-
var
|
|
246
|
+
var $ = function(e) {
|
|
247
247
|
var n, r;
|
|
248
248
|
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;
|
|
249
|
-
},
|
|
249
|
+
}, j = function(e) {
|
|
250
250
|
return e instanceof Error;
|
|
251
251
|
}, M = function(e) {
|
|
252
252
|
return typeof e == "string";
|
|
@@ -301,10 +301,10 @@ var j = function(e) {
|
|
|
301
301
|
configurable: !0,
|
|
302
302
|
writable: !0,
|
|
303
303
|
value: void 0
|
|
304
|
-
}),
|
|
304
|
+
}), $(n)) {
|
|
305
305
|
var r = H(n);
|
|
306
306
|
this.code = r.code, this.message = r.message;
|
|
307
|
-
} else if (
|
|
307
|
+
} else if (j(n)) {
|
|
308
308
|
var r = W(n);
|
|
309
309
|
this.code = r.code, this.message = r.message;
|
|
310
310
|
} else if (M(n)) {
|
|
@@ -344,53 +344,62 @@ const q = (e = "tap-connect-sdk-element") => {
|
|
|
344
344
|
if (n) return n;
|
|
345
345
|
const r = document.createElement("div");
|
|
346
346
|
return r.setAttribute("id", e), document.body.prepend(r), r;
|
|
347
|
-
},
|
|
347
|
+
}, z = (e) => e ? ["sa", "sau"].includes(e.toLowerCase()) : !1, J = (e) => e === "dr", V = (e = "") => {
|
|
348
348
|
const [n, r] = e.split("-");
|
|
349
|
-
return
|
|
350
|
-
}, Q = () => {
|
|
351
|
-
|
|
349
|
+
return z(n) ? J(r) ? D : B : T;
|
|
350
|
+
}, Q = (e) => {
|
|
351
|
+
var n;
|
|
352
|
+
return {
|
|
353
|
+
...e,
|
|
354
|
+
board: { display: e.showBoard, editable: e.boardEditable },
|
|
355
|
+
operator: { public_key: e.publicKey },
|
|
356
|
+
...((n = e.features) == null ? void 0 : n.dialogEdgeFormat) && { interface: { edges: e.features.dialogEdgeFormat } },
|
|
357
|
+
...e.leadId && { lead: { id: e.leadId } },
|
|
358
|
+
...e.postUrl && { post: { url: e.postUrl } },
|
|
359
|
+
...e.redirectUrl && { redirect: { url: e.redirectUrl } }
|
|
360
|
+
};
|
|
361
|
+
}, X = () => {
|
|
362
|
+
const [e, n] = p.useState(""), { onError: r, onLoadingHandler: o, loginMode: a, region: i, ...s } = _(), f = async () => {
|
|
352
363
|
o(!0);
|
|
353
364
|
try {
|
|
354
|
-
const
|
|
365
|
+
const c = await fetch(V(i), {
|
|
355
366
|
method: "POST",
|
|
356
367
|
headers: {
|
|
357
|
-
"Content-Type": "application/json"
|
|
368
|
+
"Content-Type": "application/json",
|
|
369
|
+
Authorization: `Bearer ${s.publicKey}`,
|
|
370
|
+
mdn: v
|
|
358
371
|
},
|
|
359
|
-
body: JSON.stringify(s)
|
|
372
|
+
body: JSON.stringify(Q(s))
|
|
360
373
|
});
|
|
361
|
-
if (!
|
|
362
|
-
throw new Error(`${
|
|
363
|
-
const l = await
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
if (s.mode !== O.PAGE) return n(l.redirect_url);
|
|
371
|
-
window.location.href = l.redirect_url;
|
|
372
|
-
} catch (d) {
|
|
373
|
-
const l = new Y(d);
|
|
374
|
+
if (!c.ok)
|
|
375
|
+
throw new Error(`${c.status}::${c.statusText}`);
|
|
376
|
+
const l = await c.json(), m = new URLSearchParams();
|
|
377
|
+
s != null && s.theme && m.append(h.THEME, s.theme), s != null && s.language && m.append(h.LANGUAGE, s.language);
|
|
378
|
+
const b = a ? `${v}/auth` : v;
|
|
379
|
+
if (m.append(h.CONFIG_TOKEN, l.token), l.connect.url = `${b}?${m.toString()}`, s.mode !== C.PAGE) return n(l.connect.url);
|
|
380
|
+
window.location.href = l.connect.url;
|
|
381
|
+
} catch (c) {
|
|
382
|
+
const l = new Y(c);
|
|
374
383
|
r == null || r(l.getClientError()), o(!1);
|
|
375
384
|
}
|
|
376
385
|
};
|
|
377
|
-
return
|
|
378
|
-
|
|
386
|
+
return p.useEffect(() => {
|
|
387
|
+
f();
|
|
379
388
|
}, []), { connectLink: e };
|
|
380
|
-
},
|
|
381
|
-
const { onSuccess: e, onClose: n, onError: r, onReady: o, onLoaded: a } =
|
|
389
|
+
}, Z = () => {
|
|
390
|
+
const { onSuccess: e, onClose: n, onError: r, onReady: o, onLoaded: a } = _(), i = p.useCallback(
|
|
382
391
|
async (s) => {
|
|
383
|
-
if (s.origin !==
|
|
384
|
-
const { data:
|
|
385
|
-
switch (
|
|
392
|
+
if (s.origin !== v) return;
|
|
393
|
+
const { data: f, event: c } = s.data;
|
|
394
|
+
switch (c) {
|
|
386
395
|
case u.ON_CLOSE:
|
|
387
396
|
n == null || n();
|
|
388
397
|
break;
|
|
389
398
|
case u.ON_ERROR:
|
|
390
|
-
r == null || r(
|
|
399
|
+
r == null || r(f);
|
|
391
400
|
break;
|
|
392
401
|
case u.ON_SUCCESS:
|
|
393
|
-
e(
|
|
402
|
+
e(f);
|
|
394
403
|
break;
|
|
395
404
|
case u.ON_LOADED:
|
|
396
405
|
a();
|
|
@@ -402,12 +411,12 @@ const q = (e = "tap-connect-sdk-element") => {
|
|
|
402
411
|
},
|
|
403
412
|
[n, r, a, o, e]
|
|
404
413
|
);
|
|
405
|
-
|
|
414
|
+
p.useEffect(() => (window.addEventListener("message", i, !1), () => {
|
|
406
415
|
window.removeEventListener("message", i);
|
|
407
416
|
}), [i]);
|
|
408
|
-
},
|
|
409
|
-
const { connectLink: e } =
|
|
410
|
-
return
|
|
417
|
+
}, ee = () => {
|
|
418
|
+
const { connectLink: e } = X();
|
|
419
|
+
return Z(), /* @__PURE__ */ t(
|
|
411
420
|
"div",
|
|
412
421
|
{
|
|
413
422
|
id: "tap-connect-main-container",
|
|
@@ -422,24 +431,24 @@ const q = (e = "tap-connect-sdk-element") => {
|
|
|
422
431
|
width: "100%",
|
|
423
432
|
height: "100%"
|
|
424
433
|
},
|
|
425
|
-
children: /* @__PURE__ */ t(
|
|
434
|
+
children: /* @__PURE__ */ t(P, { src: e })
|
|
426
435
|
}
|
|
427
436
|
);
|
|
428
|
-
},
|
|
429
|
-
var
|
|
430
|
-
|
|
431
|
-
const
|
|
432
|
-
const r = q(e), o =
|
|
433
|
-
return o.render(/* @__PURE__ */ t(
|
|
437
|
+
}, te = (e) => /* @__PURE__ */ t(I, { props: e, children: e.open && /* @__PURE__ */ t(ee, {}) }), re = p.memo(te);
|
|
438
|
+
var O, E = w;
|
|
439
|
+
O = E.createRoot, E.hydrateRoot;
|
|
440
|
+
const se = (e, n) => {
|
|
441
|
+
const r = q(e), o = O(r);
|
|
442
|
+
return o.render(/* @__PURE__ */ t(re, { ...n })), { unmount: () => o.unmount() };
|
|
434
443
|
};
|
|
435
444
|
export {
|
|
436
445
|
R as ConnectDialogEdgeFormat,
|
|
437
446
|
L as ConnectDialogTransition,
|
|
438
|
-
|
|
447
|
+
re as ConnectElement,
|
|
439
448
|
A as ConnectLanguage,
|
|
440
|
-
|
|
449
|
+
C as ConnectMode,
|
|
441
450
|
k as ConnectPasswordOperationType,
|
|
442
451
|
x as ConnectScope,
|
|
443
452
|
S as ConnectTheme,
|
|
444
|
-
|
|
453
|
+
se as renderConnectElement
|
|
445
454
|
};
|
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.29-test",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "build/index.cjs.js",
|
|
7
7
|
"module": "build/index.esm.js",
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
"vite-tsconfig-paths": "^5.1.4"
|
|
68
68
|
},
|
|
69
69
|
"lint-staged": {
|
|
70
|
-
"*.{js,ts,tsx,json,css,yml}": [
|
|
70
|
+
"*.{js,ts,tsx,json,css,yml,md,html}": [
|
|
71
71
|
"prettier --write",
|
|
72
72
|
"eslint"
|
|
73
73
|
]
|