@wildix/xbees-connect 1.0.4-alpha.1 → 1.0.4

package/README.md

@@ -7,14 +7,19 @@ This package is the Community plan edition of the client for UI integration appl
 Install the package in your project directory with:
 
 yarn
+
 ```bash
 yarn add @wildix/xbees-connect
 ```
+
 npm
+
 ```bash
 npm install @wildix/xbees-connect
 ```
+
 ## Usage
+
 ```
 import Client from "@wildix/xbees-connect";
 

package/dist-es/index.js

@@ -1,6 +1,2 @@
 import { Client } from './src/Client';
-(function () {
-    // @ts-expect-error window.xBeesConnect will be used inside another app
-    window.xBeesConnect = Client;
-})();
 export default Client;

package/dist-es/package.json

@@ -1,10 +1,11 @@
 {
-    "name": "xbees-connect",
-    "version": "1.0.0",
+    "name": "@wildix/xbees-connect",
+    "version": "1.0.4-alpha.10",
     "description": "This library provides easy communication between x-bees and integrated web applications",
     "author": "dimitri.chernykh <dimitri.chernykh@wildix.com>",
     "homepage": "",
-    "license": "UNLICENSED",
+    "sideEffects": false,
+    "license": "MIT",
     "main": "./dist-cjs/index.js",
     "types": "./dist-types/index.d.ts",
     "module": "./dist-es/index.js",
@@ -13,6 +14,8 @@
         "build:es": "tsc -p tsconfig.es.json",
         "build:types": "tsc -p tsconfig.types.json",
         "build:docs": "typedoc",
+        "lint": "eslint .",
+        "lint:fix": "eslint . --fix",
         "clean": "rimraf ./dist-* && rimraf *.tsbuildinfo"
     },
     "files": [
@@ -20,15 +23,22 @@
     ],
     "repository": {
         "type": "git",
-        "url": "git@git.wildix.com:dimitri.chernykh/sdk-ui.git"
+        "url": "git@git.wildix.com:xbs/sdk-ui.git"
     },
-    "engines": {
-        "node": ">=18"
+    "publishConfig": {
+        "access": "public"
     },
-    "dependencies": {
+    "devDependencies": {
+        "eslint": "^8.53.0",
+        "rimraf": "^5.0.5",
         "typescript": "^5.2.2"
     },
-    "devDependencies": {
-        "rimraf": "^5.0.5"
+    "parserOptions": {
+        "project": [
+            "./tsconfig.json"
+        ]
+    },
+    "engines": {
+        "node": ">=16"
     }
 }

package/dist-es/src/Client.js

@@ -1,30 +1,48 @@
-import { ClientEventType, EventType, } from './types';
-import PostMessageControllerNative from './PostMessageControllerNative';
-import PostMessageControllerWeb from './PostMessageControllerWeb';
 import packageJson from '../package.json';
+import PostMessageControllerNative from './helpers/PostMessageControllerNative';
+import PostMessageControllerWeb from './helpers/PostMessageControllerWeb';
+import { ClientEventType, EventType, } from './types';
 /**
  * Client provides functionality of communication between xBees and integrated web applications via iFrame or ReactNative WebView
  * integration creates na instance with new Client()
  * */
 export class Client {
+    static instance = null;
     static getInstance() {
         if (!this.instance) {
             this.instance = new Client();
         }
         return this.instance;
     }
+    static initialize(renderer) {
+        if (this.getInstance().showsUi()) {
+            try {
+                void renderer();
+            }
+            catch (error) {
+                console.error('Error on init rendering widget:', error);
+            }
+        }
+        else {
+            console.log('run daemon');
+            void this.getInstance().ready();
+        }
+    }
+    worker;
+    listeners = [];
+    useSubscription = false;
+    iframeId;
+    variant = null;
     constructor() {
-        this.listeners = [];
-        this.useSubscription = false;
-        this.iframeId = null;
-        this.variant = null;
         const params = new URLSearchParams(window.location.search);
         this.iframeId = params.get('iframeId');
         this.variant = params.get('variant');
         // @ts-expect-error window.ReactNativeWebView will be provided by ReactNative WebView
-        this.worker = window.ReactNativeWebView ? new PostMessageControllerNative() : new PostMessageControllerWeb();
+        this.worker = window.ReactNativeWebView
+            ? new PostMessageControllerNative()
+            : new PostMessageControllerWeb();
     }
-    async sendAsync(data) {
+    sendAsync(data) {
         return this.worker.sendAsync({
             ...data,
             iframeId: this.iframeId,
@@ -38,7 +56,8 @@ export class Client {
             }
             return data;
         }
-        catch (e) {
+        catch (error) {
+            console.error('parse message error', error);
             return null;
         }
     }
@@ -51,19 +70,22 @@ export class Client {
         this.listeners.forEach(({ eventName, callback }) => {
             if (eventName === type) {
                 if (type === EventType.ADD_CALL) {
-                    const cb = callback;
-                    cb(payload);
+                    const callbackFn = callback;
+                    callbackFn(payload);
                 }
                 else {
                     // @ts-expect-error TODO: check the type for Callback<?>
-                    const cb = callback;
-                    cb(payload);
+                    const callbackFn = callback;
+                    callbackFn(payload);
                 }
             }
         });
     }
-    async ready() {
-        return this.sendAsync({ type: ClientEventType.READY, payload: { version: this.version() } });
+    ready() {
+        return this.sendAsync({
+            type: ClientEventType.READY,
+            payload: { version: this.version() },
+        });
     }
     version() {
         return packageJson.version;
@@ -74,40 +96,43 @@ export class Client {
     showsUi() {
         return !this.isDaemon();
     }
-    async getContext() {
+    getContext() {
         return this.sendAsync({ type: ClientEventType.CONTEXT });
     }
-    async getCurrentContact() {
+    getCurrentContact() {
         return this.sendAsync({ type: ClientEventType.CURRENT_CONTACT });
     }
-    async getThemeMode() {
+    getThemeMode() {
         return this.sendAsync({ type: ClientEventType.THEME_MODE });
     }
-    async getTheme() {
+    getTheme() {
         return this.sendAsync({ type: ClientEventType.THEME });
     }
-    async startCall(phoneNumber) {
-        return this.sendAsync({ type: ClientEventType.START_CALL, payload: { phoneNumber } });
+    startCall(phoneNumber) {
+        return this.sendAsync({
+            type: ClientEventType.START_CALL,
+            payload: { phoneNumber },
+        });
     }
-    async reboot() {
+    reboot() {
         return this.sendAsync({ type: ClientEventType.REBOOT });
     }
-    async setViewport(payload) {
+    setViewport(payload) {
         return this.sendAsync({ type: ClientEventType.VIEW_PORT, payload });
     }
-    async toClipboard(payload) {
+    toClipboard(payload) {
         return this.sendAsync({ type: ClientEventType.TO_CLIPBOARD, payload });
     }
-    async isNotAuthorized(payload) {
-        return this.sendAsync({ type: ClientEventType.NOT_AUTHORIZED, payload });
+    isNotAuthorized() {
+        return this.sendAsync({ type: ClientEventType.NOT_AUTHORIZED });
     }
-    async isAuthorized(payload) {
-        return this.sendAsync({ type: ClientEventType.AUTHORIZED, payload });
+    isAuthorized() {
+        return this.sendAsync({ type: ClientEventType.AUTHORIZED });
     }
-    async getContactsAutoSuggest(payload) {
+    getContactsAutoSuggest(payload) {
         return this.sendAsync({
             type: ClientEventType.CONTACTS_AUTO_SUGGEST,
-            payload: payload,
+            payload,
         });
     }
     addEventListener(eventName, callback) {
@@ -119,10 +144,13 @@ export class Client {
         if (!foundThisEvent) {
             this.listeners.push({ eventName, callback });
         }
-        return () => { this.removeEventListener(eventName, callback); };
+        return () => {
+            this.removeEventListener(eventName, callback);
+        };
     }
     removeEventListener(eventName, callback) {
-        this.listeners = this.listeners.filter(({ eventName: _eventName, callback: _callback }) => !(Object.is(callback, _callback) && (!eventName ? true : eventName === _eventName)));
+        this.listeners = this.listeners.filter(({ eventName: _eventName, callback: _callback }) => !(Object.is(callback, _callback) &&
+            (!eventName ? true : eventName === _eventName)));
         if (this.useSubscription && !this.listeners.length) {
             this.useSubscription = false;
             window.removeEventListener('message', this.onMessage.bind(this));
@@ -142,23 +170,21 @@ export class Client {
     }
     onSuggestContacts(callback) {
         return this.addEventListener(EventType.GET_CONTACTS_AUTO_SUGGEST, (query) => {
-            const resolve = (contacts) => {
-                return this.sendAsync({
-                    type: ClientEventType.CONTACTS_AUTO_SUGGEST,
-                    payload: {
-                        contacts,
-                        query
-                    },
-                });
-            };
+            const resolve = (contacts) => this.sendAsync({
+                type: ClientEventType.CONTACTS_AUTO_SUGGEST,
+                payload: {
+                    contacts,
+                    query,
+                },
+            });
             const reject = (reason) => {
                 console.debug(reason);
             };
             try {
                 callback(query, resolve, reject);
             }
-            catch (e) {
-                reject(e.toString());
+            catch (error) {
+                reject(`${error}`);
             }
         });
     }
@@ -166,4 +192,3 @@ export class Client {
         this.addEventListener(EventType.USE_THEME, callback);
     }
 }
-Client.instance = null;

package/dist-es/src/{PostMessageControllerNative.js → helpers/PostMessageControllerNative.js}

@@ -1,43 +1,44 @@
 export default class PostMessageControllerNative {
+    target;
+    timeout = 10000;
     constructor() {
-        this.timeout = 10000;
         // @ts-expect-error window.ReactNativeWebView will be provided by ReactNative WebView
         this.target = window.ReactNativeWebView;
     }
-    async sendAsync(data) {
+    sendAsync(data) {
         if (!this.target) {
-            return Promise.reject('xBeesConnect should be wrapped within iframe to perform the connection');
+            return Promise.reject('your application should be wrapped within iframe to xbees-connect perform the connection');
         }
         return this.send(this.target, data);
     }
-    send(target, payload) {
-        return new Promise((res, rej) => {
+    send(target, message) {
+        return new Promise((resolve, reject) => {
             const channel = new MessageChannel();
             const listener = (event) => {
                 try {
                     const parsedData = JSON.parse(event.data);
-                    if (parsedData?.type === payload.type) {
+                    if (parsedData?.type === message.type) {
                         clearTimeout(timeout);
                         window.removeEventListener('message', listener);
                         if (!parsedData.errorMessage) {
-                            res(parsedData);
+                            resolve(parsedData);
                         }
                         else {
-                            rej(parsedData);
+                            reject(parsedData);
                         }
                     }
                 }
-                catch (e) {
-                    console.error("on receive response Error", e);
+                catch (error) {
+                    console.error('on receive response Error', error);
                 }
             };
             window.addEventListener('message', listener);
             const timeout = setTimeout(() => {
                 channel.port1.close();
                 window.removeEventListener('message', listener);
-                rej({ errorMessage: 'timeout', type: payload.type });
+                reject({ errorMessage: 'timeout', type: message.type });
             }, this.timeout);
-            target.postMessage(JSON.stringify(payload));
+            target.postMessage(JSON.stringify(message));
         });
     }
 }

package/dist-es/src/{PostMessageControllerWeb.js → helpers/PostMessageControllerWeb.js}

@@ -1,29 +1,30 @@
 export default class PostMessageControllerWeb {
+    target;
+    timeout = 10000;
     constructor() {
-        this.timeout = 10000;
         this.target = parent;
     }
-    async sendAsync(data) {
+    sendAsync(data) {
         if (!this.target || this.target === window) {
-            return Promise.reject('xBeesConnect should be wrapped within iframe to perform the connection');
+            return Promise.reject('your application should be wrapped within iframe to xbees-connect perform the connection');
         }
         return this.send(this.target, data);
     }
     send(target, payload) {
-        return new Promise((res, rej) => {
+        return new Promise((resolve, reject) => {
             const channel = new MessageChannel();
             const timeout = setTimeout(() => {
                 channel.port1.close();
-                rej({ errorMessage: 'timeout', type: payload.type });
+                reject({ errorMessage: 'timeout', type: payload.type });
             }, this.timeout);
             channel.port1.onmessage = ({ data }) => {
                 clearTimeout(timeout);
                 channel.port1.close();
                 if (!data.errorMessage) {
-                    res(data);
+                    resolve(data);
                 }
                 else {
-                    rej(data);
+                    reject(data);
                 }
             };
             target.postMessage(payload, '*', [channel.port2]);

package/dist-types/src/Client.d.ts

@@ -1,4 +1,4 @@
-import { AutoSuggestResult, Callback, ConnectClient, EventType, Reject, RemoveEventListener, Resolve, Response } from './types';
+import { AutoSuggestResult, Callback, ConnectClient, EventType, Reject, RemoveEventListener, Resolve, Response, ViewPortSize } from './types';
 /**
  * Client provides functionality of communication between xBees and integrated web applications via iFrame or ReactNative WebView
  * integration creates na instance with new Client()
@@ -6,6 +6,7 @@ import { AutoSuggestResult, Callback, ConnectClient, EventType, Reject, RemoveEv
 export declare class Client implements ConnectClient {
     private static instance;
     static getInstance(): Client;
+    static initialize(renderer: () => Promise<void>): void;
     private worker;
     private listeners;
     private useSubscription;
@@ -25,13 +26,10 @@ export declare class Client implements ConnectClient {
     getTheme(): Promise<Response>;
     startCall(phoneNumber: string): Promise<Response>;
     reboot(): Promise<Response>;
-    setViewport(payload: {
-        height: number;
-        width: number;
-    }): Promise<Response>;
+    setViewport(payload: ViewPortSize): Promise<Response>;
     toClipboard(payload: string): Promise<Response>;
-    isNotAuthorized(payload: string): Promise<Response>;
-    isAuthorized(payload: string): Promise<Response>;
+    isNotAuthorized(): Promise<Response>;
+    isAuthorized(): Promise<Response>;
     getContactsAutoSuggest(payload: AutoSuggestResult): Promise<Response>;
     addEventListener<T extends EventType = EventType>(eventName: T, callback: Callback<T>): RemoveEventListener;
     removeEventListener<T extends EventType = EventType>(eventName: T | null, callback: Callback<T>): void;

package/dist-types/src/helpers/PostMessageControllerNative.d.ts

@@ -0,0 +1,8 @@
+import { MessageResponse, PostMessageController, Response } from '../types';
+export default class PostMessageControllerNative implements PostMessageController {
+    private readonly target;
+    private timeout;
+    constructor();
+    sendAsync(data: MessageResponse): Promise<Response>;
+    private send;
+}

package/dist-types/src/helpers/PostMessageControllerWeb.d.ts

@@ -0,0 +1,8 @@
+import { MessageResponse, PostMessageController, Response } from '../types';
+export default class PostMessageControllerWeb implements PostMessageController {
+    private readonly target;
+    private timeout;
+    constructor();
+    sendAsync(data: MessageResponse): Promise<Response>;
+    private send;
+}

package/dist-types/src/types.d.ts

@@ -1,3 +1,25 @@
+export declare enum EventType {
+    GET_CONTACTS_AUTO_SUGGEST = "xBeesGetContactsAutoSuggest",
+    ADD_CALL = "xBeesAddCall",
+    TERMINATE_CALL = "xBeesTerminateCall",
+    USE_THEME = "xBeesUseTheme",
+    PBX_TOKEN = "xBeesPbxToken"
+}
+export declare enum ClientEventType {
+    READY = "xBeesReady",
+    CONTEXT = "xBeesContext",
+    CURRENT_CONTACT = "xBeesCurrentContact",
+    THEME_MODE = "xBeesThemeMode",
+    THEME = "xBeesTheme",
+    START_CALL = "xBeesStartCall",
+    VIEW_PORT = "xBeesViewPort",
+    REBOOT = "xBeesReboot",
+    TO_CLIPBOARD = "xBeesToClipboard",
+    NOT_AUTHORIZED = "xBeesNotAuthorized",
+    AUTHORIZED = "xBeesAuthorized",
+    CONTACTS_AUTO_SUGGEST = "xBeesContactsAutoSuggest"
+}
+export type MessageType = ClientEventType | EventType;
 interface ContactShape {
     id: string;
     name: string;
@@ -11,45 +33,41 @@ interface ContactShape {
     extension?: string;
     organization?: string;
 }
-export type Contact = ContactShape & {
+export type Contact = (ContactShape & {
     email: string;
-} | ContactShape & {
+}) | (ContactShape & {
     phone: string;
+});
+export type ViewPortSize = {
+    height: number;
+    width: number;
 };
-export type Message<T extends EventType = EventType> = {
+type EventPayload<T extends MessageType> = T extends EventType.GET_CONTACTS_AUTO_SUGGEST ? string : T extends ClientEventType.CONTACTS_AUTO_SUGGEST ? AutoSuggestResult : T extends EventType.ADD_CALL ? CallStartInfo : T extends ClientEventType.START_CALL ? StartCallPayload : T extends ClientEventType.READY ? {
+    version: string;
+} : T extends ClientEventType.VIEW_PORT ? ViewPortSize : T extends EventType.USE_THEME ? string : T extends EventType.PBX_TOKEN ? string : never;
+export type Message<T extends MessageType = MessageType> = {
     type: T;
-    payload: EventPayload<T>;
+    payload?: EventPayload<T>;
 };
-export type Response = {
+export type MessageResponse<T extends MessageType = MessageType> = Message<T> & {
+    iframeId: string;
+};
+export type Payload = string | Record<string, string> | ThemeChangePayload;
+export type Response<T extends Payload = Payload> = {
     type?: string;
     message?: string;
     errorMessage?: string;
+    payload?: T;
+};
+export type RawMessage = {
+    data?: string;
+};
+export type SendPayload = {
+    type: ClientEventType;
     payload?: any;
 };
-export declare enum EventType {
-    GET_CONTACTS_AUTO_SUGGEST = "xBeesGetContactsAutoSuggest",
-    ADD_CALL = "xBeesAddCall",
-    TERMINATE_CALL = "xBeesTerminateCall",
-    USE_THEME = "xBeesUseTheme",
-    PBX_TOKEN = "xBeesPbxToken"
-}
-export declare enum ClientEventType {
-    READY = "xBeesReady",
-    CONTEXT = "xBeesContext",
-    CURRENT_CONTACT = "xBeesCurrentContact",
-    THEME_MODE = "xBeesThemeMode",
-    THEME = "xBeesTheme",
-    START_CALL = "xBeesStartCall",
-    VIEW_PORT = "xBeesViewPort",
-    REBOOT = "xBeesReboot",
-    TO_CLIPBOARD = "xBeesToClipboard",
-    NOT_AUTHORIZED = "xBeesNotAuthorized",
-    AUTHORIZED = "xBeesAuthorized",
-    CONTACTS_AUTO_SUGGEST = "xBeesContactsAutoSuggest"
-}
-export type MessageType = ClientEventType | EventType;
 export type ThemeChangePayload = {
-    mode: "light" | "dark";
+    mode: 'light' | 'dark';
     themeOptions?: {
         typography?: unknown;
         palette?: unknown;
@@ -61,7 +79,9 @@ type CallStartInfo = {
     destination: string;
     video: boolean;
 };
-type EventPayload<T extends EventType> = T extends EventType.GET_CONTACTS_AUTO_SUGGEST ? string : T extends EventType.ADD_CALL ? CallStartInfo : T extends EventType.USE_THEME ? string : T extends EventType.PBX_TOKEN ? string : never;
+type StartCallPayload = {
+    phoneNumber: string;
+};
 export type EventPayloadMap = {
     [EventType.GET_CONTACTS_AUTO_SUGGEST]: string;
     [EventType.ADD_CALL]: CallStartInfo;
@@ -88,6 +108,7 @@ export type ClientEventCallbackMap = {
 export interface ReactNativeWebView {
     postMessage: (payload: unknown, origin?: string, d?: unknown[]) => void;
 }
+export type Callback<T extends EventType = EventType> = T extends keyof EventCallbackMap ? EventCallbackMap[T] : DefaultCallback;
 export interface Listener<T extends EventType = EventType> {
     eventName: T;
     callback: Callback<T>;
@@ -97,12 +118,11 @@ export interface AutoSuggestResult {
     contacts: Contact[];
     query: string;
 }
-export interface SendData {
-    sendAsync(data: any): Promise<Response>;
+export interface PostMessageController {
+    sendAsync(data: MessageResponse): Promise<Response>;
 }
 export type Resolve = (contacts: Contact[]) => void;
 export type Reject = (reason: string) => void;
-export type Callback<T extends EventType = EventType> = T extends keyof EventCallbackMap ? EventCallbackMap[T] : DefaultCallback;
 export type RemoveEventListener = () => void;
 export interface ConnectClient {
     /**
@@ -138,10 +158,7 @@ export interface ConnectClient {
     reboot: () => Promise<Response>;
     /**
      * Sends request to x-bees about current frame size change */
-    setViewport: (payload: {
-        height: number;
-        width: number;
-    }) => Promise<Response>;
+    setViewport: (payload: ViewPortSize) => Promise<Response>;
     /**
      * Sends request to x-bees to put string to the users clipboard */
     toClipboard: (payload: string) => Promise<Response>;
@@ -150,10 +167,10 @@ export interface ConnectClient {
     getContactsAutoSuggest: (payload: AutoSuggestResult) => Promise<Response>;
     /**
      * pushes to x-bees message that user is authorized and no more actions required */
-    isAuthorized: (payload: string) => Promise<Response>;
+    isAuthorized: () => Promise<Response>;
     /**
      * pushes to x-bees message that user actions required */
-    isNotAuthorized: (payload: string) => Promise<Response>;
+    isNotAuthorized: () => Promise<Response>;
     /**
      * Starts listen for one of the events of the x-bees and handle with the provided callback */
     addEventListener: <T extends EventType = EventType>(eventName: T, callback: Callback<T>) => RemoveEventListener;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wildix/xbees-connect",
-  "version": "1.0.4-alpha.1",
+  "version": "1.0.4",
   "description": "This library provides easy communication between x-bees and integrated web applications",
   "author": "dimitri.chernykh <dimitri.chernykh@wildix.com>",
   "homepage": "",
@@ -14,6 +14,8 @@
     "build:es": "tsc -p tsconfig.es.json",
     "build:types": "tsc -p tsconfig.types.json",
     "build:docs": "typedoc",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
     "clean": "rimraf ./dist-* && rimraf *.tsbuildinfo"
   },
   "files": [
@@ -21,14 +23,23 @@
   ],
   "repository": {
     "type": "git",
-    "url": "git@git.wildix.com:dimitri.chernykh/sdk-ui.git"
+    "url": "git@git.wildix.com:xbs/sdk-ui.git"
   },
   "publishConfig": {
     "access": "public"
   },
   "devDependencies": {
+    "eslint": "^8.53.0",
     "rimraf": "^5.0.5",
     "typescript": "^5.2.2"
   },
-  "gitHead": "b64d0bff60d65c22da252f2656c35d96507f4c16"
+  "parserOptions": {
+    "project": [
+      "./tsconfig.json"
+    ]
+  },
+  "engines": {
+    "node": ">=16"
+  },
+  "gitHead": "e98842e62bf2e122084d24b473c266f314df1a1c"
 }

package/dist-types/src/PostMessageControllerNative.d.ts

@@ -1,8 +0,0 @@
-import { SendData, Response } from './types';
-export default class PostMessageControllerNative implements SendData {
-    private readonly target;
-    private timeout;
-    constructor();
-    sendAsync(data: any): Promise<Response>;
-    private send;
-}

package/dist-types/src/PostMessageControllerWeb.d.ts

@@ -1,8 +0,0 @@
-import { SendData, Response } from './types';
-export default class PostMessageControllerWeb implements SendData {
-    private readonly target;
-    private timeout;
-    constructor();
-    sendAsync(data: any): Promise<Response>;
-    private send;
-}