@notabene/javascript-sdk 2.0.0-next.16 → 2.0.0-next.17

package/README.md

@@ -83,7 +83,7 @@ Create a new Notabene instance:
 const notabene = new Notabene({
   nodeUrl: 'https://api.notabene.id', // use `https://api.notabene.dev` for testing
   authToken: '{CUSTOMER_TOKEN}',
-  locale: 'de' // default locale = `en`
+  locale: 'de', // default locale = `en`
 });
 ```
 
@@ -107,19 +107,20 @@ Instantiate the withdrawal element and mount it using the id from above
 
 ```js
 const withdrawal = notabene.createWithdrawalAssist(tx, options);
-withdrawal.mount("nb-withdrawal");
+withdrawal.mount('nb-withdrawal');
 ```
 
 The simplest way to get the result is to use:
 
 ```js
 try {
- const { valid, value, txCreate, ivms101, proof } = await withdrawal.completion()
- if (valid) {
-  // Submit result to your backend
- }
+  const { valid, value, txCreate, ivms101, proof } =
+    await withdrawal.completion();
+  if (valid) {
+    // Submit result to your backend
+  }
 } catch (e) {
- console.error(e)
+  console.error(e);
 }
 ```
 
@@ -131,7 +132,7 @@ To update the component as users enter transaction details:
 withdrawal.update({
   asset: 'ETH',
   destination: '0x8d12a197cb00d4747a1fe03395095ce2a5cc6819',
-  amountDecimal: 1.12
+  amountDecimal: 1.12,
 });
 ```
 
@@ -218,13 +219,12 @@ The `asset` field the following types of assets specified:
 - [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.
 
-
 ### Modal
 
 Instantiate the modal and open it
 
 ```js
-const connect = notabene.createConnectWallet({asset:'ETH'}, options);
+const connect = notabene.createConnectWallet({ asset: 'ETH' }, options);
 const { valid, value, txCreate, ivms101, proof } = await connect.openModal();
 ```
 
@@ -269,10 +269,10 @@ The following shows the full set of options in typescript:
 
 ```ts
 import Notabene, {
-		AgentType,
-		PersonType,
-		ProofTypes,
-	} from '@notabene/javascript-sdk';
+  AgentType,
+  PersonType,
+  ProofTypes,
+} from '@notabene/javascript-sdk';
 
 const options: TransactionOptions = {
   proofs: {
@@ -313,8 +313,8 @@ const options: TransactionOptions = {
     },
     vasps: {
       addUnknown: true, // Allow users to add a missing VASP - Defaults to false
-      onlyActive: true // Only list active VASPs - Default false
-    }
+      onlyActive: true, // Only list active VASPs - Default false
+    },
   },
 };
 const withdrawal = notabene.createWithdrawalAssist(tx, options);
@@ -352,7 +352,6 @@ const options: TransactionOptions = {
 
 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.
@@ -368,8 +367,8 @@ const options: TransactionOptions = {
       timeout: 86440, // Optional timeout in seconds, which is displayed to the user
     },
     fallbacks: [ProofTypes.Screenshot, ProofTypes.SelfDeclaration], // js ['screenshot','self_declaration']
-  }
-}
+  },
+};
 ```
 
 Notabene does not currently verify these tests automatically as you likely already have the infrastructure to do so.
@@ -396,9 +395,10 @@ You may accept a few options if none of the other are available. We do not recom
 const options: TransactionOptions = {
   proofs: {
     fallbacks: [ProofTypes.Screenshot, ProofTypes.SelfDeclaration], // js ['screenshot','self_declaration']
-  }
-}
+  },
+};
 ```
+
 The two options are:
 
 - `screenshot` Where a user is requested to upload a screenshot of their wallet
@@ -418,6 +418,7 @@ Each field can be configured like this:
 - `{ transmit: true }` Include in beneficiary field of IVMS101 to be transmitted to counterparty
 
 Eg:
+
 ```ts
 {
   naturalPerson: {
@@ -427,13 +428,13 @@ Eg:
   }
 }
 ```
+
 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
@@ -447,7 +448,7 @@ const options: TransactionOptions = {
       geographicAddress: false,
       nationalIdentification: false,
       dateOfBirth: {
-        transmit: true
+        transmit: true,
       },
       placeOfBirth: false,
       countryOfResidence: true,
@@ -469,7 +470,7 @@ const options: TransactionOptions = {
 #### 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) |

package/dist/notabene.cjs

@@ -1 +1 @@
-"use strict";var E=Object.defineProperty;var g=(t,e,s)=>e in t?E(t,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[e]=s;var o=(t,e,s)=>g(t,typeof e!="symbol"?e+"":e,s);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var d=(t=>(t.PRIVATE="WALLET",t.VASP="VASP",t))(d||{}),c=(t=>(t.NATURAL="natural",t.LEGAL="legal",t.SELF="self",t))(c||{}),m=(t=>(t.EMPTY="empty",t.VERIFY="verify",t.PENDING="pending",t.VERIFIED="verified",t.BANNED="banned",t))(m||{}),a=(t=>(t.COMPLETE="complete",t.RESIZE="resize",t.RESULT="result",t.READY="ready",t.INVALID="invalid",t.MODAL="openModal",t.ERROR="error",t.CLOSE="closeModal",t.CANCEL="cancel",t))(a||{}),u=(t=>(t.UPDATE="update",t.REQUEST_RESPONSE="requestResponse",t))(u||{}),f=(t=>(t.PENDING="pending",t.FAILED="rejected",t.FLAGGED="flagged",t.VERIFIED="verified",t))(f||{}),p=(t=>(t.SelfDeclaration="self-declaration",t.PersonalSignEIP191="eip-191",t.PersonalSignEIP712="eip-712",t.PersonalSignBIP137="bip-137",t.PersonalSignXPUB="xpub",t.MicroTransfer="microtransfer",t.Screenshot="screenshot",t))(p||{});class v{constructor(){o(this,"listeners",new Map);o(this,"port");this.handleMessage=this.handleMessage.bind(this)}setPort(e){this.port=e,this.port.onmessage=this.handleMessage,this.port.start()}on(e,s){this.listeners.has(e)||this.listeners.set(e,new Set),this.listeners.get(e).add(s)}off(e,s){const r=this.listeners.get(e);r&&(r.delete(s),r.size===0&&this.listeners.delete(e))}handleMessage(e){const s=e.data;if(typeof s=="object"&&s!==null&&"type"in s){const r=s.type,i=this.listeners.get(r);i&&i.forEach(n=>n(s))}}send(e){this.port&&this.port.postMessage(e)}}class I{constructor(e,s){o(this,"_url");o(this,"_value");o(this,"_errors",[]);o(this,"iframe");o(this,"eventManager");o(this,"modal");this._url=e,this._value=s,this.eventManager=new v,this.on(a.INVALID,r=>{r.type===a.INVALID&&(this._errors=r.errors,this._value=r.value)}),this.on(a.RESIZE,r=>{r.type===a.RESIZE&&this.iframe&&(this.iframe.style.height=`${r.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 s=document.querySelector(e);if(!s)throw new Error(`parentID ${e} not found`);this.embed(s)}embed(e,s=!1){var r,i;this.iframe=document.createElement("iframe"),this.iframe.src=this.url+(s?"":"&embedded=true"),this.iframe.allow="web-share",this.iframe.style.width="100%",this.iframe.style.height="100px",this.iframe.style.border="none",this.iframe.style.overflow="hidden",e.appendChild(this.iframe),window.addEventListener("message",n=>{var l,h;n.source===((l=this.iframe)==null?void 0:l.contentWindow)&&((h=this.eventManager)==null||h.setPort(n.ports[0]))}),(i=(r=this.iframe)==null?void 0:r.contentWindow)==null||i.focus()}send(e){this.eventManager.send(e)}on(e,s){this.eventManager.on(e,s)}off(e,s){this.eventManager.off(e,s)}update(e){this._value=e,this.send({type:u.UPDATE,value:e})}completion(){return new Promise((e,s)=>{this.on(a.COMPLETE,r=>{e(r.response)}),this.on("error",r=>{s(new Error(r.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,!0),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&&((e=this.modal)==null||e.close(),this.modal.remove(),this.modal=void 0)}}function U(t){return Object.entries(t).map(([e,s])=>{if(!(e&&s))return;const r=encodeURIComponent(e),i=encodeURIComponent(typeof s=="object"?JSON.stringify(s):s);return`${r}=${i}`}).filter(e=>!!e).join("&")}class w{constructor(e){o(this,"nodeUrl");o(this,"authToken");o(this,"uxUrl");o(this,"theme");o(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,s,r,i){const n=new URL(this.uxUrl);n.pathname=e;const l=U({authToken:this.authToken,value:s,configuration:r});return n.hash=l,this.nodeUrl&&n.searchParams.set("nodeUrl",this.nodeUrl),this.theme&&n.searchParams.set("theme",JSON.stringify(this.theme)),this.locale&&n.searchParams.set("locale",this.locale),i&&(i.callback&&n.searchParams.set("callback_url",i.callback),i.redirectUri&&n.searchParams.set("redirect_uri",i.redirectUri)),n.toString()}createComponent(e,s,r,i){return new I(this.componentUrl(e,s,r,i),s)}createWithdrawalAssist(e,s,r){return this.createComponent("withdrawal-assist",e,s,r)}createWalletAssist(e,s,r){return this.createComponent("wallet-assist",e,s,r)}createDepositAssist(e,s,r){return this.createComponent("deposit-assist",e,s,r)}createConnectWallet(e,s,r){return this.createComponent("connect",e,s,r)}createDepositRequest(e,s,r){return this.createComponent("deposit-request",e,s,r)}decodeFragmentToObject(e){return e.slice(1).split("&").reduce((r,i)=>{const[n,l]=i.split("=");return r[decodeURIComponent(n)]=decodeURIComponent(l),r},{})}}exports.AgentType=d;exports.CMType=a;exports.PersonType=c;exports.ProofStatus=f;exports.ProofTypes=p;exports.Status=m;exports.default=w;
+"use strict";var g=Object.defineProperty;var v=(t,e,s)=>e in t?g(t,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[e]=s;var o=(t,e,s)=>v(t,typeof e!="symbol"?e+"":e,s);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var d=(t=>(t.PRIVATE="WALLET",t.VASP="VASP",t))(d||{}),c=(t=>(t.NATURAL="natural",t.LEGAL="legal",t.SELF="self",t))(c||{}),m=(t=>(t.EMPTY="empty",t.VERIFY="verify",t.PENDING="pending",t.VERIFIED="verified",t.BANNED="banned",t))(m||{}),a=(t=>(t.COMPLETE="complete",t.RESIZE="resize",t.RESULT="result",t.READY="ready",t.INVALID="invalid",t.ERROR="error",t.CANCEL="cancel",t))(a||{}),u=(t=>(t.UPDATE="update",t.REQUEST_RESPONSE="requestResponse",t))(u||{}),p=(t=>(t.PENDING="pending",t.FAILED="rejected",t.FLAGGED="flagged",t.VERIFIED="verified",t))(p||{}),f=(t=>(t.SelfDeclaration="self-declaration",t.PersonalSignEIP191="eip-191",t.SIWE="siwe",t.PersonalSignEIP712="eip-712",t.PersonalSignBIP137="bip-137",t.PersonalSignXPUB="xpub",t.MicroTransfer="microtransfer",t.Screenshot="screenshot",t))(f||{});class w{constructor(){o(this,"listeners",new Map);o(this,"port");this.handleMessage=this.handleMessage.bind(this)}setPort(e){this.port=e,this.port.onmessage=this.handleMessage,this.port.start()}on(e,s){this.listeners.has(e)||this.listeners.set(e,new Set),this.listeners.get(e).add(s)}off(e,s){const r=this.listeners.get(e);r&&(r.delete(s),r.size===0&&this.listeners.delete(e))}handleMessage(e){const s=e.data;if(typeof s=="object"&&s!==null&&"type"in s){const r=s.type,i=this.listeners.get(r);i&&i.forEach(n=>n(s))}}send(e){this.port&&this.port.postMessage(e)}}class E{constructor(e,s){o(this,"_url");o(this,"_value");o(this,"_errors",[]);o(this,"iframe");o(this,"eventManager");o(this,"modal");this._url=e,this._value=s,this.eventManager=new w,this.on(a.INVALID,r=>{r.type===a.INVALID&&(this._errors=r.errors,this._value=r.value)}),this.on(a.RESIZE,r=>{r.type===a.RESIZE&&this.iframe&&(this.iframe.style.height=`${r.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 s=document.querySelector(e);if(!s)throw new Error(`parentID ${e} not found`);this.embed(s)}embed(e,s=!1){var r,i;this.iframe=document.createElement("iframe"),this.iframe.src=this.url+(s?"":"&embedded=true"),this.iframe.allow="web-share",this.iframe.style.width="100%",this.iframe.style.height="100px",this.iframe.style.border="none",this.iframe.style.overflow="hidden",e.appendChild(this.iframe),window.addEventListener("message",n=>{var l,h;n.source===((l=this.iframe)==null?void 0:l.contentWindow)&&((h=this.eventManager)==null||h.setPort(n.ports[0]))}),(i=(r=this.iframe)==null?void 0:r.contentWindow)==null||i.focus()}send(e){this.eventManager.send(e)}on(e,s){this.eventManager.on(e,s)}off(e,s){this.eventManager.off(e,s)}update(e){this._value=e,this.send({type:u.UPDATE,value:e})}completion(){return new Promise((e,s)=>{this.on(a.COMPLETE,r=>{e(r.response)}),this.on("error",r=>{s(new Error(r.message))})})}openModal(){return this.modal&&this.closeModal(),this.modal=document.createElement("dialog"),this.modal.style.border="none",this.modal.style.backgroundColor="white",this.modal.style.maxWidth="100vw",this.modal.style.maxHeight="100vh",this.modal.style.width="600px",this.modal.style.height="600px",document.body.appendChild(this.modal),this.embed(this.modal,!0),this.on(a.CANCEL,()=>{this.closeModal()}),this.on(a.COMPLETE,()=>{this.closeModal()}),this.modal.showModal(),this.modal.addEventListener("click",()=>{this.closeModal()}),this.completion()}closeModal(){var e;this.modal&&((e=this.modal)==null||e.close(),this.modal.remove(),this.modal=void 0)}}function I(t){return Object.entries(t).map(([e,s])=>{if(!(e&&s))return;const r=encodeURIComponent(e),i=encodeURIComponent(typeof s=="object"?JSON.stringify(s):s);return`${r}=${i}`}).filter(e=>!!e).join("&")}class U{constructor(e){o(this,"nodeUrl");o(this,"authToken");o(this,"uxUrl");o(this,"theme");o(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,s,r,i){const n=new URL(this.uxUrl);n.pathname=e;const l=I({authToken:this.authToken,value:s,configuration:r});return n.hash=l,this.nodeUrl&&n.searchParams.set("nodeUrl",this.nodeUrl),this.theme&&n.searchParams.set("theme",JSON.stringify(this.theme)),this.locale&&n.searchParams.set("locale",this.locale),i&&(i.callback&&n.searchParams.set("callback_url",i.callback),i.redirectUri&&n.searchParams.set("redirect_uri",i.redirectUri)),n.toString()}createComponent(e,s,r,i){return new E(this.componentUrl(e,s,r,i),s)}createWithdrawalAssist(e,s,r){return this.createComponent("withdrawal-assist",e,s,r)}createWalletAssist(e,s,r){return this.createComponent("wallet-assist",e,s,r)}createDepositAssist(e,s,r){return this.createComponent("deposit-assist",e,s,r)}createConnectWallet(e,s,r){return this.createComponent("connect",e,s,r)}createDepositRequest(e,s,r){return this.createComponent("deposit-request",e,s,r)}decodeFragmentToObject(e){return e.slice(1).split("&").reduce((r,i)=>{const[n,l]=i.split("=");return r[decodeURIComponent(n)]=decodeURIComponent(l),r},{})}}exports.AgentType=d;exports.CMType=a;exports.EmbeddedComponent=E;exports.PersonType=c;exports.ProofStatus=p;exports.ProofTypes=f;exports.Status=m;exports.default=U;

package/dist/notabene.d.ts

@@ -141,7 +141,7 @@ export declare interface CallbackOptions {
 
 /**
  * Represents a cancel component message
- * @public
+ * @internal
  */
 declare type Cancel = {
     type: CMType.CANCEL;
@@ -157,26 +157,26 @@ export declare const enum CMType {
     RESULT = "result",
     READY = "ready",
     INVALID = "invalid",
-    MODAL = "openModal",
     ERROR = "error",
-    CLOSE = "closeModal",
     CANCEL = "cancel"
 }
 
 /**
  * Represents a completed component message
+ * @typeParam T - The overall Value type being returned
+ * @param response - The Response object which wraps T
  * @public
  */
-declare type Completed = {
+declare type Completed<T> = {
     type: CMType.COMPLETE;
-    response: ComponentResponse;
+    response: TransactionResponse<T>;
 };
 
 /**
  * Component Message
  * @public
  */
-export declare type ComponentMessage = Completed | Cancel | Error_2 | Ready | ResizeRequest | InvalidValue;
+export declare type ComponentMessage<T> = Completed<T> | Cancel | Error_2 | Ready | ResizeRequest | InvalidValue<T>;
 
 /**
  * An abstract request for communicating with a component
@@ -202,17 +202,6 @@ export declare interface ConnectionRequest extends ComponentRequest {
     asset: TransactionAsset;
 }
 
-/**
- * An object representing a connection response
- * @public
- */
-export declare interface ConnectionResponse extends ComponentResponse {
-    value: ConnectionRequest;
-    ivms: IVMS101;
-    proof?: OwnershipProof;
-    txCreate?: V1Transaction;
-}
-
 /**
  * The counterparty of a transaction.
  * @public
@@ -304,7 +293,7 @@ declare type DTI = string;
  * An embedded Notabene component
  * @public
  */
-export declare class EmbeddedComponent<V, R> {
+export declare class EmbeddedComponent<V> {
     private _url;
     private _value;
     private _errors;
@@ -316,7 +305,7 @@ export declare class EmbeddedComponent<V, R> {
      * @param url - The URL of the embedded component
      * @param value - The initial transaction value
      */
-    constructor(url: string, value: V);
+    constructor(url: string, value: Partial<V>);
     /**
      * Gets the URL of the embedded component
      * @returns The URL of the embedded component
@@ -326,7 +315,7 @@ export declare class EmbeddedComponent<V, R> {
      * Gets the current transaction value
      * @returns The current transaction value
      */
-    get value(): V;
+    get value(): Partial<V>;
     get errors(): ValidationError[];
     /**
      * Opens the component URL in the current window
@@ -347,33 +336,33 @@ export declare class EmbeddedComponent<V, R> {
      * Sends a message to the embedded component
      * @param message - The message to send
      */
-    send(message: HostMessage): void;
+    send(message: HostMessage<V>): void;
     /**
      * Adds an event listener for a specific message type
      * @param messageType - The type of message to listen for
      * @param callback - The callback function to execute when the message is received
      */
-    on(messageType: string, callback: MessageCallback): void;
+    on(messageType: string, callback: MessageCallback<V>): void;
     /**
      * Removes an event listener for a specific message type
      * @param messageType - The type of message to stop listening for
      * @param callback - The callback function to remove
      */
-    off(messageType: string, callback: MessageCallback): void;
+    off(messageType: string, callback: MessageCallback<V>): void;
     /**
      * Updates the transaction value and sends an update message to the component
      * @param value - The new transaction value
      */
-    update(value: V): void;
+    update(value: Partial<V>): void;
     /**
      * Waits for the component to complete and returns the transaction response
      * @returns A promise that resolves with the transaction response
      */
-    completion(): Promise<R>;
+    completion(): Promise<TransactionResponse<V>>;
     /**
      * Opens the component in a modal dialog
      */
-    openModal(): Promise<R>;
+    openModal(): Promise<TransactionResponse<V>>;
     /**
      * Closes the modal dialog
      *
@@ -383,6 +372,7 @@ export declare class EmbeddedComponent<V, R> {
 
 /**
  * Represents an error component message
+ * @param message - Error message
  * @public
  */
 declare type Error_2 = {
@@ -417,7 +407,7 @@ declare const enum HMType {
  * Host Messages
  * @public
  */
-export declare type HostMessage = UpdateValue;
+export declare type HostMessage<T> = UpdateValue<T>;
 
 /**
  * Intermediary VASP
@@ -433,11 +423,14 @@ declare type IntermediaryVASP = {
 
 /**
  * Represents an invalid value component message
- * @public
+ * @typeParam T - The overall Value type being returned
+ * @param value - The current Partial value
+ * @param errors - Array of validation errors
+ * @internal
  */
-declare type InvalidValue = {
+declare type InvalidValue<T> = {
     type: CMType.INVALID;
-    value: any;
+    value: Partial<T>;
     errors: ValidationError[];
 };
 
@@ -573,7 +566,7 @@ declare type LocalNaturalPersonNameID = {
     nameIdentifierType?: NaturalPersonNameTypeCode;
 };
 
-declare type MessageCallback = (message: ComponentMessage) => void;
+declare type MessageCallback<T> = (message: ComponentMessage<T>) => void;
 
 /**
  * Ownership Proof using Micro Transfer
@@ -721,7 +714,7 @@ declare class Notabene {
      * @returns A new EmbeddedComponent instance
      * @internal
      */
-    createComponent<V, R>(path: string, value: V, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<V, R>;
+    createComponent<V>(path: string, value: Partial<V>, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<V>;
     /**
      * Creates a withdrawal assist component
      *
@@ -730,7 +723,7 @@ declare class Notabene {
      * @param callbacks - Optional callback configuration
      * @returns A new EmbeddedComponent instance for withdrawal assistance
      */
-    createWithdrawalAssist(value: Partial<Withdrawal>, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<Partial<Withdrawal>, TransactionResponse<Withdrawal>>;
+    createWithdrawalAssist(value: Partial<Withdrawal>, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<Withdrawal>;
     /**
      * Creates a wallet assist component
      *
@@ -740,7 +733,7 @@ declare class Notabene {
      * @returns A new EmbeddedComponent instance for withdrawal assistance
      * @alpha
      */
-    createWalletAssist(value: Partial<Withdrawal>, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<Partial<Withdrawal>, TransactionResponse<Withdrawal>>;
+    createWalletAssist(value: Partial<Withdrawal>, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<Withdrawal>;
     /**
      * Creates a deposit assist component
      *
@@ -750,7 +743,7 @@ declare class Notabene {
      * @returns A new EmbeddedComponent instance for deposit assistance
      * @alpha
      */
-    createDepositAssist(value: Partial<Deposit>, options?: any, callbacks?: CallbackOptions): EmbeddedComponent<Partial<Deposit>, TransactionResponse<Deposit>>;
+    createDepositAssist(value: Partial<Deposit>, options?: any, callbacks?: CallbackOptions): EmbeddedComponent<Deposit>;
     /**
      * Creates a connect component
      *
@@ -760,7 +753,7 @@ declare class Notabene {
      * @returns A new EmbeddedComponent instance for connection
      * @alpha
      */
-    createConnectWallet(value: ConnectionRequest, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<ConnectionRequest, ConnectionResponse>;
+    createConnectWallet(value: ConnectionRequest, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<ConnectionRequest>;
     /**
      * Creates a deposit request component
      *
@@ -770,7 +763,7 @@ declare class Notabene {
      * @returns A new EmbeddedComponent instance for deposit requests
      * @public
      */
-    createDepositRequest(value: DepositRequest, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<DepositRequest, TransactionResponse<DepositRequest>>;
+    createDepositRequest(value: DepositRequest, options?: TransactionOptions, callbacks?: CallbackOptions): EmbeddedComponent<DepositRequest>;
     /**
      * Decodes a URL fragment into an object
      *
@@ -923,6 +916,7 @@ export declare enum ProofStatus {
 export declare enum ProofTypes {
     SelfDeclaration = "self-declaration",
     PersonalSignEIP191 = "eip-191",
+    SIWE = "siwe",
     PersonalSignEIP712 = "eip-712",
     PersonalSignBIP137 = "bip-137",
     PersonalSignXPUB = "xpub",
@@ -941,8 +935,8 @@ declare type Ready = {
 declare type RequestID = UUID;
 
 /**
- * Represents a resize request component message
- * @public
+ * Represents a resize request component message. This is handled by the library.
+ * @internal
  */
 declare type ResizeRequest = {
     type: CMType.RESIZE;
@@ -963,7 +957,7 @@ export declare interface ScreenshotProof extends OwnershipProof {
  * @public
  */
 export declare interface SignatureProof extends OwnershipProof {
-    type: ProofTypes.PersonalSignEIP191 | ProofTypes.PersonalSignEIP712 | ProofTypes.PersonalSignBIP137 | ProofTypes.PersonalSignXPUB;
+    type: ProofTypes.PersonalSignEIP191 | ProofTypes.PersonalSignEIP712 | ProofTypes.PersonalSignBIP137 | ProofTypes.SIWE | ProofTypes.PersonalSignXPUB;
     proof: string;
     attestation: string;
     wallet_provider: string;
@@ -1074,12 +1068,12 @@ declare type TransliterationMethodCode = 'arab' | 'aran' | 'armn' | 'cyrl' | 'de
 declare type TravelAddress = `ta${string}`;
 
 /**
- * Represents an update value host message
+ * Represents an update value host message. This is sent from Host to component.
  * @public
  */
-declare type UpdateValue = {
+declare type UpdateValue<T> = {
     type: HMType.UPDATE;
-    value: ComponentRequest;
+    value: Partial<T>;
 };
 
 /**

package/dist/notabene.js

@@ -1,7 +1,7 @@
 var c = Object.defineProperty;
 var m = (t, e, s) => e in t ? c(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
 var o = (t, e, s) => m(t, typeof e != "symbol" ? e + "" : e, s);
-var u = /* @__PURE__ */ ((t) => (t.PRIVATE = "WALLET", t.VASP = "VASP", t))(u || {}), E = /* @__PURE__ */ ((t) => (t.NATURAL = "natural", t.LEGAL = "legal", t.SELF = "self", t))(E || {}), f = /* @__PURE__ */ ((t) => (t.EMPTY = "empty", t.VERIFY = "verify", t.PENDING = "pending", t.VERIFIED = "verified", t.BANNED = "banned", t))(f || {}), a = /* @__PURE__ */ ((t) => (t.COMPLETE = "complete", t.RESIZE = "resize", t.RESULT = "result", t.READY = "ready", t.INVALID = "invalid", t.MODAL = "openModal", t.ERROR = "error", t.CLOSE = "closeModal", t.CANCEL = "cancel", t))(a || {}), d = /* @__PURE__ */ ((t) => (t.UPDATE = "update", t.REQUEST_RESPONSE = "requestResponse", t))(d || {}), p = /* @__PURE__ */ ((t) => (t.PENDING = "pending", t.FAILED = "rejected", t.FLAGGED = "flagged", t.VERIFIED = "verified", t))(p || {}), g = /* @__PURE__ */ ((t) => (t.SelfDeclaration = "self-declaration", t.PersonalSignEIP191 = "eip-191", t.PersonalSignEIP712 = "eip-712", t.PersonalSignBIP137 = "bip-137", t.PersonalSignXPUB = "xpub", t.MicroTransfer = "microtransfer", t.Screenshot = "screenshot", t))(g || {});
+var u = /* @__PURE__ */ ((t) => (t.PRIVATE = "WALLET", t.VASP = "VASP", t))(u || {}), E = /* @__PURE__ */ ((t) => (t.NATURAL = "natural", t.LEGAL = "legal", t.SELF = "self", t))(E || {}), f = /* @__PURE__ */ ((t) => (t.EMPTY = "empty", t.VERIFY = "verify", t.PENDING = "pending", t.VERIFIED = "verified", t.BANNED = "banned", t))(f || {}), a = /* @__PURE__ */ ((t) => (t.COMPLETE = "complete", t.RESIZE = "resize", t.RESULT = "result", t.READY = "ready", t.INVALID = "invalid", t.ERROR = "error", t.CANCEL = "cancel", t))(a || {}), d = /* @__PURE__ */ ((t) => (t.UPDATE = "update", t.REQUEST_RESPONSE = "requestResponse", t))(d || {}), p = /* @__PURE__ */ ((t) => (t.PENDING = "pending", t.FAILED = "rejected", t.FLAGGED = "flagged", t.VERIFIED = "verified", t))(p || {}), g = /* @__PURE__ */ ((t) => (t.SelfDeclaration = "self-declaration", t.PersonalSignEIP191 = "eip-191", t.SIWE = "siwe", t.PersonalSignEIP712 = "eip-712", t.PersonalSignBIP137 = "bip-137", t.PersonalSignXPUB = "xpub", t.MicroTransfer = "microtransfer", t.Screenshot = "screenshot", t))(g || {});
 class v {
   constructor() {
     o(this, "listeners", /* @__PURE__ */ new Map());
@@ -30,7 +30,7 @@ class v {
     this.port && this.port.postMessage(e);
   }
 }
-class I {
+class w {
   /**
    * Creates an instance of EmbeddedComponent.
    * @param url - The URL of the embedded component
@@ -89,8 +89,8 @@ class I {
   embed(e, s = !1) {
     var r, i;
     this.iframe = document.createElement("iframe"), this.iframe.src = this.url + (s ? "" : "&embedded=true"), this.iframe.allow = "web-share", this.iframe.style.width = "100%", this.iframe.style.height = "100px", this.iframe.style.border = "none", this.iframe.style.overflow = "hidden", e.appendChild(this.iframe), window.addEventListener("message", (n) => {
-      var l, h;
-      n.source === ((l = this.iframe) == null ? void 0 : l.contentWindow) && ((h = this.eventManager) == null || h.setPort(n.ports[0]));
+      var h, l;
+      n.source === ((h = this.iframe) == null ? void 0 : h.contentWindow) && ((l = this.eventManager) == null || l.setPort(n.ports[0]));
     }), (i = (r = this.iframe) == null ? void 0 : r.contentWindow) == null || i.focus();
   }
   /**
@@ -140,9 +140,7 @@ class I {
    * Opens the component in a modal dialog
    */
   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, !0), this.on(a.CANCEL, () => {
-      this.closeModal();
-    }), this.on(a.CLOSE, () => {
+    return this.modal && this.closeModal(), this.modal = document.createElement("dialog"), this.modal.style.border = "none", this.modal.style.backgroundColor = "white", this.modal.style.maxWidth = "100vw", this.modal.style.maxHeight = "100vh", this.modal.style.width = "600px", this.modal.style.height = "600px", document.body.appendChild(this.modal), this.embed(this.modal, !0), this.on(a.CANCEL, () => {
       this.closeModal();
     }), this.on(a.COMPLETE, () => {
       this.closeModal();
@@ -159,7 +157,7 @@ class I {
     this.modal && ((e = this.modal) == null || e.close(), this.modal.remove(), this.modal = void 0);
   }
 }
-function U(t) {
+function I(t) {
   return Object.entries(t).map(([e, s]) => {
     if (!(e && s)) return;
     const r = encodeURIComponent(e), i = encodeURIComponent(
@@ -168,7 +166,7 @@ function U(t) {
     return `${r}=${i}`;
   }).filter((e) => !!e).join("&");
 }
-class L {
+class R {
   /**
    * Creates a new instance of the Notabene SDK
    *
@@ -195,12 +193,12 @@ class L {
   componentUrl(e, s, r, i) {
     const n = new URL(this.uxUrl);
     n.pathname = e;
-    const l = U({
+    const h = I({
       authToken: this.authToken,
       value: s,
       configuration: r
     });
-    return n.hash = l, this.nodeUrl && n.searchParams.set("nodeUrl", this.nodeUrl), this.theme && n.searchParams.set("theme", JSON.stringify(this.theme)), this.locale && n.searchParams.set("locale", this.locale), i && (i.callback && n.searchParams.set("callback_url", i.callback), i.redirectUri && n.searchParams.set("redirect_uri", i.redirectUri)), n.toString();
+    return n.hash = h, this.nodeUrl && n.searchParams.set("nodeUrl", this.nodeUrl), this.theme && n.searchParams.set("theme", JSON.stringify(this.theme)), this.locale && n.searchParams.set("locale", this.locale), i && (i.callback && n.searchParams.set("callback_url", i.callback), i.redirectUri && n.searchParams.set("redirect_uri", i.redirectUri)), n.toString();
   }
   /**
    * Creates a new embedded component
@@ -213,7 +211,7 @@ class L {
    * @internal
    */
   createComponent(e, s, r, i) {
-    return new I(
+    return new w(
       this.componentUrl(e, s, r, i),
       s
     );
@@ -227,7 +225,12 @@ class L {
    * @returns A new EmbeddedComponent instance for withdrawal assistance
    */
   createWithdrawalAssist(e, s, r) {
-    return this.createComponent("withdrawal-assist", e, s, r);
+    return this.createComponent(
+      "withdrawal-assist",
+      e,
+      s,
+      r
+    );
   }
   /**
    * Creates a wallet assist component
@@ -239,7 +242,12 @@ class L {
    * @alpha
    */
   createWalletAssist(e, s, r) {
-    return this.createComponent("wallet-assist", e, s, r);
+    return this.createComponent(
+      "wallet-assist",
+      e,
+      s,
+      r
+    );
   }
   /**
    * Creates a deposit assist component
@@ -285,7 +293,12 @@ class L {
    * @public
    */
   createDepositRequest(e, s, r) {
-    return this.createComponent("deposit-request", e, s, r);
+    return this.createComponent(
+      "deposit-request",
+      e,
+      s,
+      r
+    );
   }
   /**
    * Decodes a URL fragment into an object
@@ -296,8 +309,8 @@ class L {
   decodeFragmentToObject(e) {
     return e.slice(1).split("&").reduce(
       (r, i) => {
-        const [n, l] = i.split("=");
-        return r[decodeURIComponent(n)] = decodeURIComponent(l), r;
+        const [n, h] = i.split("=");
+        return r[decodeURIComponent(n)] = decodeURIComponent(h), r;
       },
       {}
     );
@@ -306,9 +319,10 @@ class L {
 export {
   u as AgentType,
   a as CMType,
+  w as EmbeddedComponent,
   E as PersonType,
   p as ProofStatus,
   g as ProofTypes,
   f as Status,
-  L as default
+  R as default
 };

package/dist/tsdoc-metadata.json

@@ -5,7 +5,7 @@
   "toolPackages": [
     {
       "packageName": "@microsoft/api-extractor",
-      "packageVersion": "7.47.9"
+      "packageVersion": "7.47.11"
     }
   ]
 }

package/package.json

@@ -9,7 +9,7 @@
   },
   "author": "Notabene <developers@notabene.id>",
   "license": "MIT",
-  "version": "2.0.0-next.16",
+  "version": "2.0.0-next.17",
   "source": "src/notabene.ts",
   "main": "dist/notabene.js",
   "types": "dist/notabene.d.ts",
@@ -30,6 +30,7 @@
     "build:clean": "rimraf dist/ ts-out",
     "build": "yarn lint && vite build && tsc && api-extractor run && yarn docs ",
     "lint": "eslint .",
+    "format": "prettier --write .",
     "test": "vitest",
     "release": "semantic-release",
     "publish": "yarn build && npm publish --tag next"
@@ -37,32 +38,32 @@
   "devDependencies": {
     "@commitlint/cli": "^19.5.0",
     "@commitlint/config-conventional": "^19.5.0",
-    "@eslint/js": "^9.10.0",
+    "@eslint/js": "^9.13.0",
     "@fast-check/vitest": "^0.1.3",
-    "@microsoft/api-extractor": "^7.47.9",
+    "@microsoft/api-extractor": "^7.47.11",
     "@semantic-release/git": "^10.0.1",
-    "@semantic-release/gitlab": "^9.5.1",
-    "@semantic-release/npm": "^9.0.2",
-    "@typescript-eslint/eslint-plugin": "^8.6.0",
-    "@typescript-eslint/parser": "^8.6.0",
-    "eslint": "^9.10.0",
+    "@semantic-release/gitlab": "^13.2.1",
+    "@semantic-release/npm": "^12.0.1",
+    "@typescript-eslint/eslint-plugin": "^8.11.0",
+    "@typescript-eslint/parser": "^8.11.0",
+    "eslint": "^9.13.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.2.1",
     "fast-check": "^3.22.0",
-    "globals": "^15.9.0",
-    "husky": "^7.0.4",
-    "jsdom": "^25.0.0",
-    "lint-staged": "^12.5.0",
-    "organize-imports-cli": "^0.9.0",
+    "globals": "^15.11.0",
+    "husky": "^9.1.6",
+    "jsdom": "^25.0.1",
+    "lint-staged": "^15.2.10",
+    "organize-imports-cli": "^0.10.0",
     "prettier": "^3.3.3",
     "rimraf": "^6.0.1",
-    "semantic-release": "^24.1.1",
-    "typedoc": "^0.26.7",
-    "typedoc-plugin-markdown": "^4.2.7",
-    "typescript": "^5.6.2",
-    "typescript-eslint": "^8.6.0",
-    "vite": "^5.4.6",
-    "vitest": "^2.1.1"
+    "semantic-release": "^24.1.3",
+    "typedoc": "^0.26.10",
+    "typedoc-plugin-markdown": "^4.2.9",
+    "typescript": "^5.6.3",
+    "typescript-eslint": "^8.11.0",
+    "vite": "^5.4.10",
+    "vitest": "^2.1.3"
   },
   "lint-staged": {
     "*.ts": [

package/src/components/EmbeddedComponent.ts

@@ -1,8 +1,8 @@
 import {
   CMType,
-  ComponentRequest,
   HMType,
   HostMessage,
+  TransactionResponse,
   ValidationError,
 } from '../types';
 import {
@@ -15,13 +15,13 @@ import {
  * @public
  */
 
-export default class EmbeddedComponent<V, R> {
+export default class EmbeddedComponent<V> {
   private _url: string;
-  private _value: V;
+  private _value: Partial<V>;
   private _errors: ValidationError[] = [];
 
   private iframe?: HTMLIFrameElement;
-  private eventManager: MessageEventManager;
+  private eventManager: MessageEventManager<V>;
   private modal?: HTMLDialogElement;
 
   /**
@@ -30,10 +30,10 @@ export default class EmbeddedComponent<V, R> {
    * @param value - The initial transaction value
    */
 
-  constructor(url: string, value: V) {
+  constructor(url: string, value: Partial<V>) {
     this._url = url;
     this._value = value;
-    this.eventManager = new MessageEventManager();
+    this.eventManager = new MessageEventManager<V>();
     this.on(CMType.INVALID, (message) => {
       if (message.type === CMType.INVALID) {
         this._errors = message.errors;
@@ -59,7 +59,7 @@ export default class EmbeddedComponent<V, R> {
    * @returns The current transaction value
    */
 
-  public get value(): V {
+  public get value(): Partial<V> {
     return this._value;
   }
 
@@ -119,7 +119,7 @@ export default class EmbeddedComponent<V, R> {
    * Sends a message to the embedded component
    * @param message - The message to send
    */
-  send(message: HostMessage): void {
+  send(message: HostMessage<V>): void {
     this.eventManager.send(message);
   }
 
@@ -129,7 +129,7 @@ export default class EmbeddedComponent<V, R> {
    * @param callback - The callback function to execute when the message is received
    */
 
-  on(messageType: string, callback: MessageCallback): void {
+  on(messageType: string, callback: MessageCallback<V>): void {
     this.eventManager.on(messageType, callback);
   }
 
@@ -139,7 +139,7 @@ export default class EmbeddedComponent<V, R> {
    * @param callback - The callback function to remove
    */
 
-  off(messageType: string, callback: MessageCallback): void {
+  off(messageType: string, callback: MessageCallback<V>): void {
     this.eventManager.off(messageType, callback);
   }
 
@@ -147,9 +147,9 @@ export default class EmbeddedComponent<V, R> {
    * Updates the transaction value and sends an update message to the component
    * @param value - The new transaction value
    */
-  update(value: V) {
+  update(value: Partial<V>) {
     this._value = value;
-    this.send({ type: HMType.UPDATE, value: value as ComponentRequest });
+    this.send({ type: HMType.UPDATE, value: value });
   }
 
   /**
@@ -157,7 +157,7 @@ export default class EmbeddedComponent<V, R> {
    * @returns A promise that resolves with the transaction response
    */
 
-  completion(): Promise<R> {
+  completion(): Promise<TransactionResponse<V>> {
     return new Promise((resolve, reject) => {
       this.on(CMType.COMPLETE, (message) => {
         resolve((message as any).response);
@@ -172,26 +172,24 @@ export default class EmbeddedComponent<V, R> {
    * Opens the component in a modal dialog
    */
 
-  openModal(): Promise<R> {
+  openModal(): Promise<TransactionResponse<V>> {
     if (this.modal) {
       this.closeModal();
     }
     this.modal = document.createElement('dialog');
     this.modal.style.border = 'none';
-    this.modal.style.backgroundColor = 'transparent';
+    this.modal.style.backgroundColor = 'white';
     this.modal.style.maxWidth = '100vw';
     this.modal.style.maxHeight = '100vh';
     this.modal.style.width = '600px';
-    this.modal.style.height = '800px';
+    this.modal.style.height = '600px';
 
     document.body.appendChild(this.modal);
     this.embed(this.modal, true);
     this.on(CMType.CANCEL, () => {
       this.closeModal();
     });
-    this.on(CMType.CLOSE, () => {
-      this.closeModal();
-    });
+
     this.on(CMType.COMPLETE, () => {
       this.closeModal();
     });

package/src/components/__tests__/EmbeddedComponent.test.ts

@@ -4,7 +4,6 @@ import {
   HMType,
   HostMessage,
   Transaction,
-  TransactionResponse,
   Withdrawal,
 } from '../../types';
 import EmbeddedComponent from '../EmbeddedComponent';
@@ -15,15 +14,11 @@ const value: Partial<Transaction> = { amountDecimal: 100 };
 
 describe('EmbeddedComponent', () => {
   describe('creation', () => {
-    let component: EmbeddedComponent<
-      Partial<Withdrawal>,
-      TransactionResponse<Withdrawal>
-    >;
+    let component: EmbeddedComponent<Withdrawal>;
     beforeEach(() => {
-      component = new EmbeddedComponent<
-        Partial<Withdrawal>,
-        TransactionResponse<Withdrawal>
-      >(url, { amountDecimal: 100 });
+      component = new EmbeddedComponent<Withdrawal>(url, {
+        amountDecimal: 100,
+      });
     });
 
     test('sets value', () => {
@@ -73,20 +68,14 @@ describe('EmbeddedComponent', () => {
     });
 
     test('mount', () => {
-      const component = new EmbeddedComponent<
-        Partial<Withdrawal>,
-        TransactionResponse<Withdrawal>
-      >(url, value);
+      const component = new EmbeddedComponent<Withdrawal>(url, value);
       component.mount(parentId);
       expect(iframe?.src).toBe(url + '&embedded=true');
       expect(parentElement.appendChild).toHaveBeenCalledWith(iframe);
     });
 
     test('on', () => {
-      const component = new EmbeddedComponent<
-        Partial<Withdrawal>,
-        TransactionResponse<Withdrawal>
-      >(url, value);
+      const component = new EmbeddedComponent<Withdrawal>(url, value);
       const messageType = 'customEvent';
       const callback = vi.fn();
       component.on(messageType, callback);
@@ -97,10 +86,7 @@ describe('EmbeddedComponent', () => {
     });
 
     test('off', () => {
-      const component = new EmbeddedComponent<
-        Partial<Withdrawal>,
-        TransactionResponse<Withdrawal>
-      >(url, value);
+      const component = new EmbeddedComponent<Withdrawal>(url, value);
       const messageType = 'customEvent';
       const callback = vi.fn();
       component.on(messageType, callback);
@@ -118,10 +104,7 @@ describe('EmbeddedComponent', () => {
       let messageHandler: (event: MessageEvent) => void;
       let port: MessagePort;
       let handshake: MessageEvent;
-      let component: EmbeddedComponent<
-        Partial<Withdrawal>,
-        TransactionResponse<Withdrawal>
-      >;
+      let component: EmbeddedComponent<Withdrawal>;
 
       beforeEach(() => {
         port = {
@@ -138,10 +121,7 @@ describe('EmbeddedComponent', () => {
           .mockImplementation((event, handler) => {
             messageHandler = handler;
           });
-        component = new EmbeddedComponent<
-          Partial<Withdrawal>,
-          TransactionResponse<Withdrawal>
-        >(url, value);
+        component = new EmbeddedComponent<Withdrawal>(url, value);
         component.mount(parentId);
 
         expect(messageHandler).toBeDefined();
@@ -149,7 +129,7 @@ describe('EmbeddedComponent', () => {
       });
 
       test('send', () => {
-        const message: HostMessage = {
+        const message: HostMessage<Withdrawal> = {
           type: HMType.UPDATE,
           value: {
             requestId: 'id',
@@ -175,7 +155,7 @@ describe('EmbeddedComponent', () => {
         // @ts-expect-error - we've already verified that port exists
         port.onmessage({
           data: { type: CMType.COMPLETE, response },
-        } as MessageEvent);
+        });
 
         promise.then((result) => {
           expect(result).toBe(response);

package/src/notabene.ts

@@ -4,7 +4,6 @@ import type {
   CallbackOptions,
   ComponentMessage,
   ConnectionRequest,
-  ConnectionResponse,
   Counterparty,
   DeclarationProof,
   Deposit,
@@ -35,11 +34,11 @@ import {
 } from './types';
 import { encodeObjectToFragment } from './utils/urls';
 
+// Must be exported for React Native SDK to use
+export { default as EmbeddedComponent } from './components/EmbeddedComponent';
 export type {
   ComponentMessage,
-  EmbeddedComponent,
   ConnectionRequest,
-  ConnectionResponse,
   HostMessage,
   Theme,
   Counterparty,
@@ -182,13 +181,13 @@ export default class Notabene {
    * @returns A new EmbeddedComponent instance
    * @internal
    */
-  createComponent<V, R>(
+  createComponent<V>(
     path: string,
-    value: V,
+    value: Partial<V>,
     options?: TransactionOptions,
     callbacks?: CallbackOptions,
   ) {
-    return new EmbeddedComponent<V, R>(
+    return new EmbeddedComponent<V>(
       this.componentUrl(path, value, options, callbacks),
       value,
     );
@@ -207,10 +206,12 @@ export default class Notabene {
     options?: TransactionOptions,
     callbacks?: CallbackOptions,
   ) {
-    return this.createComponent<
-      Partial<Withdrawal>,
-      TransactionResponse<Withdrawal>
-    >('withdrawal-assist', value, options, callbacks);
+    return this.createComponent<Withdrawal>(
+      'withdrawal-assist',
+      value,
+      options,
+      callbacks,
+    );
   }
 
   /**
@@ -227,10 +228,12 @@ export default class Notabene {
     options?: TransactionOptions,
     callbacks?: CallbackOptions,
   ) {
-    return this.createComponent<
-      Partial<Withdrawal>,
-      TransactionResponse<Withdrawal>
-    >('wallet-assist', value, options, callbacks);
+    return this.createComponent<Withdrawal>(
+      'wallet-assist',
+      value,
+      options,
+      callbacks,
+    );
   }
 
   /**
@@ -247,7 +250,7 @@ export default class Notabene {
     options?: any,
     callbacks?: CallbackOptions,
   ) {
-    return this.createComponent<Partial<Deposit>, TransactionResponse<Deposit>>(
+    return this.createComponent<Deposit>(
       'deposit-assist',
       value,
       options,
@@ -269,7 +272,7 @@ export default class Notabene {
     options?: TransactionOptions,
     callbacks?: CallbackOptions,
   ) {
-    return this.createComponent<ConnectionRequest, ConnectionResponse>(
+    return this.createComponent<ConnectionRequest>(
       'connect',
       value,
       options,
@@ -291,10 +294,12 @@ export default class Notabene {
     options?: TransactionOptions,
     callbacks?: CallbackOptions,
   ) {
-    return this.createComponent<
-      DepositRequest,
-      TransactionResponse<DepositRequest>
-    >('deposit-request', value, options, callbacks);
+    return this.createComponent<DepositRequest>(
+      'deposit-request',
+      value,
+      options,
+      callbacks,
+    );
   }
 
   /**

package/src/types.ts

@@ -355,17 +355,6 @@ export interface ConnectionRequest extends ComponentRequest {
   asset: TransactionAsset;
 }
 
-/**
- * An object representing a connection response
- * @public
- */
-export interface ConnectionResponse extends ComponentResponse {
-  value: ConnectionRequest;
-  ivms: IVMS101;
-  proof?: OwnershipProof;
-  txCreate?: V1Transaction;
-}
-
 /**
  * The verification status of a transaction
  * @public
@@ -469,19 +458,19 @@ export const enum CMType {
   RESULT = 'result',
   READY = 'ready',
   INVALID = 'invalid',
-  MODAL = 'openModal',
   ERROR = 'error',
-  CLOSE = 'closeModal',
   CANCEL = 'cancel',
 }
 
 /**
  * Represents a completed component message
+ * @typeParam T - The overall Value type being returned
+ * @param response - The Response object which wraps T
  * @public
  */
-export type Completed = {
+export type Completed<T> = {
   type: CMType.COMPLETE;
-  response: ComponentResponse;
+  response: TransactionResponse<T>;
 };
 
 /**
@@ -493,8 +482,8 @@ export type Ready = {
 };
 
 /**
- * Represents a resize request component message
- * @public
+ * Represents a resize request component message. This is handled by the library.
+ * @internal
  */
 export type ResizeRequest = {
   type: CMType.RESIZE;
@@ -503,6 +492,7 @@ export type ResizeRequest = {
 
 /**
  * Represents an error component message
+ * @param message - Error message
  * @public
  */
 export type Error = {
@@ -512,7 +502,7 @@ export type Error = {
 
 /**
  * Represents a cancel component message
- * @public
+ * @internal
  */
 export type Cancel = {
   type: CMType.CANCEL;
@@ -520,11 +510,14 @@ export type Cancel = {
 
 /**
  * Represents an invalid value component message
- * @public
+ * @typeParam T - The overall Value type being returned
+ * @param value - The current Partial value
+ * @param errors - Array of validation errors
+ * @internal
  */
-export type InvalidValue = {
+export type InvalidValue<T> = {
   type: CMType.INVALID;
-  value: any;
+  value: Partial<T>;
   errors: ValidationError[];
 };
 
@@ -532,13 +525,13 @@ export type InvalidValue = {
  * Component Message
  * @public
  */
-export type ComponentMessage =
-  | Completed
+export type ComponentMessage<T> =
+  | Completed<T>
   | Cancel
   | Error
   | Ready
   | ResizeRequest
-  | InvalidValue;
+  | InvalidValue<T>;
 
 /**
  * Host Message Types
@@ -551,19 +544,19 @@ export const enum HMType {
 }
 
 /**
- * Represents an update value host message
+ * Represents an update value host message. This is sent from Host to component.
  * @public
  */
-export type UpdateValue = {
+export type UpdateValue<T> = {
   type: HMType.UPDATE;
-  value: ComponentRequest;
+  value: Partial<T>;
 };
 
 /**
  * Host Messages
  * @public
  */
-export type HostMessage = UpdateValue;
+export type HostMessage<T> = UpdateValue<T>;
 
 /**
  * Options for callback and redirect URIs
@@ -592,6 +585,7 @@ export enum ProofStatus {
 export enum ProofTypes {
   SelfDeclaration = 'self-declaration',
   PersonalSignEIP191 = 'eip-191',
+  SIWE = 'siwe',
   PersonalSignEIP712 = 'eip-712',
   PersonalSignBIP137 = 'bip-137',
   PersonalSignXPUB = 'xpub',
@@ -619,6 +613,7 @@ export interface SignatureProof extends OwnershipProof {
     | ProofTypes.PersonalSignEIP191
     | ProofTypes.PersonalSignEIP712
     | ProofTypes.PersonalSignBIP137
+    | ProofTypes.SIWE
     | ProofTypes.PersonalSignXPUB;
   proof: string;
   attestation: string;

package/src/utils/MessageEventManager.ts

@@ -1,9 +1,9 @@
 import { ComponentMessage, HostMessage } from '../types';
 
-export type MessageCallback = (message: ComponentMessage) => void;
+export type MessageCallback<T> = (message: ComponentMessage<T>) => void;
 
-export class MessageEventManager {
-  private listeners: Map<string, Set<MessageCallback>> = new Map();
+export class MessageEventManager<T> {
+  private listeners: Map<string, Set<MessageCallback<T>>> = new Map();
   private port?: MessagePort;
 
   constructor() {
@@ -16,14 +16,14 @@ export class MessageEventManager {
     this.port.start();
   }
 
-  on(messageType: string, callback: MessageCallback): void {
+  on(messageType: string, callback: MessageCallback<T>): void {
     if (!this.listeners.has(messageType)) {
       this.listeners.set(messageType, new Set());
     }
     this.listeners.get(messageType)!.add(callback);
   }
 
-  off(messageType: string, callback: MessageCallback): void {
+  off(messageType: string, callback: MessageCallback<T>): void {
     const callbacks = this.listeners.get(messageType);
     if (callbacks) {
       callbacks.delete(callback);
@@ -33,7 +33,7 @@ export class MessageEventManager {
     }
   }
 
-  private handleMessage(event: MessageEvent): void {
+  private handleMessage(event: MessageEvent<ComponentMessage<T>>): void {
     // console.log('received message', event.data);
     const message = event.data;
     if (typeof message === 'object' && message !== null && 'type' in message) {
@@ -46,7 +46,7 @@ export class MessageEventManager {
   }
 
   // Method to send messages through the port
-  send(message: HostMessage): void {
+  send(message: HostMessage<T>): void {
     if (this.port) {
       this.port.postMessage(message);
     }

package/src/utils/__tests__/MessageEventManager.test.ts

@@ -1,9 +1,9 @@
 import { beforeEach, describe, expect, it, vi } from 'vitest';
-import { HMType, UpdateValue } from '../../types';
+import { HMType, UpdateValue, Withdrawal } from '../../types';
 import { MessageEventManager } from '../MessageEventManager';
 
 describe('MessageEventManager', () => {
-  let messageEventManager: MessageEventManager;
+  let messageEventManager: MessageEventManager<Withdrawal>;
   let mockPort: MessagePort;
 
   beforeEach(() => {
@@ -73,7 +73,7 @@ describe('MessageEventManager', () => {
     });
 
     it('should send messages through the port', () => {
-      const message: UpdateValue = {
+      const message: UpdateValue<Withdrawal> = {
         type: HMType.UPDATE,
         value: { requestId: 'id' },
       };