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

package/dist/notabene.js

@@ -0,0 +1,296 @@
+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 = /* @__PURE__ */ ((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 = /* @__PURE__ */ ((r) => (r.UPDATE = "update", r.REQUEST_RESPONSE = "requestResponse", r))(l || {});
+class m {
+  constructor() {
+    n(this, "listeners", /* @__PURE__ */ 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, /* @__PURE__ */ 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));
+    }
+  }
+  // Method to send messages through the port
+  send(e) {
+    this.port && this.port.postMessage(e);
+  }
+}
+class u {
+  /**
+   * Creates an instance of EmbeddedComponent.
+   * @param url - The URL of the embedded component
+   * @param value - The initial transaction value
+   */
+  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`);
+    });
+  }
+  /**
+   * Gets the URL of the embedded component
+   * @returns The URL of the embedded component
+   */
+  get url() {
+    return this._url;
+  }
+  /**
+   * Gets the current transaction value
+   * @returns The current transaction value
+   */
+  get value() {
+    return this._value;
+  }
+  get errors() {
+    return this._errors;
+  }
+  /**
+   * Opens the component URL in the current window
+   */
+  open() {
+    document.location.href = this.url;
+  }
+  /**
+   * Mounts the component to a parent element
+   * @param parentId - The ID of the parent element
+   * @throws Will throw an error if the parent element is not found
+   */
+  mount(e) {
+    const t = document.querySelector(e);
+    if (!t) throw new Error(`parentID ${e} not found`);
+    this.embed(t);
+  }
+  /**
+   * Embeds the component into a parent element
+   * @param parent - The parent element to embed the component into
+   */
+  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();
+  }
+  /**
+   * Sends a message to the embedded component
+   * @param message - The message to send
+   */
+  send(e) {
+    this.eventManager.send(e);
+  }
+  /**
+   * 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(e, t) {
+    this.eventManager.on(e, t);
+  }
+  /**
+   * 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(e, t) {
+    this.eventManager.off(e, t);
+  }
+  /**
+   * Updates the transaction value and sends an update message to the component
+   * @param value - The new transaction value
+   */
+  update(e) {
+    this._value = e, this.send({ type: l.UPDATE, value: e });
+  }
+  /**
+   * Waits for the component to complete and returns the transaction response
+   * @returns A promise that resolves with the transaction response
+   */
+  completion() {
+    return new Promise((e, t) => {
+      this.on(a.COMPLETE, (s) => {
+        e(s.response);
+      }), this.on("error", (s) => {
+        t(new Error(s.message));
+      });
+    });
+  }
+  /**
+   * 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), 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();
+  }
+  /**
+   * Closes the modal dialog
+   *
+   */
+  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 E {
+  /**
+   * Creates a new instance of the Notabene SDK
+   *
+   * @param config - Configuration options for the Notabene SDK
+   */
+  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;
+  }
+  /**
+   * Generates a URL for a Notabene component
+   *
+   * @param path - The path of the component
+   * @param value - Transaction data
+   * @param configuration - Optional transaction configuration
+   * @param callbacks - Optional callback configuration
+   * @returns component URL
+   * @internal
+   */
+  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();
+  }
+  /**
+   * Creates a new embedded component
+   *
+   * @param path - The path of the component
+   * @param value - Transaction data
+   * @param options - Optional transaction options
+   * @param callbacks - Optional callback configuration
+   * @returns A new EmbeddedComponent instance
+   * @internal
+   */
+  createComponent(e, t, s, o) {
+    return new u(
+      this.componentUrl(e, t, s, o),
+      t
+    );
+  }
+  /**
+   * Creates a withdrawal assist component
+   *
+   * @param value - Withdrawal transaction data
+   * @param options - Optional transaction options
+   * @param callbacks - Optional callback configuration
+   * @returns A new EmbeddedComponent instance for withdrawal assistance
+   */
+  createWithdrawalAssist(e, t, s) {
+    return this.createComponent("withdrawal-assist", e, t, s);
+  }
+  /**
+   * Creates a deposit assist component
+   *
+   * @param value - Deposit transaction data
+   * @param options - Optional transaction options
+   * @param callbacks - Optional callback configuration
+   * @returns A new EmbeddedComponent instance for deposit assistance
+   * @alpha
+   */
+  createDepositAssist(e, t, s) {
+    return this.createComponent(
+      "deposit-assist",
+      e,
+      t,
+      s
+    );
+  }
+  /**
+   * Creates a connect component
+   *
+   * @param value - Connection request data
+   * @param options - Optional transaction options
+   * @param callbacks - Optional callback configuration
+   * @returns A new EmbeddedComponent instance for connection
+   */
+  createConnectWallet(e, t, s) {
+    return this.createComponent(
+      "connect",
+      e,
+      t,
+      s
+    );
+  }
+  /**
+   * Creates a deposit request component
+   *
+   * @param value - Deposit request data
+   * @param options - Optional transaction options
+   * @param callbacks - Optional callback configuration
+   * @returns A new EmbeddedComponent instance for deposit requests
+   * @alpha
+   */
+  createDepositRequest(e, t, s) {
+    return this.createComponent("deposit-request", e, t, s);
+  }
+  /**
+   * Decodes a URL fragment into an object
+   *
+   * @param fragment - The URL fragment to decode
+   * @returns An object containing the decoded key-value pairs
+   */
+  decodeFragmentToObject(e) {
+    return e.slice(1).split("&").reduce(
+      (s, o) => {
+        const [i, h] = o.split("=");
+        return s[decodeURIComponent(i)] = decodeURIComponent(h), s;
+      },
+      {}
+    );
+  }
+}
+export {
+  E as default
+};

package/dist/tsdoc-metadata.json

@@ -0,0 +1,11 @@
+// This file is read by tools that parse documentation comments conforming to the TSDoc standard.
+// It should be published with your NPM package.  It should not be tracked by Git.
+{
+  "tsdocVersion": "0.12",
+  "toolPackages": [
+    {
+      "packageName": "@microsoft/api-extractor",
+      "packageVersion": "7.47.9"
+    }
+  ]
+}

package/package.json

@@ -1,5 +1,6 @@
 {
   "name": "@notabene/javascript-sdk",
+  "type": "module",
   "description": "JavaScript SDK for Notabene",
   "homepage": "https://gitlab.com/notabene/open-source/javascript-sdk",
   "repository": {
@@ -8,74 +9,60 @@
   },
   "author": "Notabene <developers@notabene.id>",
   "license": "MIT",
-  "version": "1.34.0",
-  "main": "dist/index.js",
-  "packageManager": "yarn@3.2.2",
+  "version": "2.0.0-next.11",
+  "source": "src/notabene.ts",
+  "main": "dist/notabene.js",
+  "types": "dist/notabene.d.ts",
   "browserslist": "> 0.5%, last 2 versions, not dead",
-  "targets": {
-    "es": {
-      "source": "src/module/index.ts",
-      "isLibrary": false,
-      "context": "browser",
-      "outputFormat": "esmodule"
-    },
-    "lib": {
-      "source": "src/lib/index.ts",
-      "isLibrary": true,
-      "context": "node",
-      "outputFormat": "commonjs"
-    }
-  },
-  "publishConfig": {
-    "access": "public"
-  },
-  "alias": {
-    "process": false,
-    "buffer": false
-  },
+  "files": [
+    "dist",
+    "src",
+    "package.json",
+    "README.md"
+  ],
   "scripts": {
+    "docs": "typedoc --options typedoc.json",
     "prepare": "husky install",
+    "dev": "vite",
+    "preview": "vite preview",
     "watch": "parcel watch",
-    "dev": "sirv --dev --port 3002 public",
     "build:dev": "yarn build && yarn dev",
-    "build": "yarn build:clean && yarn build:compile",
-    "build:clean": "rimraf dist/ .parcel-cache/",
-    "build:compile": "parcel build --no-source-maps && cp dist/es/index.js public/js/notabene.js",
+    "build:clean": "rimraf dist/ ts-out",
+    "build": "yarn lint && vite build && tsc && api-extractor run && yarn docs ",
     "lint": "eslint .",
-    "test": "jest --passWithNoTests --runInBand",
-    "release": "semantic-release"
+    "test": "vitest",
+    "release": "semantic-release",
+    "publish": "yarn build && npm publish --tag next"
   },
   "devDependencies": {
-    "@commitlint/cli": "^16.2.1",
-    "@commitlint/config-conventional": "^16.2.1",
-    "@parcel/packager-ts": "^2.5.0",
-    "@parcel/transformer-typescript-types": "^2.5.0",
+    "@commitlint/cli": "^19.5.0",
+    "@commitlint/config-conventional": "^19.5.0",
+    "@eslint/js": "^9.10.0",
+    "@fast-check/vitest": "^0.1.3",
+    "@microsoft/api-extractor": "^7.47.9",
     "@semantic-release/git": "^10.0.1",
-    "@semantic-release/gitlab": "^9.3.0",
-    "@semantic-release/npm": "^9.0.1",
-    "@types/jest": "^27.5.1",
-    "@typescript-eslint/eslint-plugin": "^5.26.0",
-    "@typescript-eslint/parser": "^5.26.0",
-    "buffer": "^6.0.3",
-    "eslint": "^8.16.0",
-    "eslint-config-prettier": "^8.4.0",
-    "eslint-config-standard": "^16.0.3",
-    "eslint-plugin-import": "^2.25.4",
-    "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-promise": "^6.0.0",
+    "@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",
+    "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",
-    "jest": "^28.1.0",
-    "lint-staged": "^12.3.4",
+    "jsdom": "^25.0.0",
+    "lint-staged": "^12.5.0",
     "organize-imports-cli": "^0.9.0",
-    "parcel": "^2.5.0",
-    "prettier": "^2.6.2",
-    "process": "^0.11.10",
-    "rimraf": "^3.0.2",
-    "semantic-release": "^19.0.2",
-    "sirv-cli": "^2.0.2",
-    "ts-jest": "^28.0.3",
-    "typescript": "^4.7.2"
+    "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"
   },
   "lint-staged": {
     "*.ts": [
@@ -87,9 +74,5 @@
     "extends": [
       "@commitlint/config-conventional"
     ]
-  },
-  "dependencies": {
-    "jsx-pragmatic": "^2.0.22",
-    "zoid": "^9.0.86"
   }
-}
+}

package/src/__tests__/notabene.test.ts

@@ -0,0 +1,159 @@
+import { fc, test } from '@fast-check/vitest';
+import { describe } from 'vitest';
+import { abitraryCallbackOptions, arbitraryComponent } from '../arbitraries';
+import Notabene from '../notabene';
+import { arbitraryLocale } from '../utils/arbitraries';
+
+describe('Notabene', () => {
+  describe('defaults', () => {
+    test.prop([
+      fc.string({ minLength: 3 }),
+      fc.webUrl(),
+      arbitraryComponent(),
+      fc.object(),
+    ])(
+      'Should set the correct values',
+      (authToken, nodeUrl, component, value) => {
+        const notabene = new Notabene({
+          nodeUrl,
+          authToken,
+        });
+        const url = new URL(notabene.componentUrl(component, value));
+        return (
+          url.hash ===
+            `#authToken=${encodeURIComponent(authToken)}&value=${encodeURIComponent(JSON.stringify(value))}` &&
+          url.searchParams.get('nodeUrl') === nodeUrl &&
+          url.pathname === `/${component}`
+        );
+      },
+    );
+  });
+
+  describe('locale', () => {
+    test.prop([
+      fc.string({ minLength: 3 }),
+      fc.webUrl(),
+      arbitraryComponent(),
+      fc.object(),
+      arbitraryLocale(),
+    ])(
+      'Should set the correct values',
+      (authToken, nodeUrl, component, value, locale) => {
+        const notabene = new Notabene({
+          nodeUrl,
+          authToken,
+          locale,
+        });
+        const url = new URL(notabene.componentUrl(component, value));
+        return (
+          url.hash ===
+            `#authToken=${encodeURIComponent(authToken)}&value=${encodeURIComponent(JSON.stringify(value))}` &&
+          url.searchParams.get('nodeUrl') === nodeUrl &&
+          url.searchParams.get('locale') === locale &&
+          url.pathname === `/${component}`
+        );
+      },
+    );
+  });
+
+  describe('minimal', () => {
+    test.prop([arbitraryComponent(), fc.object()])(
+      'Should set the correct values',
+      (component, value) => {
+        const notabene = new Notabene({});
+        const url = new URL(notabene.componentUrl(component, value));
+        return (
+          url.hash === `#value=${encodeURIComponent(JSON.stringify(value))}` &&
+          url.hostname === 'connect.notabene.id' &&
+          url.pathname === `/${component}`
+        );
+      },
+    );
+  });
+
+  describe('with uxUrl', () => {
+    test.prop([
+      fc.string({ minLength: 3 }),
+      fc.webUrl(),
+      arbitraryComponent(),
+      fc.webAuthority(),
+      fc.object(),
+    ])(
+      'Should set the correct values',
+      (authToken, nodeUrl, component, uxAuthority, value) => {
+        const notabene = new Notabene({
+          nodeUrl,
+          authToken,
+          uxUrl: `https://${uxAuthority}`,
+        });
+        const url = new URL(notabene.componentUrl(component, value));
+        const [domain, port] = uxAuthority.split(':');
+        return (
+          url.hostname === domain &&
+          url.port === (port || '') &&
+          url.hash ===
+            `#authToken=${encodeURIComponent(authToken)}&value=${encodeURIComponent(JSON.stringify(value))}` &&
+          url.searchParams.get('nodeUrl') === nodeUrl &&
+          url.pathname === `/${component}`
+        );
+      },
+    );
+  });
+
+  describe('with value and configuration', () => {
+    test.prop([
+      fc.string({ minLength: 3 }),
+      fc.webUrl(),
+      arbitraryComponent(),
+      fc.object(),
+      fc.object(),
+    ])(
+      'Should set the correct values',
+      (authToken, nodeUrl, component, value, configuration) => {
+        const notabene = new Notabene({
+          nodeUrl,
+          authToken,
+        });
+        const url = new URL(
+          notabene.componentUrl(component, value, configuration),
+        );
+        return (
+          url.hash ===
+            `#authToken=${encodeURIComponent(authToken)}&value=${encodeURIComponent(JSON.stringify(value))}&configuration=${encodeURIComponent(JSON.stringify(configuration))}` &&
+          url.searchParams.get('nodeUrl') === nodeUrl &&
+          url.pathname === `/${component}`
+        );
+      },
+    );
+  });
+
+  describe('with value and configuration', () => {
+    test.prop([
+      fc.string({ minLength: 3 }),
+      fc.webUrl(),
+      arbitraryComponent(),
+      fc.object(),
+      fc.object(),
+      abitraryCallbackOptions(),
+    ])(
+      'Should set the correct values',
+      (authToken, nodeUrl, component, value, configuration, callbacks) => {
+        const notabene = new Notabene({
+          nodeUrl,
+          authToken,
+        });
+        const url = new URL(
+          notabene.componentUrl(component, value, configuration, callbacks),
+        );
+        return (
+          url.hash ===
+            `#authToken=${encodeURIComponent(authToken)}&value=${encodeURIComponent(JSON.stringify(value))}&configuration=${encodeURIComponent(JSON.stringify(configuration))}` &&
+          url.searchParams.get('nodeUrl') === nodeUrl &&
+          url.pathname === `/${component}` &&
+          url.searchParams.get('callback_url') === callbacks.callback &&
+          url.searchParams.get('redirect_uri') === callbacks.redirectUri
+        );
+      },
+    );
+  });
+});

package/src/arbitraries.ts

@@ -0,0 +1,13 @@
+import fc from 'fast-check';
+import { CallbackOptions } from './types';
+
+const COMPONENT_MATCHER = /^[a-z0-9-_]+$/;
+// Arbitraries
+export const arbitraryComponent = (): fc.Arbitrary<string> =>
+  fc.stringMatching(COMPONENT_MATCHER);
+
+export const abitraryCallbackOptions = (): fc.Arbitrary<CallbackOptions> =>
+  fc.record({
+    callback: fc.webUrl(),
+    redirectUri: fc.webUrl(),
+  });