@notabene/javascript-sdk 2.0.0-next.10 → 2.0.0-next.11

package/README.md

@@ -5,8 +5,7 @@
 
 # JavaScript SDK
 
-[![pipeline status](https://gitlab.com/notabene/open-source/javascript-sdk/badges/master/pipeline.svg)](https://gitlab.com/notabene/open-source/javascript-sdk/-/commits/master)
-[![Latest Release](https://gitlab.com/notabene/open-source/javascript-sdk/-/badges/release.svg)](https://gitlab.com/notabene/open-source/javascript-sdk/-/releases)
+[![pipeline status](https://gitlab.com/notabene/open-source/javascript-sdk/badges/v2/pipeline.svg)](https://gitlab.com/notabene/open-source/javascript-sdk/-/commits/v2)
 
 This library is the JavaScript SDK for loading the Notabene UX components in the front-end.
 
@@ -27,12 +26,16 @@ This library is the JavaScript SDK for loading the Notabene UX components in the
     - [Asset specification](#asset-specification)
     - [Transaction amount specification](#transaction-amount-specification)
     - [Destination address](#destination-address)
-    - [Error handling](#error-handling)
-  - [Customization](#customization)
-    - [Functionality](#functionality)
-    - [Pass the variables in the configuration](#pass-the-variables-in-the-configuration)
-    - [Fields Properties](#fields-properties)
-    - [Transaction Custom Asset Price](#transaction-custom-asset-price)
+    - [Destination address](#destination-address-1)
+  - [Connect Wallet](#connect-wallet)
+    - [Asset specification](#asset-specification-1)
+    - [Modal](#modal)
+    - [Linked Component](#linked-component-1)
+  - [Error handling](#error-handling)
+  - [Transaction Options](#transaction-options)
+    - [Common use cases](#common-use-cases)
+    - [Configuring ownership proofs](#configuring-ownership-proofs)
+    - [Counterparty Field Properties](#counterparty-field-properties)
   - [License](#license)
 
 ## Installation
@@ -40,7 +43,7 @@ This library is the JavaScript SDK for loading the Notabene UX components in the
 There are two options for loading the Notabene SDK:
 
 ```bash
-<script id="notabene" async src="https://unpkg.com/@notabene/javascript-sdk@1.31.0/dist/es/index.js"></script>
+<script id="notabene" async src="https://unpkg.com/@notabene/javascript-sdk@next/dist/notabene.js"></script>
 ```
 
 Or installing the library:
@@ -121,7 +124,7 @@ withdrawal.update({
 To be notified once the validation is completed so you can submit the withdrawal to your back end:
 
 ```js
-withdrawal.on('valid', {ivms101} => ...)
+withdrawal.on('complete', {valid, txCreate } => ...)
 ```
 
 To be notified of any errors use:
@@ -168,7 +171,6 @@ The `asset` field the following types of assets specified:
 Use one of the following
 
 - `amountDecimal` A number specifying the amount in decimal format. Eg. `amountDecimal=1.1` would mean 1.1 of for example BTC or ETH.
-- `amountSubunits` A string specifying the amount in the native blockchain subunits eg Satoshi for Bitcoin or wei for Ethereum
 
 ### Destination address
 
@@ -179,108 +181,282 @@ Specify the beneficiary address as `destination` using one of the following form
 - [BIP-21](https://en.bitcoin.it/wiki/BIP_0021) Bitcoin URI
 - Native blockchain address
 
----
+### Destination address
 
-### Error handling
+The price of the asset is used to determine certain rules based on thresholds. We recommond you pass in your price like this:
 
-If any error occurs, the `onError` function from the Notabene instance will be triggered. The `error` passed as argument contains a `data` property that has the following type `ErrorData`.
+```ts
+assetPrice: {
+  currency: 'USD', // ISO currency code
+  price: 1700.12, // Asset price
+};
+```
 
-> ⚠️ **Note**: These errors are mainly used for debugging internal issues while implementing the widget. They are not meant to be shown directly to the end user.
+## Connect Wallet
 
-```js
-type ErrorData = {
-  title: string;
-  detail: string;
-  code: number;
-  type: string;
-};
+The Connect Wallet component helps you collect and verify the address of your users self-hosted wallet in one go.
 
-const notabene = new Notabene({
-  ...,
-  onError: (err) => {
-    const errorData = err.data;
+### Asset specification
 
-    // Do something
-  },
-});
-```
+The `asset` field the following types of assets specified:
 
-**Notabene Internal Errors**
+- `notabene_asset` code passed as a`string`. See [Notabene Assets Service](https://devx.notabene.id/docs/coins-decimals#assets-service-api).
+- [CAIP-19](https://github.com/ChainAgnostic/CAIPs/blob/main/CAIPs/caip-19.md_) is a chain agnostic format allows you to support the widest amount of assets and blockchains including NFTs.
+- [DTI](https://www.iso.org/standard/80601.html) is the ISO Digital Token Identifier format. See [DTI registry](https://dtif.org/registry-search/) for supported tokens.
 
-Type | Code | Title | Detail
--- | -- | -- | --
-`BAD_REQUEST` | `400` | `Bad Request` | `NotabeneBadRequest: ...`
-`TRANSACTION_INVALID` | `400` | `Transaction Invalid` | `NotabeneTransactionInvalid: ...`
-`TOKEN_INVALID` | `401` | `Token Invalid` | `NotabeneTokenInvalid: ...`
-`ASSET_NOT_SUPPORTED` | `404` | `Asset Not Supported` | `NotabeneAssetNotSupported: ...`
-`SERVICE_UNAVAILABLE` | `500` | `Service Unavailable` | `NotabeneServiceUnavailable: ...`
-`WALLET_CONNECTED_FAILED` | `500` | `Wallet Connection Failed` | `NotabeneWalletConnectionFailed: ...`
-`WALLET_NOT_SUPPORTED` | `501` | `Wallet Not Supported` | `NotabeneWalletNotSupported: ...`
 
-## Customization
+### Modal
 
-`nonCustodialDeclarationType`: `SIGNATURE` | `DECLARATION`
+Instantiate the modal and open it
 
-For deciding which ownership proof type you want to use.
+```js
+const connect = notabene.createConnectWallet({asset:'ETH'}, options);
+const {valid, ivms101, proof } = await connect.openModal();
+```
 
-`SIGNATURE`: The ownership proof will be signed by the originator using a wallet. (DEFAULT)
-`DECLARATION`: The ownership proof will be declared by the originator using a checkbox.
+### Linked Component
 
----
+In some cases, in particular institutional or mobile apps you may prefer to link your customers to the component through an email or redirect the user to it in a mobile app.
 
-`counterpartyManualEntry`: `TRUE` | `FALSE`
+```js
+const connect = notabene.createConnectWallet({asset:'ETH'}, options, {
+  callback: /// a serverside backend url
+  redirectUri: // URI of website or mobile app to redirect user to after completion
+});
 
-For deciding if you would like to allow your customer to provide a manual counterparty vasp name in the counterparty field.
+// NodeJS redirect. Link also works in an email.
+res.redirect(withdrawal.url);
+```
+
+Bear in mind that this is a full screen view for your users.
+
+The two parameters that should be configured are:
+
+- `callback` - a URL for your serverside. On completion this will receive an HTTP POST with the result as a json body and the `authToken` as an `Authorization: Bearer` header.
+- `redirectUri` - the user will be redirected here on completion. The result parameters will be json encoded in the URL fragment. You can use a mobile app schema to intercept these in your mobile app.
+
+**Note** for data privacy reasons the callback will be coming from your users web browser and not from our infrastructure, so no static IP is currently possible. Instead please check the `authToken` provided with the request.
 
 ---
 
-### Fields Properties
+## Error handling
 
-Possible fields customization support:
+If any error occurs, the `error` event is passed containing a message.
 
-| field name               | `forceDisplay` | `optional` | description                                             |
-| ------------------------ | -------------- | ---------- | ------------------------------------------------------- |
-| `dateAndPlaceOfBirth`    | ☑️             | --         | Recipient (or Sender) Date and Place of Birth           |
-| `geographicAddress`      | ☑️             | ☑️          | Recipient (or Sender) Address                           |
-| `name`                   | ☑️             | --         | Recipient (or Sender) Last Name / Company Name          |
-| `nationalIdentification` | ☑️             | --️         | Recipient (or Sender) National Identification           |
-| `country`                | ☑️             | ☑️          | Recipient (or Sender) Country of Residence (for natural person) / Country of Registration (for legal person)           |
+```ts
+withdrawal.on('error', {message} => ...)
+```
 
-**Field Options**
+## Transaction Options
 
-- **forceDisplay** - Force a field that is not required by your jurisdiction to be displayed - defaults to **false**
-- **optional** - Bypass the jurisdiction rules validation for that specific field - defaults to **false**
+All components can be configured using an optional [TransactionOptions](./docs/interfaces/TransactionOptions.md) object.
 
-```js
-{
-  counterparty: {
-    optional: true;
+The following shows the full set of options in typescript:
+
+```ts
+const options: TransactionOptions = {
+  proofs: {
+    microTransfer: {
+      destination: '0x...',
+      timeout: 86440,
+    },
+    fallbacks: [ProofTypes.Screenshot, ProofTypes.SelfDeclaration],
   },
-  geographicAddress: {
-    forceDisplay: true,
-    optional: true;
+  allowedAgentTypes: [AgentType.PRIVATE, AgentType.VASP],
+  allowedCounterpartyTypes: [
+    PersonType.LEGAL,
+    PersonType.NATURAL,
+    PersonType.SELF,
+  ],
+  fields: {
+    naturalPerson: {
+      name: true, // Default true
+      website: { optional: true },
+      email: true,
+      phone: true,
+      geographicAddress: false,
+      nationalIdentification: false,
+      dateOfBirth: false,
+      placeOfBirth: false,
+      countryOfResidence: true,
+    },
+    legalPerson: {
+      name: true, // Default true
+      lei: true, // Default true
+      website: { optional: true }, // Default true
+      email: true,
+      phone: true,
+      geographicAddress: false,
+      nationalIdentification: false,
+      countryOfRegistration: true,
+    },
   },
+};
+const withdrawal = notabene.createWithdrawalAssist(tx, options);
+```
+
+### Common use cases
+
+#### Only allow first party transactions
+
+```ts
+const firstParty: TransactionOptions = {
+  allowedCounterpartyTypes: [
+    PersonType.SELF,
+  ],
+};
+```
+
+#### Only VASP to VASP transactions
+
+```ts
+const vasp2vasp: TransactionOptions = {
+  allowedAgentTypes: [AgentType.VASP],
+};
+```
+
+#### Only Self-hosted wallet transactions
+
+```ts
+const options: TransactionOptions = {
+  allowedAgentTypes: [AgentType.PRIVATE],
+};
+```
+
+### Configuring ownership proofs
+
+By default components support message signing proofs.
+
+
+#### Supporting Micro Transactions (aka Satoshi tests)
+
+You can support Micro Transfers (aka Satoshi tests) by adding a deposit address for the test.
+
+Your compliance team will have to determine how to handle and verify these transactions in the rules engine or individually.
+
+```ts
+const options: TransactionOptions = {
+  proofs: {
+    microTransfer: {
+      destination: '0x...',
+      timeout: 86440, // Optional timeout in seconds, which is displayed to the user
+    },
+    fallbacks: [ProofTypes.Screenshot, ProofTypes.SelfDeclaration],
+  }
+}
+```
+
+Notabene does not currently verify these tests automatically as you likely already have the infrastructure to do so.
+
+You will receive a response back from the component containing a proof object. For MicroTransfers it will look like this:
+
+```ts
+type MicroTransferProof {
+  type: ProofTypes.MicroTransfer;
+  status: ProofStatus.PENDING;
+  did: DID;
+  address: CAIP10; // CAIP10 account to be verified
+  txhash: string; // Transaction Hash to verify
+  chain: CAIP2; // CAIP2 identifier of blockchain
+  amountSubunits: string; // Amount in subunits eg (satoshi or wei) to be verified
 }
 ```
 
+#### Fallback Proof Options
 
+You may accept a few options if none of the other are available. We do not recommend them, as they do not provide sufficient proof. However many VASPs do allow them for now:
 
-### Transaction Custom Asset Price
+```ts
+const options: TransactionOptions = {
+  proofs: {
+    fallbacks: [ProofTypes.Screenshot, ProofTypes.SelfDeclaration],
+  }
+}
+```
+The two options are:
 
-To use your own asset price as fallback in case an asset is not supported by Notabene, you can provide a `customAssetPrice` object that will be used instead to render the widget with the correct jurisdiction requirements.
+- `screenshot` Where a user is requested to upload a screenshot of their wallet
+- `self-declaration` Where a user self declares that they control the wallet address
 
-```js
-notabene.setTransaction({
-  transactionAsset: 'ASSET_UNSUPPORTED_FROM_NOTABENE',
-  beneficiaryAccountNumber: '0x8d12a197cb00d4747a1fe03395095ce2a5cc6819',
-  transactionAmount: '2000000000',
-  customAssetPrice: {
-      priceUSD: 1700.12, // Asset price in USD
-      decimals: 10 // Decimals used for the given transactionAmount
-    };
-});
+### Counterparty Field Properties
+
+The fields requested from a customer about a counterparty can be configured with the fields object. You can configure required and optional fields individually for both natural and legal persons.
+
+We recommend working closely with your compliance team for this. Bearing in mind that different jurisdictions have different rules.
+
+Each field can be configured like this:
+
+- `true` required field
+- `false` don't show
+- `{ optional: true }` show but don't require
+- `{ transmit: true }` Include in beneficiary field of IVMS101 to be transmitted to counterparty
+
+Eg:
+```ts
+{
+  naturalPerson: {
+    website: { optional: true },
+    email: true,
+    phone: false,
+  }
+}
+```
+The above will always ask the user for the following for natural persons:
+
+- `name` since it is on by default (you can disable it explicitly by setting it to `false`)
+- `website` is show but is optional
+- `email` is required
+
+
+#### Full Example
+
+```ts
+const options: TransactionOptions = {
+  fields: {
+    naturalPerson: {
+      name: true, // Default true
+      website: { optional: true },
+      email: true,
+      phone: true,
+      geographicAddress: false,
+      nationalIdentification: false,
+      dateOfBirth: {
+        transmit: true
+      },
+      placeOfBirth: false,
+      countryOfResidence: true,
+    },
+    legalPerson: {
+      name: true, // Default true
+      lei: true, // Default true
+      website: { optional: true }, // Default true
+      email: true,
+      phone: true,
+      geographicAddress: false,
+      nationalIdentification: false,
+      countryOfRegistration: true,
+    },
+  },
+};
 ```
 
+#### Field reference
+
+| Field name               | Natural | Legal | IVMS101 | Transmitted | description                                   |
+|--------------------------|---------|-------|---------|-------------|-----------------------------------------------|
+| `name`                   | ✅      | ✅    | ✅      | ✅          | Full name                                     |
+| `email`                  | 🟩      | 🟩    | --      | --          | Email (for your internal purposes)            |
+| `website`                | --      | ✅    | --      | --          | Business Website (for your internal purposes) |
+| `phone`                  | 🟩      | 🟩    | --      | --          | Mobile Phone (for your internal purposes)     |
+| `geographicAddress`      | 🟩      | 🟩    | ✅      | 🟩          | Residencial or business address               |
+| `nationalIdentification` | 🟩      | 🟩    | ✅      | 🟩          | National Identification number                |
+| `dateOfBirth`            | 🟩      | --    | ✅      | 🟩          | Date of birth                                 |
+| `placeOfBirth`           | 🟩      | --    | ✅      | 🟩          | Place of birth                                |
+| `countryOfResidence`     | 🟩      | --    | ✅      | 🟩          | Country of Residence                          |
+| `lei`                    | --      | ✅    | ✅      | ✅          | LEI (Legal Entity Identifier)                 |
+| `countryOfRegistration`  | --      | 🟩    | ✅      | 🟩          | Country of Registration                       |
+
+
 ## [License](LICENSE.md)
 
-BSD 3-Clause © Notabene Inc.
+MIT © Notabene Inc.

package/dist/notabene.cjs

@@ -1 +1 @@
-"use strict";var d=Object.defineProperty;var c=(r,e,t)=>e in r?d(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t;var n=(r,e,t)=>c(r,typeof e!="symbol"?e+"":e,t);var a=(r=>(r.COMPLETE="complete",r.RESIZE="resize",r.RESULT="result",r.READY="ready",r.INVALID="invalid",r.MODAL="openModal",r.ERROR="error",r.CLOSE="closeModal",r.CANCEL="cancel",r))(a||{}),l=(r=>(r.UPDATE="update",r.REQUEST_RESPONSE="requestResponse",r))(l||{});class m{constructor(){n(this,"listeners",new Map);n(this,"port");this.handleMessage=this.handleMessage.bind(this)}setPort(e){this.port=e,this.port.onmessage=this.handleMessage,this.port.start()}on(e,t){this.listeners.has(e)||this.listeners.set(e,new Set),this.listeners.get(e).add(t)}off(e,t){const s=this.listeners.get(e);s&&(s.delete(t),s.size===0&&this.listeners.delete(e))}handleMessage(e){console.log("received message",e.data);const t=e.data;if(typeof t=="object"&&t!==null&&"type"in t){const s=t.type,o=this.listeners.get(s);o&&o.forEach(i=>i(t))}}send(e){this.port&&this.port.postMessage(e)}}class u{constructor(e,t){n(this,"_url");n(this,"_value");n(this,"_errors",[]);n(this,"iframe");n(this,"eventManager");n(this,"ready",!1);n(this,"modal");this._url=e,this._value=t,this.eventManager=new m,this.on(a.INVALID,s=>{s.type===a.INVALID&&(this._errors=s.errors,this._value=s.value)}),this.on(a.RESIZE,s=>{s.type===a.RESIZE&&this.iframe&&(this.iframe.style.height=`${s.height}px`)})}get url(){return this._url}get value(){return this._value}get errors(){return this._errors}open(){document.location.href=this.url}mount(e){const t=document.querySelector(e);if(!t)throw new Error(`parentID ${e} not found`);this.embed(t)}embed(e){var t,s;this.iframe=document.createElement("iframe"),this.iframe.src=this.url,this.iframe.style.width="100%",this.iframe.style.height="100px",this.iframe.style.border="none",this.iframe.style.overflow="hidden",this.iframe.setAttribute("allowtransparency","true"),this.iframe.style.backgroundColor="transparent",e.appendChild(this.iframe),window.addEventListener("message",o=>{var i,h;o.source===((i=this.iframe)==null?void 0:i.contentWindow)&&(console.log("received message from iframe",o.data),(h=this.eventManager)==null||h.setPort(o.ports[0]),this.ready=!0)}),(s=(t=this.iframe)==null?void 0:t.contentWindow)==null||s.focus()}send(e){this.eventManager.send(e)}on(e,t){this.eventManager.on(e,t)}off(e,t){this.eventManager.off(e,t)}update(e){this._value=e,this.send({type:l.UPDATE,value:e})}completion(){return new Promise((e,t)=>{this.closeModal(),this.on(a.COMPLETE,s=>{e(s.response)}),this.on("error",s=>{t(new Error(s.message))})})}openModal(){this.modal&&this.closeModal(),this.modal=document.createElement("dialog"),document.body.appendChild(this.modal),this.embed(this.modal),this.on(a.CANCEL,()=>{this.closeModal()}),this.on(a.CLOSE,()=>{this.closeModal()}),this.on(a.COMPLETE,()=>{this.closeModal()}),this.modal.showModal(),this.modal.addEventListener("click",()=>{this.closeModal()})}closeModal(){var e;this.modal&&(console.log("closeModal"),(e=this.modal)==null||e.close(),this.modal.remove(),this.modal=void 0)}}function f(r){return Object.entries(r).map(([e,t])=>{if(!(e&&t))return;const s=encodeURIComponent(e),o=encodeURIComponent(typeof t=="object"?JSON.stringify(t):t);return`${s}=${o}`}).filter(e=>!!e).join("&")}class p{constructor(e){n(this,"nodeUrl");n(this,"authToken");n(this,"uxUrl");n(this,"theme");n(this,"locale");this.uxUrl=e.uxUrl||"https://connect.notabene.id",this.nodeUrl=e.nodeUrl,this.authToken=e.authToken,this.theme=e.theme,this.locale=e.locale}componentUrl(e,t,s,o){const i=new URL(this.uxUrl);i.pathname=e;const h=f({authToken:this.authToken,value:t,configuration:s});return i.hash=h,this.nodeUrl&&i.searchParams.set("nodeUrl",this.nodeUrl),this.theme&&i.searchParams.set("theme",JSON.stringify(this.theme)),this.locale&&i.searchParams.set("locale",this.locale),o&&(o.callback&&i.searchParams.set("callback_url",o.callback),o.redirectUri&&i.searchParams.set("redirect_uri",o.redirectUri)),i.toString()}createComponent(e,t,s,o){return new u(this.componentUrl(e,t,s,o),t)}createWithdrawalAssist(e,t,s){return this.createComponent("withdrawal-assist",e,t,s)}createDepositAssist(e,t,s){return this.createComponent("deposit-assist",e,t,s)}createConnect(e,t,s){return this.createComponent("connect",e,t,s)}createDepositRequest(e,t,s){return this.createComponent("deposit-request",e,t,s)}decodeFragmentToObject(e){return e.slice(1).split("&").reduce((s,o)=>{const[i,h]=o.split("=");return s[decodeURIComponent(i)]=decodeURIComponent(h),s},{})}}module.exports=p;
+"use strict";var d=Object.defineProperty;var c=(r,e,t)=>e in r?d(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t;var n=(r,e,t)=>c(r,typeof e!="symbol"?e+"":e,t);var a=(r=>(r.COMPLETE="complete",r.RESIZE="resize",r.RESULT="result",r.READY="ready",r.INVALID="invalid",r.MODAL="openModal",r.ERROR="error",r.CLOSE="closeModal",r.CANCEL="cancel",r))(a||{}),l=(r=>(r.UPDATE="update",r.REQUEST_RESPONSE="requestResponse",r))(l||{});class m{constructor(){n(this,"listeners",new Map);n(this,"port");this.handleMessage=this.handleMessage.bind(this)}setPort(e){this.port=e,this.port.onmessage=this.handleMessage,this.port.start()}on(e,t){this.listeners.has(e)||this.listeners.set(e,new Set),this.listeners.get(e).add(t)}off(e,t){const s=this.listeners.get(e);s&&(s.delete(t),s.size===0&&this.listeners.delete(e))}handleMessage(e){console.log("received message",e.data);const t=e.data;if(typeof t=="object"&&t!==null&&"type"in t){const s=t.type,o=this.listeners.get(s);o&&o.forEach(i=>i(t))}}send(e){this.port&&this.port.postMessage(e)}}class u{constructor(e,t){n(this,"_url");n(this,"_value");n(this,"_errors",[]);n(this,"iframe");n(this,"eventManager");n(this,"modal");this._url=e,this._value=t,this.eventManager=new m,this.on(a.INVALID,s=>{s.type===a.INVALID&&(this._errors=s.errors,this._value=s.value)}),this.on(a.RESIZE,s=>{s.type===a.RESIZE&&this.iframe&&(this.iframe.style.height=`${s.height}px`)})}get url(){return this._url}get value(){return this._value}get errors(){return this._errors}open(){document.location.href=this.url}mount(e){const t=document.querySelector(e);if(!t)throw new Error(`parentID ${e} not found`);this.embed(t)}embed(e){var t,s;this.iframe=document.createElement("iframe"),this.iframe.src=this.url,this.iframe.style.width="100%",this.iframe.style.height="100px",this.iframe.style.border="none",this.iframe.style.overflow="hidden",this.iframe.setAttribute("allowtransparency","true"),this.iframe.style.backgroundColor="transparent",e.appendChild(this.iframe),window.addEventListener("message",o=>{var i,h;o.source===((i=this.iframe)==null?void 0:i.contentWindow)&&(console.log("received message from iframe",o.data),(h=this.eventManager)==null||h.setPort(o.ports[0]))}),(s=(t=this.iframe)==null?void 0:t.contentWindow)==null||s.focus()}send(e){this.eventManager.send(e)}on(e,t){this.eventManager.on(e,t)}off(e,t){this.eventManager.off(e,t)}update(e){this._value=e,this.send({type:l.UPDATE,value:e})}completion(){return new Promise((e,t)=>{this.on(a.COMPLETE,s=>{e(s.response)}),this.on("error",s=>{t(new Error(s.message))})})}openModal(){return this.modal&&this.closeModal(),this.modal=document.createElement("dialog"),this.modal.style.border="none",this.modal.style.backgroundColor="transparent",this.modal.style.maxWidth="100vw",this.modal.style.maxHeight="100vh",this.modal.style.width="600px",this.modal.style.height="800px",document.body.appendChild(this.modal),this.embed(this.modal),this.on(a.CANCEL,()=>{this.closeModal()}),this.on(a.CLOSE,()=>{this.closeModal()}),this.on(a.COMPLETE,()=>{this.closeModal()}),this.modal.showModal(),this.modal.addEventListener("click",()=>{this.closeModal()}),this.completion()}closeModal(){var e;this.modal&&(console.log("closeModal"),(e=this.modal)==null||e.close(),this.modal.remove(),this.modal=void 0)}}function p(r){return Object.entries(r).map(([e,t])=>{if(!(e&&t))return;const s=encodeURIComponent(e),o=encodeURIComponent(typeof t=="object"?JSON.stringify(t):t);return`${s}=${o}`}).filter(e=>!!e).join("&")}class f{constructor(e){n(this,"nodeUrl");n(this,"authToken");n(this,"uxUrl");n(this,"theme");n(this,"locale");this.uxUrl=e.uxUrl||"https://connect.notabene.id",this.nodeUrl=e.nodeUrl,this.authToken=e.authToken,this.theme=e.theme,this.locale=e.locale}componentUrl(e,t,s,o){const i=new URL(this.uxUrl);i.pathname=e;const h=p({authToken:this.authToken,value:t,configuration:s});return i.hash=h,this.nodeUrl&&i.searchParams.set("nodeUrl",this.nodeUrl),this.theme&&i.searchParams.set("theme",JSON.stringify(this.theme)),this.locale&&i.searchParams.set("locale",this.locale),o&&(o.callback&&i.searchParams.set("callback_url",o.callback),o.redirectUri&&i.searchParams.set("redirect_uri",o.redirectUri)),i.toString()}createComponent(e,t,s,o){return new u(this.componentUrl(e,t,s,o),t)}createWithdrawalAssist(e,t,s){return this.createComponent("withdrawal-assist",e,t,s)}createDepositAssist(e,t,s){return this.createComponent("deposit-assist",e,t,s)}createConnectWallet(e,t,s){return this.createComponent("connect",e,t,s)}createDepositRequest(e,t,s){return this.createComponent("deposit-request",e,t,s)}decodeFragmentToObject(e){return e.slice(1).split("&").reduce((s,o)=>{const[i,h]=o.split("=");return s[decodeURIComponent(i)]=decodeURIComponent(h),s},{})}}module.exports=f;