From 56856a87abde16d14e4ae4957783295945fcc284 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Fri, 6 Sep 2024 12:01:22 -0400
Subject: [PATCH 01/22] CALL-6780: Update jsdocs and typedefs to make callId
 deprecated

---
 package-lock.json        |   4 +-
 package.json             |   2 +-
 src/CallingExtensions.js | 146 +++++++++++++++++++++++-------------
 src/typedefs.js          | 157 +++++++++++++++++++++++++++++++++++++++
 4 files changed, 255 insertions(+), 54 deletions(-)
 create mode 100644 src/typedefs.js

diff --git a/package-lock.json b/package-lock.json
index 6f45f00..bb41443 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.3",
+  "version": "0.6.4-alpha.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.3",
+      "version": "0.6.4-alpha.0",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index d31b17e..a3a1bb0 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.3",
+  "version": "0.6.4-alpha.0",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"
diff --git a/src/CallingExtensions.js b/src/CallingExtensions.js
index 5a11aaf..b6560be 100644
--- a/src/CallingExtensions.js
+++ b/src/CallingExtensions.js
@@ -1,3 +1,5 @@
+// @ts-check
+
 "use es6";
 
 import IFrameManager from "./IFrameManager";
@@ -8,34 +10,10 @@ import {
   VERSION,
   messageHandlerNames,
 } from "./Constants";
+import "./typedefs";
 
 const prefix = `[calling-extensions-sdk@${VERSION}]`;
 
-/**
- * @typedef {Object} EventHandlers
- * @property {function} onReady - Called when HubSpot is ready to receive messages.
- * @property {function} onDialNumber - Called when the HubSpot sends a dial number from the contact.
- * @property {function} onEngagementCreated - Called when HubSpot creates an engagement
- * for the call.
- * @property {function} onVisibilityChanged - Called when the call widget's visibility changes.
- */
-
-/**
- * @typedef {Object} IframeOptions
- * @property {string} src - iframe URL
- * @property {string} height - Height of iframe
- * @property {string} width - Width of iframe
- * @property {string} hostElementSelector - Selector for host element where iframe will be bound
- */
-
-/**
- * @typedef {Object} Options
- * @property {IframeOptions} iFrameOptions - iFrame configuration options
- * @property {boolean} debugMode - Whether to log various inbound/outbound debug messages
- * to the console.
- * @property {EventHandlers} eventHandlers - Event handlers handle inbound messages.
- */
-
 /*
  * CallingExtensions allows call providers to communicate with HubSpot.
  */
@@ -53,124 +31,191 @@ class CallingExtensions {
     this.iFrameManager = new IFrameManager({
       iFrameOptions: options.iFrameOptions,
       debugMode: options.debugMode,
-      onMessageHandler: event => this.onMessageHandler(event),
+      onMessageHandler: (/** @type {any} */ event) =>
+        // eslint-disable-next-line implicit-arrow-linebreak
+        this.onMessageHandler(event),
     });
   }
 
-  initialized(userData) {
+  /**
+   * Send a message indicating that the soft phone is ready for interaction.
+   *
+   * @param {OnInitialized} payload
+   */
+  initialized(payload) {
     this.sendMessage({
       type: messageType.INITIALIZED,
-      data: userData,
+      data: payload,
     });
   }
 
+  /**
+   * Event when user's availability is changed to available
+   */
   userAvailable() {
     this.sendMessage({
       type: messageType.USER_AVAILABLE,
     });
   }
 
+  /**
+   * Event when user's availability is changed to unavailable
+   */
   userUnavailable() {
     this.sendMessage({
       type: messageType.USER_UNAVAILABLE,
     });
   }
 
+  /**
+   * Sends a message indicating that the user has logged in.
+   */
   userLoggedIn() {
     this.sendMessage({
       type: messageType.LOGGED_IN,
     });
   }
 
+  /**
+   * Sends a message indicating that the user has logged out.
+   */
   userLoggedOut() {
     this.sendMessage({
       type: messageType.LOGGED_OUT,
     });
   }
 
-  incomingCall(callDetails) {
+  /**
+   * Event when incoming call is received.
+   *
+   * @param {OnIncomingCall} callInfo
+   */
+  incomingCall(callInfo) {
     this.sendMessage({
       type: messageType.INCOMING_CALL,
-      data: callDetails,
+      data: callInfo,
     });
   }
 
-  outgoingCall(callDetails) {
+  /**
+   * Sends a message to notify HubSpot that an outgoing call has started.
+   *
+   * @param {OnOutgoingCall} callInfo
+   */
+  outgoingCall(callInfo) {
     this.sendMessage({
       type: messageType.OUTGOING_CALL_STARTED,
-      data: callDetails,
+      data: callInfo,
     });
   }
 
   /**
-   * Event when an inbound call is answered.
+   * Sends a message to notify HubSpot that a call is being answered.
    *
-   * @param {Object} data - The data object to be published.
-   * @param {number} data.externalCallId - Call ID maintained by integrator
+   * @param {OnCallAnswered} payload
    */
-  callAnswered(data) {
+  callAnswered(payload) {
     this.sendMessage({
       type: messageType.CALL_ANSWERED,
-      data,
+      data: payload,
     });
   }
 
-  navigateToRecord(data) {
+  /**
+   * Event to navigate to record page.
+   *
+   * @param {OnNavigateToRecord} payload
+   */
+  navigateToRecord(payload) {
     this.sendMessage({
       type: messageType.NAVIGATE_TO_RECORD,
-      data,
+      data: payload,
     });
   }
 
-  callData(data) {
+  /**
+   * @param {any} payload
+   */
+  callData(payload) {
     this.sendMessage({
       type: messageType.CALL_DATA,
-      data,
+      data: payload,
     });
   }
 
-  callEnded(engagementData) {
+  /**
+   * Sends a message to notify HubSpot that the call has ended.
+   *
+   * @param {OnCallEnded} data
+   */
+  callEnded(data) {
     this.sendMessage({
       type: messageType.CALL_ENDED,
-      data: engagementData,
+      data,
     });
   }
 
-  callCompleted(callCompletedData) {
+  /**
+   * Sends a message to notify HubSpot that the call has completed.
+   *
+   * @param {OnCallCompleted} data
+   */
+  callCompleted(data) {
     this.sendMessage({
       type: messageType.CALL_COMPLETED,
-      data: callCompletedData,
+      data,
     });
   }
 
-  sendError(errorData) {
+  /**
+   * Sends a message to notify HubSpot that the calling app has encountered an error.
+   * @param {OnError} data
+   */
+  sendError(data) {
     this.sendMessage({
       type: messageType.ERROR,
-      data: errorData,
+      data,
     });
   }
 
-  resizeWidget(sizeInfo) {
+  /**
+   * Sends a message to notify HubSpot that the calling app needs to be resized.
+   *
+   * @param {OnResize} data
+   */
+  resizeWidget(data) {
     this.sendMessage({
       type: messageType.RESIZE_WIDGET,
-      data: sizeInfo,
+      data,
     });
   }
 
+  /**
+   *
+   * @param {onMessage} message
+   */
   sendMessage(message) {
     this.iFrameManager.sendMessage(message);
   }
 
+  /**
+   *
+   * @param {{message: string, type: string}} param0
+   */
   logDebugMessage({ message, type = debugMessageType.GENERIC_MESSAGE }) {
     this.iFrameManager.logDebugMessage(prefix, type, message);
   }
 
+  /**
+   * @param {{ type: any; data: any; }} event
+   */
   onMessageHandler(event) {
     const { type, data } = event;
     const { eventHandlers } = this.options;
 
     let handler;
     if (type in messageHandlerNames) {
+      /** @type {keyof EventHandlers} */
       const name = messageHandlerNames[type];
       handler = eventHandlers[name];
     } else {
@@ -199,8 +244,7 @@ class CallingExtensions {
   /**
    * Publishes the call to a connected channel.
    *
-   * @param {Object} data - The data object to be published.
-   * @param {number} data.engagementId - The HubSpot engagementId created by the calling app.
+   * @param {OnPublishToChannel} data - The data object to be published.
    */
   publishToChannel(data) {
     this.sendMessage({
diff --git a/src/typedefs.js b/src/typedefs.js
new file mode 100644
index 0000000..5df77b9
--- /dev/null
+++ b/src/typedefs.js
@@ -0,0 +1,157 @@
+/* eslint-disable max-len */
+// typedefs.js
+
+/**
+ * @typedef {Object} EventHandlers
+ * @property {function} onReady - Called when HubSpot is ready to receive messages.
+ * @property {function} onDialNumber - Called when the HubSpot sends a dial number from the contact.
+ * @property {function} onEngagementCreated - Called when HubSpot creates an engagement
+ * for the call.
+ * @property {function} onVisibilityChanged - Called when the call widget's visibility changes.
+ * @property {function} onCallerIdMatchFailed - Called when the caller ID match fails.
+ * @property {function} onCallerIdMatchSucceeded - Called when the caller ID match succeeds.
+ * @property {function} onCreateEngagementFailed - Called when creating an engagement fails.
+ * @property {function} onCreateEngagementSucceeded - Called when creating an engagement succeeds.
+ * @property {function} onNavigateToRecordFailed - Called when navigating to a record fails.
+ * @property {function} onPublishToChannelFailed - Called when publishing to a channel fails.
+ * @property {function} onPublishToChannelSucceeded - Called when publishing to a channel succeeds.
+ * @property {function} onSetCallState - Called when the call state changes.
+ * @property {function} onUpdateEngagementFailed - Called when updating an engagement fails.
+ * @property {function} onUpdateEngagementSucceeded - Called when updating an engagement succeeds.
+ * @property {function} onEndCall - Called when the call ends.
+ * @property {function} onInitiateCallIdSucceeded - Called when initiating a call ID succeeds.
+ * @property {function} onInitiateCallIdFailed - Called when initiating a call ID fails.
+ * @property {function} [defaultEventHandler] - Default event handler to handle unhandled events.
+ */
+
+/**
+ * @typedef {Object} IframeOptions
+ * @property {string} src - iframe URL
+ * @property {string} height - Height of iframe
+ * @property {string} width - Width of iframe
+ * @property {string} hostElementSelector - Selector for host element where iframe will be bound
+ */
+
+/**
+ * @typedef {Object} Options
+ * @property {IframeOptions} iFrameOptions - iFrame configuration options
+ * @property {boolean} debugMode - Whether to log various inbound/outbound debug messages
+ * to the console.
+ * @property {EventHandlers} eventHandlers - Event handlers handle inbound messages.
+ */
+
+/**
+ * @typedef {Object} IframeManagerOptions
+ * @property {IframeOptions} iFrameOptions - iFrame configuration options
+ * @property {boolean} debugMode - Whether to log various inbound/outbound debug messages
+ * to the console.
+ * @property {function} onMessageHandler - Callback function to handle inbound messages.
+ */
+
+/**
+ * @typedef {Object} OnResize
+ * @property {number} width
+ * @property {number} height
+ */
+
+/**
+ * @typedef {OnResize} SizeInfo
+ */
+
+/**
+ * @typedef {Object} OnInitialized
+ * @property {boolean} [isLoggedIn]
+ * @property {number} [engagementId]
+ */
+
+/**
+ * @typedef {Object} OnIncomingCall
+ * @property {number} externalCallId
+ * @property {number} [callStartTime]
+ * @property {boolean} [createEngagement]
+ * @property {string} fromNumber
+ * @property {string} toNumber
+ */
+
+/**
+ * @typedef {Object} OnOutgoingCall
+ * @property {number} externalCallId
+ * @property {number} [callStartTime]
+ * @property {boolean} [createEngagement]
+ * @property {string} [fromNumber]
+ * @property {string} [toNumber]
+ */
+
+/**
+ * @typedef {Object} OnCallAnswered
+ * @property {number} externalCallId
+ */
+
+/**
+ * @typedef {Object} OnPublishToChannel
+ * @property {number} externalCallId
+ * @property {number} engagementId
+ */
+
+/**
+ * @typedef {'COMPLETED'|'FAILED'|'CANCELED'|'BUSY'|'NO_ANSWER'|'REJECTED'|'MISSED'} EndStatus
+ */
+
+/**
+ * @typedef {Object} OnCallEnded
+ * @property {number} externalCallId
+ * @property {number} engagementId
+ * @property {EndStatus} [callEndStatus]
+ */
+
+/**
+ * @typedef {Object} RawEngagementProperties
+ * @property {number|string} hs_timestamp - This field marks the call's time of creation and determines where the call sits on the record timeline.
+ * @property {string} [hs_call_body] - The description of the call, including any notes that you want to add.
+ * @property {string} [hs_call_callee_object_id] - The ID of the HubSpot record associated with the call. This will be the recipient of the call for OUTBOUND calls, or the dialer of the call for INBOUND calls.
+ * @property {string} [hs_call_callee_object_type] - The type of the object to which the call's associated record belongs (e.g., specifies if the record is a contact or company). This will be the object of the recipient for OUTBOUNDcalls, or the object of the dialer for INBOUND calls.
+ * @property {string} [hs_call_direction] - The direction of the call from the perspective of the HubSpot user. If the user is the call recipient, the direction should be set to INBOUND. If the user initiated the call, the direction should be set to OUTBOUND.
+ * @property {string} [hs_call_disposition]
+ * @property {string} [hs_call_duration] - The duration of the call in milliseconds.
+ * @property {string} [hs_call_from_number] - The phone number that the call was made from.
+ * @property {string} [hs_call_recording_url] - The URL that stores the call recording. URLS to .mp3 or .wav files can be played back on CRM records. Only HTTPS,  secure URLs will be accepted.
+ * @property {string} [hs_call_status] - The status of the call. The statuses are BUSY, CALLING_CRM_USER, CANCELED, COMPLETED, CONNECTING, FAILED, IN_PROGRESS, NO_ANSWER, QUEUED, and RINGING.
+ * @property {string} [hs_call_title] - The title of the call.
+ * @property {string} [hs_call_source] - The source of the call. This is not required, but it is required to leverage the recording and transcriptions pipeline. If the property is set, it must be set to INTEGRATIONS_PLATFORM.
+ * @property {string} [hs_call_to_number] - The phone number that received the call.
+ * @property {string} [hubspot_owner_id] - The ID of the owner associated with the call. This field determines the user listed as the call creator on the record timeline.
+ * @property {string} [hs_activity_type] - The type of call. The options are based on the call types set in your HubSpot account.
+ * @property {string} [hs_attachment_ids] - The IDs of the call's attachments. Multiple attachment IDs are separated by a semi-colon.
+ */
+
+/**
+ * @typedef {Object} OnCallCompleted
+ * @property {number} externalCallId
+ * @property {number|string} [engagementId]
+ * @property {boolean} [hideWidget]
+ * @property {RawEngagementProperties} [engagementProperties]
+ */
+
+/**
+ * @typedef {Object} ObjectCoordinates
+ * @property {number} portalId
+ * @property {number} objectId
+ * @property {"0-1"|"0-2"} objectTypeId
+ */
+
+/**
+ * @typedef {Object} OnNavigateToRecord
+ * @property {number} [engagementId]
+ * @property {ObjectCoordinates} ObjectCoordinates
+ */
+
+/**
+ * @typedef {Object} OnError
+ * @property {string} message
+ */
+
+/**
+ * @typedef {Object} onMessage
+ * @property {string} type
+ * @property {Object} [data]
+ */

From 8634f0131e434cfa8f7471a82fdea2ed9c4c87b5 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 14:06:25 -0400
Subject: [PATCH 02/22] create d.ts files for distribution & fix types

---
 package-lock.json    | 283 +++++++++++++++++++++++++------------------
 package.json         |   4 +-
 src/Constants.js     |   4 +
 src/IFrameManager.js | 106 +++++++++++-----
 tsconfig.json        |  16 +++
 webpack.config.js    |  16 ++-
 6 files changed, 282 insertions(+), 147 deletions(-)
 create mode 100644 tsconfig.json

diff --git a/package-lock.json b/package-lock.json
index bb41443..15d2747 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -25,7 +25,8 @@
         "jasmine-browser-runner": "^1.3.0",
         "jasmine-core": "^4.6.0",
         "prettier": "^2.8.8",
-        "typescript": "^5.0.4",
+        "ts-loader": "^9.5.1",
+        "typescript": "^5.5.4",
         "webpack": "^5.77.0",
         "webpack-cli": "^5.0.1"
       },
@@ -128,9 +129,9 @@
       }
     },
     "node_modules/@babel/core/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -210,9 +211,9 @@
       }
     },
     "node_modules/@babel/helper-compilation-targets/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -274,9 +275,9 @@
       }
     },
     "node_modules/@babel/helper-define-polyfill-provider/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -1615,9 +1616,9 @@
       }
     },
     "node_modules/@babel/preset-env/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -1999,26 +2000,11 @@
         }
       }
     },
-    "node_modules/@typescript-eslint/eslint-plugin/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/@typescript-eslint/eslint-plugin/node_modules/semver": {
-      "version": "7.5.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.1.tgz",
-      "integrity": "sha512-Wvss5ivl8TMRZXXESstBA4uR5iXgEN/VC5/sOcuXdVLzcdkz4HWetIoRfG5gb5X+ij/G9rw9YoGn3QoQ8OCSpw==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -2026,12 +2012,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/@typescript-eslint/eslint-plugin/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/@typescript-eslint/parser": {
       "version": "5.59.7",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.59.7.tgz",
@@ -2143,26 +2123,11 @@
         }
       }
     },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
-      "version": "7.5.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.1.tgz",
-      "integrity": "sha512-Wvss5ivl8TMRZXXESstBA4uR5iXgEN/VC5/sOcuXdVLzcdkz4HWetIoRfG5gb5X+ij/G9rw9YoGn3QoQ8OCSpw==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -2170,12 +2135,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/@typescript-eslint/utils": {
       "version": "5.59.7",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-5.59.7.tgz",
@@ -2202,26 +2161,11 @@
         "eslint": "^6.0.0 || ^7.0.0 || ^8.0.0"
       }
     },
-    "node_modules/@typescript-eslint/utils/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/@typescript-eslint/utils/node_modules/semver": {
-      "version": "7.5.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.1.tgz",
-      "integrity": "sha512-Wvss5ivl8TMRZXXESstBA4uR5iXgEN/VC5/sOcuXdVLzcdkz4HWetIoRfG5gb5X+ij/G9rw9YoGn3QoQ8OCSpw==",
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
       "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -2229,12 +2173,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/@typescript-eslint/utils/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/@typescript-eslint/visitor-keys": {
       "version": "5.59.7",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-5.59.7.tgz",
@@ -2745,9 +2683,9 @@
       }
     },
     "node_modules/babel-loader/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -2768,9 +2706,9 @@
       }
     },
     "node_modules/babel-plugin-polyfill-corejs2/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -3609,9 +3547,9 @@
       }
     },
     "node_modules/eslint-config-airbnb-base/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -3714,9 +3652,9 @@
       }
     },
     "node_modules/eslint-plugin-import/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -3753,9 +3691,9 @@
       }
     },
     "node_modules/eslint-plugin-jsx-a11y/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -3841,9 +3779,9 @@
       }
     },
     "node_modules/eslint-plugin-react/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -4393,9 +4331,9 @@
       }
     },
     "node_modules/find-cache-dir/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -5635,12 +5573,12 @@
       }
     },
     "node_modules/micromatch": {
-      "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz",
-      "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==",
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
       "dev": true,
       "dependencies": {
-        "braces": "^3.0.2",
+        "braces": "^3.0.3",
         "picomatch": "^2.3.1"
       },
       "engines": {
@@ -6505,9 +6443,9 @@
       }
     },
     "node_modules/semver": {
-      "version": "5.7.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
-      "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+      "version": "5.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
       "dev": true,
       "bin": {
         "semver": "bin/semver"
@@ -6959,6 +6897,117 @@
         "node": ">=0.6"
       }
     },
+    "node_modules/ts-loader": {
+      "version": "9.5.1",
+      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-9.5.1.tgz",
+      "integrity": "sha512-rNH3sK9kGZcH9dYzC7CewQm4NtxJTjSEVRJ2DyBZR7f8/wcta+iV44UPCXc5+nzDzivKtlzV6c9P4e+oFhDLYg==",
+      "dev": true,
+      "dependencies": {
+        "chalk": "^4.1.0",
+        "enhanced-resolve": "^5.0.0",
+        "micromatch": "^4.0.0",
+        "semver": "^7.3.4",
+        "source-map": "^0.7.4"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "typescript": "*",
+        "webpack": "^5.0.0"
+      }
+    },
+    "node_modules/ts-loader/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dev": true,
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/ts-loader/node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "dev": true,
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/ts-loader/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dev": true,
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/ts-loader/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "dev": true
+    },
+    "node_modules/ts-loader/node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/ts-loader/node_modules/semver": {
+      "version": "7.6.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
+      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+      "dev": true,
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/ts-loader/node_modules/source-map": {
+      "version": "0.7.4",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.4.tgz",
+      "integrity": "sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==",
+      "dev": true,
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/ts-loader/node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "dev": true,
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/tsconfig-paths": {
       "version": "3.14.2",
       "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.2.tgz",
@@ -7056,16 +7105,16 @@
       }
     },
     "node_modules/typescript": {
-      "version": "5.0.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz",
-      "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==",
+      "version": "5.5.4",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.4.tgz",
+      "integrity": "sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==",
       "dev": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
       },
       "engines": {
-        "node": ">=12.20"
+        "node": ">=14.17"
       }
     },
     "node_modules/unbox-primitive": {
diff --git a/package.json b/package.json
index a3a1bb0..ada2b38 100644
--- a/package.json
+++ b/package.json
@@ -34,6 +34,7 @@
     "src/",
     "index.js"
   ],
+  "types": "./dist/types/index.d.ts",
   "module": "./index.js",
   "author": "",
   "license": "MIT",
@@ -57,7 +58,8 @@
     "jasmine-browser-runner": "^1.3.0",
     "jasmine-core": "^4.6.0",
     "prettier": "^2.8.8",
-    "typescript": "^5.0.4",
+    "ts-loader": "^9.5.1",
+    "typescript": "^5.5.4",
     "webpack": "^5.77.0",
     "webpack-cli": "^5.0.1"
   }
diff --git a/src/Constants.js b/src/Constants.js
index 4756563..c91ab3f 100644
--- a/src/Constants.js
+++ b/src/Constants.js
@@ -1,6 +1,7 @@
 "use es6";
 
 import packageJson from "../package.json";
+import "./typedefs";
 
 export const VERSION = packageJson.version;
 
@@ -59,6 +60,9 @@ export const messageType = {
   UNLOADING: "UNLOADING",
 };
 
+/**
+ * @type {{ [key: string]: keyof EventHandlers }}
+ */
 export const messageHandlerNames = {
   [messageType.CALLER_ID_MATCH_FAILED]: "onCallerIdMatchFailed",
   [messageType.CALLER_ID_MATCH_SUCCEEDED]: "onCallerIdMatchSucceeded",
diff --git a/src/IFrameManager.js b/src/IFrameManager.js
index fc63be7..27b1f5f 100644
--- a/src/IFrameManager.js
+++ b/src/IFrameManager.js
@@ -1,6 +1,9 @@
+// @ts-check
+
 "use es6";
 
 import { messageType, debugMessageType, VERSION } from "./Constants";
+import "./typedefs";
 
 const prefix = `[calling-extensions-sdk@${VERSION}]`;
 /*
@@ -9,7 +12,12 @@ const prefix = `[calling-extensions-sdk@${VERSION}]`;
  * the options.
  */
 class IFrameManager {
+  /**
+   *
+   * @param {IframeManagerOptions} options
+   */
   constructor(options) {
+    /** @type {IframeManagerOptions | null} */
     this.options = options;
     const { iFrameOptions, onMessageHandler, debugMode } = options;
 
@@ -21,39 +29,50 @@ class IFrameManager {
     this.debugMode = debugMode;
 
     // Keeps track of all the callbacks
+    /** @type {{ [key: string]: Function }} */
     this.callbacks = {};
 
     this.instanceId = Date.now();
     this.instanceRegexp = new RegExp(`^${this.instanceId}`);
     this.isReady = false;
 
-    this.messageHandler = event => this.onMessage(event);
+    this.messageHandler = (/** @type {any} */ event) => this.onMessage(event);
     window.addEventListener("message", this.messageHandler);
 
     if (iFrameOptions) {
-      this.iFrame = IFrameManager.createIFrame(iFrameOptions, () => {
-        this.firstSyncSent = Date.now();
-        this.isReady = false;
-        this.sendSync();
-      });
+      /** @type {HTMLIFrameElement | null} */
+      this.iFrame = IFrameManager.createIFrame(
+        iFrameOptions,
+        () => {
+          this.firstSyncSent = Date.now();
+          this.isReady = false;
+          this.sendSync();
+        },
+        this.handleLoadError,
+      );
+    } else {
+      /** @type {HTMLIFrameElement | null} */
+      this.iFrame = null;
     }
 
-    this.destinationWindow = iFrameOptions
-      ? this.iFrame.contentWindow
-      : window.parent;
+    this.destinationWindow =
+      iFrameOptions && this.iFrame ? this.iFrame.contentWindow : window.parent;
 
     this.destinationHost = IFrameManager.getDestinationHost(iFrameOptions);
   }
 
-  /*
+  /**
    * Creates a new message id
+   * @param {string|number} instanceId
+   * @returns {string}
    */
   static createMessageId(instanceId) {
     return `${instanceId}_${Date.now()}`;
   }
 
-  /*
+  /**
    * Gets the html element that hosts the iFrame
+   * @param {string} hostElementSelector
    */
   static getHostElement(hostElementSelector) {
     const hostElement = document.querySelector(hostElementSelector);
@@ -65,18 +84,38 @@ class IFrameManager {
     return hostElement;
   }
 
+  /**
+   * @param {string} url
+   */
   static extractHostFromUrl(url) {
     const a = document.createElement("a");
     a.href = url;
     return `${a.protocol}//${a.host}`;
   }
 
+  /**
+   *
+   * @param {IframeOptions} iFrameOptions
+   */
   static getDestinationHost(iFrameOptions) {
     const url = iFrameOptions ? iFrameOptions.src : document.referrer;
     return IFrameManager.extractHostFromUrl(url);
   }
 
-  static createIFrame(iFrameOptions, onLoadCallback) {
+  handleLoadError() {
+    this.onMessageHandler({
+      type: messageType.SYNC_ACK_FAILED,
+    });
+  }
+
+  /**
+   * @param {IframeOptions} iFrameOptions
+   * @param { (this: GlobalEventHandlers, ev: Event) => any } onLoadCallback
+   * @param { OnErrorEventHandler } onLoadErrorCallback
+   * @returns {HTMLIFrameElement | null}
+   */
+  static createIFrame(iFrameOptions, onLoadCallback, onLoadErrorCallback) {
+    // eslint-disable-next-line object-curly-newline
     const { src, width, height, hostElementSelector } = iFrameOptions;
 
     if (!src || !width || !height || !hostElementSelector) {
@@ -85,9 +124,10 @@ class IFrameManager {
       );
     }
 
-    const iFrame = document.createElement("iFrame");
+    /** @type {HTMLIFrameElement} */
+    const iFrame = document.createElement("iframe");
     iFrame.onload = onLoadCallback;
-    iFrame.onerror = this.handleLoadError;
+    iFrame.onerror = onLoadErrorCallback;
     iFrame.src = src;
     iFrame.width = width;
     iFrame.height = height;
@@ -98,22 +138,21 @@ class IFrameManager {
     element.innerHTML = "";
     element.appendChild(iFrame);
 
-    return element.querySelector("iFrame");
-  }
-
-  handleLoadError() {
-    this.onMessageHandler({
-      type: messageType.SYNC_ACK_FAILED,
-    });
+    return element.querySelector("iframe");
   }
 
+  /**
+   * @param {SizeInfo} sizeInfo
+   */
   updateIFrameSize(sizeInfo) {
     const { width, height } = sizeInfo;
-    const formatSize = size => (typeof size === "number" ? `${size}px` : size);
-    if (width) {
+    const formatSize = (/** @type {number} */ size) => {
+      return typeof size === "number" ? `${size}px` : size;
+    };
+    if (width && this.iFrame) {
       this.iFrame.setAttribute("width", formatSize(width));
     }
-    if (height) {
+    if (height && this.iFrame) {
       this.iFrame.setAttribute("height", formatSize(height));
     }
   }
@@ -132,7 +171,7 @@ class IFrameManager {
   remove() {
     window.removeEventListener("message", this.messageHandler);
 
-    if (this.iFrame) {
+    if (this.iFrame && this.options) {
       const element = IFrameManager.getHostElement(
         this.options.iFrameOptions.hostElementSelector,
       );
@@ -144,8 +183,10 @@ class IFrameManager {
     }
   }
 
-  /*
+  /**
    * Send a message to the destination window.
+   * @param {{type: string, messageId?: string|number, hostUrl?: string}} message
+   * @param {function} [callback]
    */
   sendMessage(message, callback) {
     const { type } = message;
@@ -174,11 +215,17 @@ class IFrameManager {
     });
 
     this.logDebugMessage(prefix, debugMessageType.TO_HUBSPOT, type, message);
-    this.destinationWindow.postMessage(newMessage, this.destinationHost);
+    if (this.destinationWindow) {
+      this.destinationWindow.postMessage(newMessage, this.destinationHost);
+    }
   }
 
+  /**
+   * @param {{ data: any; origin?: any; }} event
+   */
   onMessage(event) {
     const { data, origin } = event;
+    // eslint-disable-next-line object-curly-newline
     const { type, engagementId, portalId, userId, ownerId } = event.data;
     if (type === messageType.SYNC) {
       // The iFrame host can send this message multiple times, don't respond more than once
@@ -252,7 +299,7 @@ class IFrameManager {
         type: messageType.SYNC,
         hostUrl: IFrameManager.extractHostFromUrl(window.location.href),
       },
-      eventData => {
+      (/** @type {{ debugMode?: any; iFrameUrl?: any; }} */ eventData) => {
         const { iFrameUrl } = eventData;
         this.destinationHost = iFrameUrl || this.destinationHost;
         this.onReady();
@@ -269,6 +316,9 @@ class IFrameManager {
     }, 100);
   }
 
+  /**
+   * @param {any[]} args
+   */
   logDebugMessage(...args) {
     if (this.debugMode) {
       console.log.call(null, args);
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 0000000..0c6d55b
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,16 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "declaration": true,
+    "declarationDir": "./dist/types",
+    "outDir": "./dist",
+    "strict": true,
+    "allowJs": true,
+    "checkJs": true,
+    "resolveJsonModule": true,
+    "esModuleInterop": true
+  },
+  "include": ["./src/**/*"],
+  "exclude": ["node_modules"]
+}
diff --git a/webpack.config.js b/webpack.config.js
index a5c5abd..ea27618 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -11,6 +11,17 @@ const babelLoader = {
   },
 };
 
+const tsLoader = {
+  test: /\.js$/,
+  exclude: /(node_modules)/,
+  use: {
+    loader: "ts-loader",
+    options: {
+      allowTsInNodeModules: true,
+    },
+  },
+};
+
 module.exports = {
   entry: "./index.js",
   mode: "production",
@@ -20,7 +31,10 @@ module.exports = {
     path: path.resolve(__dirname, "dist"),
     clean: true,
   },
+  resolve: {
+    extensions: [".ts", ".js"],
+  },
   module: {
-    rules: [babelLoader],
+    rules: [babelLoader, tsLoader],
   },
 };

From cb0242dd86d16148f1149c9bb1f0f524c315504f Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 14:09:24 -0400
Subject: [PATCH 03/22] fix iframemanager test

---
 test/spec/IFrameManager-test.js | 27 ++++++++++++++++++---------
 1 file changed, 18 insertions(+), 9 deletions(-)

diff --git a/test/spec/IFrameManager-test.js b/test/spec/IFrameManager-test.js
index 0fb1615..3aa0ce0 100644
--- a/test/spec/IFrameManager-test.js
+++ b/test/spec/IFrameManager-test.js
@@ -68,8 +68,10 @@ describe("iFrameManager", () => {
       },
     };
 
-    it("should get origin",  done => {
-      spyOn(IFrameManager, "createIFrame").and.returnValue({ contentWindow: null });
+    it("should get origin", done => {
+      spyOn(IFrameManager, "createIFrame").and.returnValue({
+        contentWindow: null,
+      });
       const instance = createInstance(options);
       expect(instance).toBeDefined();
 
@@ -78,16 +80,23 @@ describe("iFrameManager", () => {
     });
 
     it("should create an iFrame with options", () => {
-      const createIFrameSpy = spyOn(IFrameManager, "createIFrame").and.returnValue({ contentWindow: null });
+      const createIFrameSpy = spyOn(
+        IFrameManager,
+        "createIFrame",
+      ).and.returnValue({ contentWindow: null });
       const instance = createInstance(options);
       expect(instance).toBeDefined();
 
-      expect(createIFrameSpy).toHaveBeenCalledWith(jasmine.objectContaining({
-        hostElementSelector: "body",
-        src: "https://a.b.c.d.e.f.c",
-        width: "100px",
-        height: "100px",
-      }), jasmine.any(Function));
+      expect(createIFrameSpy).toHaveBeenCalledWith(
+        jasmine.objectContaining({
+          hostElementSelector: "body",
+          src: "https://a.b.c.d.e.f.c",
+          width: "100px",
+          height: "100px",
+        }),
+        jasmine.any(Function),
+        jasmine.any(Function),
+      );
     });
   });
 });

From 55b47b6a332eb3ad4b70c652105888dab48eb223 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 14:13:31 -0400
Subject: [PATCH 04/22] 0.6.4-alpha.1

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 15d2747..6ebc327 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.0",
+  "version": "0.6.4-alpha.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.4-alpha.0",
+      "version": "0.6.4-alpha.1",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index ada2b38..24bb3f2 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.0",
+  "version": "0.6.4-alpha.1",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"

From 7a79169253b77fe7aa44f5549b62a26a15de111c Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 14:32:03 -0400
Subject: [PATCH 05/22] include typedefs in package

---
 package.json  | 3 ++-
 tsconfig.json | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index 24bb3f2..622d1df 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,8 @@
   "files": [
     "dist/",
     "src/",
-    "index.js"
+    "index.js",
+    "typedefs.js"
   ],
   "types": "./dist/types/index.d.ts",
   "module": "./index.js",
diff --git a/tsconfig.json b/tsconfig.json
index 0c6d55b..8e1b21b 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -11,6 +11,6 @@
     "resolveJsonModule": true,
     "esModuleInterop": true
   },
-  "include": ["./src/**/*"],
+  "include": ["./src/**/*", "typedefs.js"],
   "exclude": ["node_modules"]
 }

From d84aa342b6dc8097149b90d218ce20ac8bdbc618 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 14:32:13 -0400
Subject: [PATCH 06/22] 0.6.4-alpha.2

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6ebc327..2d72abc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.1",
+  "version": "0.6.4-alpha.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.4-alpha.1",
+      "version": "0.6.4-alpha.2",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index 622d1df..21b85cb 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.1",
+  "version": "0.6.4-alpha.2",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"

From 5a30d1c606d6a6ce8c986f2997ebd9e2ff56c250 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 14:49:32 -0400
Subject: [PATCH 07/22] revert include

---
 package.json  | 3 +--
 tsconfig.json | 2 +-
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 21b85cb..42d23fd 100644
--- a/package.json
+++ b/package.json
@@ -32,8 +32,7 @@
   "files": [
     "dist/",
     "src/",
-    "index.js",
-    "typedefs.js"
+    "index.js"
   ],
   "types": "./dist/types/index.d.ts",
   "module": "./index.js",
diff --git a/tsconfig.json b/tsconfig.json
index 8e1b21b..0c6d55b 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -11,6 +11,6 @@
     "resolveJsonModule": true,
     "esModuleInterop": true
   },
-  "include": ["./src/**/*", "typedefs.js"],
+  "include": ["./src/**/*"],
   "exclude": ["node_modules"]
 }

From 43cb9f96298785af3ce391802ec045718ef9f748 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 14:49:51 -0400
Subject: [PATCH 08/22] 0.6.4-alpha.3

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 2d72abc..2706bce 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.2",
+  "version": "0.6.4-alpha.3",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.4-alpha.2",
+      "version": "0.6.4-alpha.3",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index 42d23fd..9e38ab8 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.2",
+  "version": "0.6.4-alpha.3",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"

From 92cbb07df41a1f423aa6de975b79e6a464f97ad8 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 15:02:34 -0400
Subject: [PATCH 09/22] 0.6.4-alpha.4

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 2706bce..0b22213 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.3",
+  "version": "0.6.4-alpha.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.4-alpha.3",
+      "version": "0.6.4-alpha.4",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index 9e38ab8..b05e362 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.3",
+  "version": "0.6.4-alpha.4",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"

From 8c98ab5defd85d8e87cc594c7a68379a30f71b2f Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 15:30:01 -0400
Subject: [PATCH 10/22] export typedefs

---
 demos/demo-react-ts/package-lock.json | 36 ++++++++++++++++-----------
 demos/demo-react-ts/package.json      |  2 +-
 package.json                          |  5 ++--
 src/CallingExtensions.js              | 28 ++++++++++-----------
 src/Constants.js                      |  3 +--
 src/IFrameManager.js                  | 11 ++++----
 src/typedefs.js                       |  5 ++++
 tsconfig.json                         |  2 +-
 8 files changed, 50 insertions(+), 42 deletions(-)

diff --git a/demos/demo-react-ts/package-lock.json b/demos/demo-react-ts/package-lock.json
index ba2f015..720ddee 100644
--- a/demos/demo-react-ts/package-lock.json
+++ b/demos/demo-react-ts/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.0.0",
       "license": "MIT",
       "dependencies": {
-        "@hubspot/calling-extensions-sdk": "^0.6.3",
+        "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.4",
         "react": "^18.2.0",
         "react-aria": "^3.22.0",
         "react-dom": "^18.2.0",
@@ -1859,9 +1859,9 @@
       }
     },
     "node_modules/@hubspot/calling-extensions-sdk": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.3.tgz",
-      "integrity": "sha512-3HaIVj/ATJ8RjN5H+VfY/DU7kNm0DCaNU80AEGcdn3/hseIucH5fOlU42EHy/TaW2rFZJHr/OUiBNMf4E6AbwA==",
+      "version": "0.6.4-alpha.4",
+      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.4.tgz",
+      "integrity": "sha512-kxSdmKPoKEh+JNEiWA4FHaef+4aoGeuI38ahSH/aetE8jUDsNX/eacEwFJrliihFoL+PNaoE70iHOgbJbmx+8Q==",
       "engines": {
         "node": ">=14"
       }
@@ -6660,11 +6660,12 @@
       }
     },
     "node_modules/micromatch": {
-      "version": "4.0.5",
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
-        "braces": "^3.0.2",
+        "braces": "^3.0.3",
         "picomatch": "^2.3.1"
       },
       "engines": {
@@ -7617,9 +7618,10 @@
       }
     },
     "node_modules/semver": {
-      "version": "6.3.0",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
-      "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
       }
@@ -9837,9 +9839,9 @@
       }
     },
     "@hubspot/calling-extensions-sdk": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.3.tgz",
-      "integrity": "sha512-3HaIVj/ATJ8RjN5H+VfY/DU7kNm0DCaNU80AEGcdn3/hseIucH5fOlU42EHy/TaW2rFZJHr/OUiBNMf4E6AbwA=="
+      "version": "0.6.4-alpha.4",
+      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.4.tgz",
+      "integrity": "sha512-kxSdmKPoKEh+JNEiWA4FHaef+4aoGeuI38ahSH/aetE8jUDsNX/eacEwFJrliihFoL+PNaoE70iHOgbJbmx+8Q=="
     },
     "@internationalized/date": {
       "version": "3.1.0",
@@ -13063,10 +13065,12 @@
       "dev": true
     },
     "micromatch": {
-      "version": "4.0.5",
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
       "dev": true,
       "requires": {
-        "braces": "^3.0.2",
+        "braces": "^3.0.3",
         "picomatch": "^2.3.1"
       }
     },
@@ -13688,7 +13692,9 @@
       }
     },
     "semver": {
-      "version": "6.3.0",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true
     },
     "send": {
diff --git a/demos/demo-react-ts/package.json b/demos/demo-react-ts/package.json
index 10b6d57..31515e2 100644
--- a/demos/demo-react-ts/package.json
+++ b/demos/demo-react-ts/package.json
@@ -18,7 +18,7 @@
     "node": ">=14"
   },
   "dependencies": {
-    "@hubspot/calling-extensions-sdk": "^0.6.3",
+    "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.4",
     "react": "^18.2.0",
     "react-aria": "^3.22.0",
     "react-dom": "^18.2.0",
diff --git a/package.json b/package.json
index b05e362..0c6d6a4 100644
--- a/package.json
+++ b/package.json
@@ -30,9 +30,10 @@
   },
   "main": "./dist/main.js",
   "files": [
-    "dist/",
+    "dist/**/*",
     "src/",
-    "index.js"
+    "index.js",
+    "src/typedefs.js"
   ],
   "types": "./dist/types/index.d.ts",
   "module": "./index.js",
diff --git a/src/CallingExtensions.js b/src/CallingExtensions.js
index b6560be..734f5e9 100644
--- a/src/CallingExtensions.js
+++ b/src/CallingExtensions.js
@@ -10,7 +10,6 @@ import {
   VERSION,
   messageHandlerNames,
 } from "./Constants";
-import "./typedefs";
 
 const prefix = `[calling-extensions-sdk@${VERSION}]`;
 
@@ -19,7 +18,7 @@ const prefix = `[calling-extensions-sdk@${VERSION}]`;
  */
 class CallingExtensions {
   /**
-   * @param {Options} options
+   * @param {import('./typedefs').Options} options
    */
   constructor(options) {
     if (!options || !options.eventHandlers) {
@@ -40,7 +39,7 @@ class CallingExtensions {
   /**
    * Send a message indicating that the soft phone is ready for interaction.
    *
-   * @param {OnInitialized} payload
+   * @param {import('./typedefs').OnInitialized} payload
    */
   initialized(payload) {
     this.sendMessage({
@@ -88,7 +87,7 @@ class CallingExtensions {
   /**
    * Event when incoming call is received.
    *
-   * @param {OnIncomingCall} callInfo
+   * @param {import('./typedefs').OnIncomingCall} callInfo
    */
   incomingCall(callInfo) {
     this.sendMessage({
@@ -100,7 +99,7 @@ class CallingExtensions {
   /**
    * Sends a message to notify HubSpot that an outgoing call has started.
    *
-   * @param {OnOutgoingCall} callInfo
+   * @param {import('./typedefs').OnOutgoingCall} callInfo
    */
   outgoingCall(callInfo) {
     this.sendMessage({
@@ -112,7 +111,7 @@ class CallingExtensions {
   /**
    * Sends a message to notify HubSpot that a call is being answered.
    *
-   * @param {OnCallAnswered} payload
+   * @param {import('./typedefs').OnCallAnswered} payload
    */
   callAnswered(payload) {
     this.sendMessage({
@@ -124,7 +123,7 @@ class CallingExtensions {
   /**
    * Event to navigate to record page.
    *
-   * @param {OnNavigateToRecord} payload
+   * @param {import('./typedefs').OnNavigateToRecord} payload
    */
   navigateToRecord(payload) {
     this.sendMessage({
@@ -146,7 +145,7 @@ class CallingExtensions {
   /**
    * Sends a message to notify HubSpot that the call has ended.
    *
-   * @param {OnCallEnded} data
+   * @param {import('./typedefs').OnCallEnded} data
    */
   callEnded(data) {
     this.sendMessage({
@@ -158,7 +157,7 @@ class CallingExtensions {
   /**
    * Sends a message to notify HubSpot that the call has completed.
    *
-   * @param {OnCallCompleted} data
+   * @param {import('./typedefs').OnCallCompleted} data
    */
   callCompleted(data) {
     this.sendMessage({
@@ -169,7 +168,7 @@ class CallingExtensions {
 
   /**
    * Sends a message to notify HubSpot that the calling app has encountered an error.
-   * @param {OnError} data
+   * @param {import('./typedefs').OnError} data
    */
   sendError(data) {
     this.sendMessage({
@@ -181,7 +180,7 @@ class CallingExtensions {
   /**
    * Sends a message to notify HubSpot that the calling app needs to be resized.
    *
-   * @param {OnResize} data
+   * @param {import('./typedefs').OnResize} data
    */
   resizeWidget(data) {
     this.sendMessage({
@@ -192,7 +191,7 @@ class CallingExtensions {
 
   /**
    *
-   * @param {onMessage} message
+   * @param {import('./typedefs').onMessage} message
    */
   sendMessage(message) {
     this.iFrameManager.sendMessage(message);
@@ -207,7 +206,7 @@ class CallingExtensions {
   }
 
   /**
-   * @param {{ type: any; data: any; }} event
+   * @param {{ type: keyof import('./typedefs').EventHandlers; data: any; }} event
    */
   onMessageHandler(event) {
     const { type, data } = event;
@@ -215,7 +214,6 @@ class CallingExtensions {
 
     let handler;
     if (type in messageHandlerNames) {
-      /** @type {keyof EventHandlers} */
       const name = messageHandlerNames[type];
       handler = eventHandlers[name];
     } else {
@@ -244,7 +242,7 @@ class CallingExtensions {
   /**
    * Publishes the call to a connected channel.
    *
-   * @param {OnPublishToChannel} data - The data object to be published.
+   * @param {import('./typedefs').OnPublishToChannel} data - The data object to be published.
    */
   publishToChannel(data) {
     this.sendMessage({
diff --git a/src/Constants.js b/src/Constants.js
index c91ab3f..d1074d3 100644
--- a/src/Constants.js
+++ b/src/Constants.js
@@ -1,7 +1,6 @@
 "use es6";
 
 import packageJson from "../package.json";
-import "./typedefs";
 
 export const VERSION = packageJson.version;
 
@@ -61,7 +60,7 @@ export const messageType = {
 };
 
 /**
- * @type {{ [key: string]: keyof EventHandlers }}
+ * @type {{ [key: string]: keyof import('./typedefs').EventHandlers }}
  */
 export const messageHandlerNames = {
   [messageType.CALLER_ID_MATCH_FAILED]: "onCallerIdMatchFailed",
diff --git a/src/IFrameManager.js b/src/IFrameManager.js
index 27b1f5f..221730e 100644
--- a/src/IFrameManager.js
+++ b/src/IFrameManager.js
@@ -3,7 +3,6 @@
 "use es6";
 
 import { messageType, debugMessageType, VERSION } from "./Constants";
-import "./typedefs";
 
 const prefix = `[calling-extensions-sdk@${VERSION}]`;
 /*
@@ -14,10 +13,10 @@ const prefix = `[calling-extensions-sdk@${VERSION}]`;
 class IFrameManager {
   /**
    *
-   * @param {IframeManagerOptions} options
+   * @param {import('./typedefs').IframeManagerOptions} options
    */
   constructor(options) {
-    /** @type {IframeManagerOptions | null} */
+    /** @type {import('./typedefs').IframeManagerOptions | null} */
     this.options = options;
     const { iFrameOptions, onMessageHandler, debugMode } = options;
 
@@ -95,7 +94,7 @@ class IFrameManager {
 
   /**
    *
-   * @param {IframeOptions} iFrameOptions
+   * @param {import('./typedefs').IframeOptions} iFrameOptions
    */
   static getDestinationHost(iFrameOptions) {
     const url = iFrameOptions ? iFrameOptions.src : document.referrer;
@@ -109,7 +108,7 @@ class IFrameManager {
   }
 
   /**
-   * @param {IframeOptions} iFrameOptions
+   * @param {import('./typedefs').IframeOptions} iFrameOptions
    * @param { (this: GlobalEventHandlers, ev: Event) => any } onLoadCallback
    * @param { OnErrorEventHandler } onLoadErrorCallback
    * @returns {HTMLIFrameElement | null}
@@ -142,7 +141,7 @@ class IFrameManager {
   }
 
   /**
-   * @param {SizeInfo} sizeInfo
+   * @param {import('./typedefs').SizeInfo} sizeInfo
    */
   updateIFrameSize(sizeInfo) {
     const { width, height } = sizeInfo;
diff --git a/src/typedefs.js b/src/typedefs.js
index 5df77b9..937d3a8 100644
--- a/src/typedefs.js
+++ b/src/typedefs.js
@@ -1,5 +1,8 @@
 /* eslint-disable max-len */
 // typedefs.js
+/**
+ * @namespace typedefs
+ */
 
 /**
  * @typedef {Object} EventHandlers
@@ -155,3 +158,5 @@
  * @property {string} type
  * @property {Object} [data]
  */
+
+export {};
diff --git a/tsconfig.json b/tsconfig.json
index 0c6d55b..801ad1a 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -11,6 +11,6 @@
     "resolveJsonModule": true,
     "esModuleInterop": true
   },
-  "include": ["./src/**/*"],
+  "include": ["src/**/*", "src/typedefs.js"],
   "exclude": ["node_modules"]
 }

From 0d7a8d9fbe795835682923f1245e58752af8f7d0 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 15:30:28 -0400
Subject: [PATCH 11/22] 0.6.4-alpha.5

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 0b22213..995c2e3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.4",
+  "version": "0.6.4-alpha.5",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.4-alpha.4",
+      "version": "0.6.4-alpha.5",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index 0c6d6a4..b047f71 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.4",
+  "version": "0.6.4-alpha.5",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"

From 22fd692a232123e34e121ce5b5f87bbdbd4d3559 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 18:35:28 -0400
Subject: [PATCH 12/22] export typedefs

---
 index.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/index.js b/index.js
index b9f7080..463874c 100644
--- a/index.js
+++ b/index.js
@@ -4,3 +4,4 @@ import IFrameManager from "./src/IFrameManager";
 
 export default CallingExtensions;
 export { Constants, IFrameManager };
+export * from "./src/typedefs";

From c4ef2d17fb3ca104e06f27994027fe247cd3a53e Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 18:36:12 -0400
Subject: [PATCH 13/22] 0.6.4-alpha.6

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 995c2e3..d39be91 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.5",
+  "version": "0.6.4-alpha.6",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.4-alpha.5",
+      "version": "0.6.4-alpha.6",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index b047f71..e665e81 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.5",
+  "version": "0.6.4-alpha.6",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"

From 27ce36a8d3d15a1dc7d67d680f19f823e3531d31 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 18:53:30 -0400
Subject: [PATCH 14/22] make iframeoptions optional

---
 src/CallingExtensions.js | 2 +-
 src/IFrameManager.js     | 4 ++--
 src/typedefs.js          | 6 +++---
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/CallingExtensions.js b/src/CallingExtensions.js
index 734f5e9..d5f9142 100644
--- a/src/CallingExtensions.js
+++ b/src/CallingExtensions.js
@@ -191,7 +191,7 @@ class CallingExtensions {
 
   /**
    *
-   * @param {import('./typedefs').onMessage} message
+   * @param {import('./typedefs').OnMessage} message
    */
   sendMessage(message) {
     this.iFrameManager.sendMessage(message);
diff --git a/src/IFrameManager.js b/src/IFrameManager.js
index 221730e..0b6ebc0 100644
--- a/src/IFrameManager.js
+++ b/src/IFrameManager.js
@@ -94,7 +94,7 @@ class IFrameManager {
 
   /**
    *
-   * @param {import('./typedefs').IframeOptions} iFrameOptions
+   * @param {import('./typedefs').IframeOptions} [iFrameOptions]
    */
   static getDestinationHost(iFrameOptions) {
     const url = iFrameOptions ? iFrameOptions.src : document.referrer;
@@ -170,7 +170,7 @@ class IFrameManager {
   remove() {
     window.removeEventListener("message", this.messageHandler);
 
-    if (this.iFrame && this.options) {
+    if (this.iFrame && this.options && this.options.iFrameOptions) {
       const element = IFrameManager.getHostElement(
         this.options.iFrameOptions.hostElementSelector,
       );
diff --git a/src/typedefs.js b/src/typedefs.js
index 937d3a8..6173d16 100644
--- a/src/typedefs.js
+++ b/src/typedefs.js
@@ -37,7 +37,7 @@
 
 /**
  * @typedef {Object} Options
- * @property {IframeOptions} iFrameOptions - iFrame configuration options
+ * @property {IframeOptions} [iFrameOptions] - iFrame configuration options
  * @property {boolean} debugMode - Whether to log various inbound/outbound debug messages
  * to the console.
  * @property {EventHandlers} eventHandlers - Event handlers handle inbound messages.
@@ -45,7 +45,7 @@
 
 /**
  * @typedef {Object} IframeManagerOptions
- * @property {IframeOptions} iFrameOptions - iFrame configuration options
+ * @property {IframeOptions} [iFrameOptions] - iFrame configuration options
  * @property {boolean} debugMode - Whether to log various inbound/outbound debug messages
  * to the console.
  * @property {function} onMessageHandler - Callback function to handle inbound messages.
@@ -154,7 +154,7 @@
  */
 
 /**
- * @typedef {Object} onMessage
+ * @typedef {Object} OnMessage
  * @property {string} type
  * @property {Object} [data]
  */

From 5e91fdf625b1a1d2ae28f678a50f0f845f21d60e Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 18:54:02 -0400
Subject: [PATCH 15/22] 0.6.4-alpha.7

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index d39be91..11ebc62 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.6",
+  "version": "0.6.4-alpha.7",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.4-alpha.6",
+      "version": "0.6.4-alpha.7",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index e665e81..10dfbcb 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.6",
+  "version": "0.6.4-alpha.7",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"

From e64008e45da21ea4c374d6f6746a6a610cfe6e41 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 19:06:04 -0400
Subject: [PATCH 16/22] update typedefs

---
 package-lock.json |  4 ++--
 package.json      |  2 +-
 src/typedefs.js   | 30 +++++++++++++++++++++++-------
 3 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 11ebc62..b4dcb26 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.7",
+  "version": "0.6.4-alpha.9",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.4-alpha.7",
+      "version": "0.6.4-alpha.9",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index 10dfbcb..a9bc63f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.7",
+  "version": "0.6.4-alpha.9",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"
diff --git a/src/typedefs.js b/src/typedefs.js
index 6173d16..22fd26a 100644
--- a/src/typedefs.js
+++ b/src/typedefs.js
@@ -69,7 +69,7 @@
 
 /**
  * @typedef {Object} OnIncomingCall
- * @property {number} externalCallId
+ * @property {string} externalCallId
  * @property {number} [callStartTime]
  * @property {boolean} [createEngagement]
  * @property {string} fromNumber
@@ -78,7 +78,7 @@
 
 /**
  * @typedef {Object} OnOutgoingCall
- * @property {number} externalCallId
+ * @property {string} externalCallId
  * @property {number} [callStartTime]
  * @property {boolean} [createEngagement]
  * @property {string} [fromNumber]
@@ -87,12 +87,12 @@
 
 /**
  * @typedef {Object} OnCallAnswered
- * @property {number} externalCallId
+ * @property {string} externalCallId
  */
 
 /**
  * @typedef {Object} OnPublishToChannel
- * @property {number} externalCallId
+ * @property {string} externalCallId
  * @property {number} engagementId
  */
 
@@ -102,7 +102,7 @@
 
 /**
  * @typedef {Object} OnCallEnded
- * @property {number} externalCallId
+ * @property {string} externalCallId
  * @property {number} engagementId
  * @property {EndStatus} [callEndStatus]
  */
@@ -129,7 +129,7 @@
 
 /**
  * @typedef {Object} OnCallCompleted
- * @property {number} externalCallId
+ * @property {string} externalCallId
  * @property {number|string} [engagementId]
  * @property {boolean} [hideWidget]
  * @property {RawEngagementProperties} [engagementProperties]
@@ -145,7 +145,7 @@
 /**
  * @typedef {Object} OnNavigateToRecord
  * @property {number} [engagementId]
- * @property {ObjectCoordinates} ObjectCoordinates
+ * @property {ObjectCoordinates} objectCoordinates
  */
 
 /**
@@ -159,4 +159,20 @@
  * @property {Object} [data]
  */
 
+/**
+ * @typedef {Object} ContactIdMatch
+ * @property {"CONTACT"} callerIdType
+ * @property {ObjectCoordinates} objectCoordinates
+ * @property {string} firstName
+ * @property {string} lastName
+ * @property {string} email
+ */
+
+/**
+ * @typedef {Object} CompanyIdMatch
+ * @property {"COMPANY"} callerIdType
+ * @property {ObjectCoordinates} objectCoordinates
+ * @property {string} name
+ */
+
 export {};

From 9e55f846fb799f0189934360465e2902adef5a2c Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Mon, 9 Sep 2024 20:28:26 -0400
Subject: [PATCH 17/22] update react demo to pass in externalCallId

---
 demos/demo-react-ts/package-lock.json   | 128 ++++++++++++++-----
 demos/demo-react-ts/package.json        |   5 +-
 demos/demo-react-ts/src/hooks/useCti.ts | 156 ++++++++++++++----------
 3 files changed, 195 insertions(+), 94 deletions(-)

diff --git a/demos/demo-react-ts/package-lock.json b/demos/demo-react-ts/package-lock.json
index 720ddee..ad828be 100644
--- a/demos/demo-react-ts/package-lock.json
+++ b/demos/demo-react-ts/package-lock.json
@@ -9,11 +9,12 @@
       "version": "1.0.0",
       "license": "MIT",
       "dependencies": {
-        "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.4",
+        "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.9",
         "react": "^18.2.0",
         "react-aria": "^3.22.0",
         "react-dom": "^18.2.0",
-        "styled-components": "^5.3.6"
+        "styled-components": "^5.3.6",
+        "uuid": "^10.0.0"
       },
       "devDependencies": {
         "@babel/core": "^7.20.12",
@@ -1859,9 +1860,9 @@
       }
     },
     "node_modules/@hubspot/calling-extensions-sdk": {
-      "version": "0.6.4-alpha.4",
-      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.4.tgz",
-      "integrity": "sha512-kxSdmKPoKEh+JNEiWA4FHaef+4aoGeuI38ahSH/aetE8jUDsNX/eacEwFJrliihFoL+PNaoE70iHOgbJbmx+8Q==",
+      "version": "0.6.4-alpha.9",
+      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.9.tgz",
+      "integrity": "sha512-7ijBQn/CWOCS6LChTdVhpfPBnBJ8bu3Pz7KDU/kllGulszSST0Of1Darw3EnQaAuTE7GvvfjliEZm4xD+mNpTA==",
       "engines": {
         "node": ">=14"
       }
@@ -3838,9 +3839,10 @@
       }
     },
     "node_modules/@types/ws": {
-      "version": "8.5.4",
+      "version": "8.5.12",
+      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.12.tgz",
+      "integrity": "sha512-3tPRkv1EtkDpzlgyKyI8pGsGZAGPEaXeu0DOj5DI25Ja91bdAYddYHbADRYVrZMRbfW+1l5YwXVDKohDJNQxkQ==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "@types/node": "*"
       }
@@ -6414,9 +6416,10 @@
       }
     },
     "node_modules/jasmine-browser-runner": {
-      "version": "1.3.0",
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/jasmine-browser-runner/-/jasmine-browser-runner-1.4.0.tgz",
+      "integrity": "sha512-UOwxL7/tL5K3Ww9LUw4EFWyZCQyTflzTgRFr80Bm/22EEUqlOiDhdqhYblu3LEZ+ZZ8qfwrlBShtcc+MAwNetg==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "ejs": "^3.1.6",
         "express": "^4.16.4",
@@ -6527,6 +6530,16 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/launch-editor": {
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.9.1.tgz",
+      "integrity": "sha512-Gcnl4Bd+hRO9P9icCP/RVVT2o8SFlPXofuCxvA2SaZuH45whSvf5p8x5oih5ftLiVhEI4sp5xDY+R+b3zJBh5w==",
+      "dev": true,
+      "dependencies": {
+        "picocolors": "^1.0.0",
+        "shell-quote": "^1.8.1"
+      }
+    },
     "node_modules/lie": {
       "version": "3.3.0",
       "dev": true,
@@ -7804,6 +7817,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/shell-quote": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.1.tgz",
+      "integrity": "sha512-6j1W9l1iAs/4xYBI1SYOVZyFcCis9b4KCLQ8fgAGG07QvzaRLVVRQvAy85yNmmZSjYjg4MWh4gNvlPujU/5LpA==",
+      "dev": true,
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/side-channel": {
       "version": "1.0.4",
       "dev": true,
@@ -7832,6 +7854,15 @@
         "websocket-driver": "^0.7.4"
       }
     },
+    "node_modules/sockjs/node_modules/uuid": {
+      "version": "8.3.2",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
+      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+      "dev": true,
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/source-map": {
       "version": "0.6.1",
       "dev": true,
@@ -8307,9 +8338,13 @@
       }
     },
     "node_modules/uuid": {
-      "version": "8.3.2",
-      "dev": true,
-      "license": "MIT",
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+      "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
       "bin": {
         "uuid": "dist/bin/uuid"
       }
@@ -8465,9 +8500,10 @@
       }
     },
     "node_modules/webpack-dev-server": {
-      "version": "4.11.1",
+      "version": "4.15.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.15.2.tgz",
+      "integrity": "sha512-0XavAZbNJ5sDrCbkpWL8mia0o5WPOd2YGtxrEiZkBK9FjLppIUK2TgxK6qGD2P3hUXTJNNPVibrerKcx5WkR1g==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "@types/bonjour": "^3.5.9",
         "@types/connect-history-api-fallback": "^1.3.5",
@@ -8475,7 +8511,7 @@
         "@types/serve-index": "^1.9.1",
         "@types/serve-static": "^1.13.10",
         "@types/sockjs": "^0.3.33",
-        "@types/ws": "^8.5.1",
+        "@types/ws": "^8.5.5",
         "ansi-html-community": "^0.0.8",
         "bonjour-service": "^1.0.11",
         "chokidar": "^3.5.3",
@@ -8488,6 +8524,7 @@
         "html-entities": "^2.3.2",
         "http-proxy-middleware": "^2.0.3",
         "ipaddr.js": "^2.0.1",
+        "launch-editor": "^2.6.0",
         "open": "^8.0.9",
         "p-retry": "^4.5.0",
         "rimraf": "^3.0.2",
@@ -8496,8 +8533,8 @@
         "serve-index": "^1.9.1",
         "sockjs": "^0.3.24",
         "spdy": "^4.0.2",
-        "webpack-dev-middleware": "^5.3.1",
-        "ws": "^8.4.2"
+        "webpack-dev-middleware": "^5.3.4",
+        "ws": "^8.13.0"
       },
       "bin": {
         "webpack-dev-server": "bin/webpack-dev-server.js"
@@ -8513,6 +8550,9 @@
         "webpack": "^4.37.0 || ^5.0.0"
       },
       "peerDependenciesMeta": {
+        "webpack": {
+          "optional": true
+        },
         "webpack-cli": {
           "optional": true
         }
@@ -9839,9 +9879,9 @@
       }
     },
     "@hubspot/calling-extensions-sdk": {
-      "version": "0.6.4-alpha.4",
-      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.4.tgz",
-      "integrity": "sha512-kxSdmKPoKEh+JNEiWA4FHaef+4aoGeuI38ahSH/aetE8jUDsNX/eacEwFJrliihFoL+PNaoE70iHOgbJbmx+8Q=="
+      "version": "0.6.4-alpha.9",
+      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.9.tgz",
+      "integrity": "sha512-7ijBQn/CWOCS6LChTdVhpfPBnBJ8bu3Pz7KDU/kllGulszSST0Of1Darw3EnQaAuTE7GvvfjliEZm4xD+mNpTA=="
     },
     "@internationalized/date": {
       "version": "3.1.0",
@@ -11208,7 +11248,9 @@
       }
     },
     "@types/ws": {
-      "version": "8.5.4",
+      "version": "8.5.12",
+      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.12.tgz",
+      "integrity": "sha512-3tPRkv1EtkDpzlgyKyI8pGsGZAGPEaXeu0DOj5DI25Ja91bdAYddYHbADRYVrZMRbfW+1l5YwXVDKohDJNQxkQ==",
       "dev": true,
       "requires": {
         "@types/node": "*"
@@ -12902,7 +12944,9 @@
       }
     },
     "jasmine-browser-runner": {
-      "version": "1.3.0",
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/jasmine-browser-runner/-/jasmine-browser-runner-1.4.0.tgz",
+      "integrity": "sha512-UOwxL7/tL5K3Ww9LUw4EFWyZCQyTflzTgRFr80Bm/22EEUqlOiDhdqhYblu3LEZ+ZZ8qfwrlBShtcc+MAwNetg==",
       "dev": true,
       "requires": {
         "ejs": "^3.1.6",
@@ -12975,6 +13019,16 @@
       "version": "6.0.3",
       "dev": true
     },
+    "launch-editor": {
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.9.1.tgz",
+      "integrity": "sha512-Gcnl4Bd+hRO9P9icCP/RVVT2o8SFlPXofuCxvA2SaZuH45whSvf5p8x5oih5ftLiVhEI4sp5xDY+R+b3zJBh5w==",
+      "dev": true,
+      "requires": {
+        "picocolors": "^1.0.0",
+        "shell-quote": "^1.8.1"
+      }
+    },
     "lie": {
       "version": "3.3.0",
       "dev": true,
@@ -13835,6 +13889,12 @@
       "version": "3.0.0",
       "dev": true
     },
+    "shell-quote": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.1.tgz",
+      "integrity": "sha512-6j1W9l1iAs/4xYBI1SYOVZyFcCis9b4KCLQ8fgAGG07QvzaRLVVRQvAy85yNmmZSjYjg4MWh4gNvlPujU/5LpA==",
+      "dev": true
+    },
     "side-channel": {
       "version": "1.0.4",
       "dev": true,
@@ -13855,6 +13915,14 @@
         "faye-websocket": "^0.11.3",
         "uuid": "^8.3.2",
         "websocket-driver": "^0.7.4"
+      },
+      "dependencies": {
+        "uuid": {
+          "version": "8.3.2",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
+          "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+          "dev": true
+        }
       }
     },
     "source-map": {
@@ -14159,8 +14227,9 @@
       "dev": true
     },
     "uuid": {
-      "version": "8.3.2",
-      "dev": true
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+      "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ=="
     },
     "vary": {
       "version": "1.1.2",
@@ -14291,7 +14360,9 @@
       }
     },
     "webpack-dev-server": {
-      "version": "4.11.1",
+      "version": "4.15.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.15.2.tgz",
+      "integrity": "sha512-0XavAZbNJ5sDrCbkpWL8mia0o5WPOd2YGtxrEiZkBK9FjLppIUK2TgxK6qGD2P3hUXTJNNPVibrerKcx5WkR1g==",
       "dev": true,
       "requires": {
         "@types/bonjour": "^3.5.9",
@@ -14300,7 +14371,7 @@
         "@types/serve-index": "^1.9.1",
         "@types/serve-static": "^1.13.10",
         "@types/sockjs": "^0.3.33",
-        "@types/ws": "^8.5.1",
+        "@types/ws": "^8.5.5",
         "ansi-html-community": "^0.0.8",
         "bonjour-service": "^1.0.11",
         "chokidar": "^3.5.3",
@@ -14313,6 +14384,7 @@
         "html-entities": "^2.3.2",
         "http-proxy-middleware": "^2.0.3",
         "ipaddr.js": "^2.0.1",
+        "launch-editor": "^2.6.0",
         "open": "^8.0.9",
         "p-retry": "^4.5.0",
         "rimraf": "^3.0.2",
@@ -14321,8 +14393,8 @@
         "serve-index": "^1.9.1",
         "sockjs": "^0.3.24",
         "spdy": "^4.0.2",
-        "webpack-dev-middleware": "^5.3.1",
-        "ws": "^8.4.2"
+        "webpack-dev-middleware": "^5.3.4",
+        "ws": "^8.13.0"
       },
       "dependencies": {
         "ipaddr.js": {
diff --git a/demos/demo-react-ts/package.json b/demos/demo-react-ts/package.json
index 31515e2..f6bf98a 100644
--- a/demos/demo-react-ts/package.json
+++ b/demos/demo-react-ts/package.json
@@ -18,11 +18,12 @@
     "node": ">=14"
   },
   "dependencies": {
-    "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.4",
+    "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.9",
     "react": "^18.2.0",
     "react-aria": "^3.22.0",
     "react-dom": "^18.2.0",
-    "styled-components": "^5.3.6"
+    "styled-components": "^5.3.6",
+    "uuid": "^10.0.0"
   },
   "devDependencies": {
     "@babel/core": "^7.20.12",
diff --git a/demos/demo-react-ts/src/hooks/useCti.ts b/demos/demo-react-ts/src/hooks/useCti.ts
index 5bf6b22..9ba2b98 100644
--- a/demos/demo-react-ts/src/hooks/useCti.ts
+++ b/demos/demo-react-ts/src/hooks/useCti.ts
@@ -1,31 +1,22 @@
 /* eslint-disable import/no-relative-packages */
 import { useMemo, useState } from "react";
-// import CallingExtensions from "@hubspot/calling-extensions-sdk/src/CallingExtensions";
-// import { callStatus } from "@hubspot/calling-extensions-sdk/src/Constants";
-
-// @ts-expect-error module not typed
-import CallingExtensions from "../../../../src/CallingExtensions";
-
-// @TODO Move it to CallingExtensions and export it once migrated to typescript
-type ObjectCoordinates = {
-  portalId: number;
-  objectTypeId: string;
-  objectId: number;
-};
-
-export type ContactIdMatch = {
-  callerIdType: "CONTACT";
-  objectCoordinates: ObjectCoordinates;
-  firstName: string;
-  lastName: string;
-  email: string;
-};
-
-export type CompanyIdMatch = {
-  callerIdType: "COMPANY";
-  objectCoordinates: ObjectCoordinates;
-  name: string;
-};
+import { v4 as uuidv4 } from "uuid";
+import CallingExtensions, {
+  CompanyIdMatch,
+  ContactIdMatch,
+  OnCallAnswered,
+  OnCallCompleted,
+  OnCallEnded,
+  OnError,
+  OnIncomingCall,
+  OnInitialized,
+  OnMessage,
+  OnNavigateToRecord,
+  OnOutgoingCall,
+  OnPublishToChannel,
+  OnResize,
+  Options,
+} from "@hubspot/calling-extensions-sdk";
 
 const INCOMING_NUMBER_KEY = "LocalSettings:Calling:DemoReact:incomingNumber";
 const INCOMING_CONTACT_NAME_KEY =
@@ -33,27 +24,22 @@ const INCOMING_CONTACT_NAME_KEY =
 
 // @TODO Move it to CallingExtensions and export it once migrated to typescript
 interface CallingExtensionsContract {
-  initialized: (userData: unknown) => void;
+  initialized: (userData: OnInitialized) => void;
   userAvailable: () => void;
   userUnavailable: () => void;
   userLoggedIn: () => void;
   userLoggedOut: () => void;
-  incomingCall: (callDetails: { fromNumber: string }) => void;
-  outgoingCall: (callDetails: unknown) => void;
-  callAnswered: () => void;
+  incomingCall: (callDetails: OnIncomingCall) => void;
+  outgoingCall: (callDetails: OnOutgoingCall) => void;
+  callAnswered: (payload: OnCallAnswered) => void;
   callData: (data: unknown) => void;
-  callEnded: (engagementData: unknown) => void;
-  callCompleted: (callCompletedData: unknown) => void;
-  sendError: (errorData: unknown) => void;
-  resizeWidget: (sizeInfo: unknown) => void;
-  sendMessage: (message: unknown) => void;
+  callEnded: (engagementData: OnCallEnded) => void;
+  callCompleted: (callCompletedData: OnCallCompleted) => void;
+  sendError: (errorData: OnError) => void;
+  resizeWidget: (sizeInfo: OnResize) => void;
+  sendMessage: (message: OnMessage) => void;
   logDebugMessage: (messageData: unknown) => void;
-}
-
-// @TODO Move it to CallingExtensions and export it once migrated to typescript
-interface CallingExtensionsOptions {
-  debugMode: boolean;
-  eventHandlers: unknown;
+  publishToChannel: (data: OnPublishToChannel) => void;
 }
 
 // @TODO Move it to CallingExtensions and export it once migrated to typescript
@@ -62,10 +48,20 @@ class CallingExtensionsWrapper implements CallingExtensionsContract {
 
   private _incomingNumber = "";
 
-  constructor(options: CallingExtensionsOptions) {
+  private _externalCallId = "";
+
+  constructor(options: Options) {
     this._cti = new CallingExtensions(options);
   }
 
+  get externalCallId() {
+    return this._externalCallId;
+  }
+
+  set externalCallId(id: string) {
+    this._externalCallId = id;
+  }
+
   get incomingNumber() {
     return this._incomingNumber;
   }
@@ -74,7 +70,7 @@ class CallingExtensionsWrapper implements CallingExtensionsContract {
     this._incomingNumber = number;
   }
 
-  initialized(userData: unknown) {
+  initialized(userData: OnInitialized) {
     return this._cti.initialized(userData);
   }
 
@@ -94,48 +90,70 @@ class CallingExtensionsWrapper implements CallingExtensionsContract {
     return this._cti.userLoggedOut();
   }
 
-  incomingCall(callDetails: { fromNumber: string }) {
-    this._incomingNumber = callDetails.fromNumber;
-    return this._cti.incomingCall(callDetails);
+  incomingCall(callDetails: OnIncomingCall) {
+    this.incomingNumber = callDetails.fromNumber;
+    this.externalCallId = uuidv4();
+    return this._cti.incomingCall({
+      ...callDetails,
+      externalCallId: this.externalCallId,
+    });
   }
 
-  outgoingCall(callDetails: unknown) {
-    return this._cti.outgoingCall(callDetails);
+  outgoingCall(callDetails: OnOutgoingCall) {
+    this.externalCallId = uuidv4();
+    return this._cti.outgoingCall({
+      ...callDetails,
+      externalCallId: this.externalCallId,
+    });
   }
 
-  navigateToRecord(data: { objectCoordinates: ObjectCoordinates }) {
+  navigateToRecord(data: OnNavigateToRecord) {
     return this._cti.navigateToRecord(data);
   }
 
-  callAnswered() {
-    return this._cti.callAnswered();
+  callAnswered(data: OnCallAnswered) {
+    return this._cti.callAnswered({
+      ...data,
+      externalCallId: this.externalCallId,
+    });
   }
 
   callData(data: unknown) {
     return this._cti.callData(data);
   }
 
-  callEnded(engagementData: unknown) {
-    return this._cti.callEnded(engagementData);
+  callEnded(engagementData: OnCallEnded) {
+    return this._cti.callEnded({
+      ...engagementData,
+      externalCallId: this.externalCallId,
+    });
+  }
+
+  callCompleted(callCompletedData: OnCallCompleted) {
+    this._cti.callCompleted({
+      ...callCompletedData,
+      externalCallId: this.externalCallId,
+    });
+    this.externalCallId = "";
   }
 
-  callCompleted(callCompletedData: unknown) {
-    return this._cti.callCompleted(callCompletedData);
+  publishToChannel(data: OnPublishToChannel) {
+    return this._cti.publishToChannel(data);
   }
 
-  sendError(errorData: unknown) {
+  sendError(errorData: OnError) {
     return this._cti.sendError(errorData);
   }
 
-  resizeWidget(sizeInfo: unknown) {
+  resizeWidget(sizeInfo: OnResize) {
     return this._cti.resizeWidget(sizeInfo);
   }
 
-  sendMessage(message: unknown) {
+  sendMessage(message: OnMessage) {
     return this._cti.sendMessage(message);
   }
 
-  logDebugMessage(messageData: unknown) {
+  logDebugMessage(messageData: any) {
     return this._cti.logDebugMessage(messageData);
   }
 }
@@ -147,7 +165,6 @@ export const useCti = (
   const [engagementId, setEngagementId] = useState<number | null>(null);
   const [incomingContactName, setIncomingContactName] = useState<string>("");
   const cti = useMemo(() => {
-    const defaultSize = { width: 400, height: 600 };
     return new CallingExtensionsWrapper({
       debugMode: true,
       eventHandlers: {
@@ -161,7 +178,6 @@ export const useCti = (
 
           cti.initialized({
             isLoggedIn: true,
-            sizeInfo: defaultSize,
             engagementId,
           });
           const incomingNumber =
@@ -227,9 +243,9 @@ export const useCti = (
               cti.incomingNumber
             );
             window.localStorage.setItem(INCOMING_CONTACT_NAME_KEY, name);
-            cti.navigateToRecord({
-              objectCoordinates: firstCallerIdMatch.objectCoordinates,
-            });
+            // cti.navigateToRecord({
+            //   objectCoordinates: firstCallerIdMatch.objectCoordinates,
+            // });
             return;
           }
           cti.logDebugMessage({
@@ -252,6 +268,18 @@ export const useCti = (
         onPublishToChannelSucceeded: (data: any, _rawEvent: any) => {
           /** HubSpot successfully published the call to the connected channel. */
         },
+        onSetCallState: (data: any, _rawEvent: any) => {
+          /** HubSpot successfully published the call to the connected channel. */
+        },
+        onEndCall: (data: any, _rawEvent: any) => {
+          /** HubSpot successfully ended the call. */
+        },
+        onInitiateCallIdSucceeded: (data: any, _rawEvent: any) => {
+          /** HubSpot successfully initiated the call. */
+        },
+        onInitiateCallIdFailed: (data: any, _rawEvent: any) => {
+          /** HubSpot was unable to initiate call. */
+        },
       },
     });
   }, []);

From 90bf07aa2c91b484e97765ad155735f598dfde5a Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Tue, 10 Sep 2024 09:46:27 -0400
Subject: [PATCH 18/22] minimal demo update

---
 demos/demo-minimal-js/index.js          | 19 +++++++++++-----
 demos/demo-minimal-js/package-lock.json | 29 ++++++++++++++++++-------
 demos/demo-minimal-js/package.json      |  3 ++-
 3 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/demos/demo-minimal-js/index.js b/demos/demo-minimal-js/index.js
index 63255a6..b499595 100644
--- a/demos/demo-minimal-js/index.js
+++ b/demos/demo-minimal-js/index.js
@@ -1,10 +1,9 @@
-/* eslint-disable import/no-relative-packages */
-import CallingExtensions from "../../src/CallingExtensions";
-import { messageType, callEndStatus } from "../../src/Constants";
-// import CallingExtensions, { Constants } from "@hubspot/calling-extensions-sdk";
-// const { messageType, callEndStatus } = Constants;
+import CallingExtensions, { Constants } from "@hubspot/calling-extensions-sdk";
+import { v4 as uuidv4 } from "uuid";
+const { messageType, callEndStatus } = Constants;
 
 export const state = {
+  externalCallId: "",
   engagementId: 0,
   fromNumber: "+123456",
   incomingContactName: "",
@@ -55,6 +54,7 @@ function enableButtons(ids) {
 const cti = new CallingExtensions({
   debugMode: true,
   eventHandlers: {
+    // eslint-disable-next-line object-curly-newline
     onReady: ({ engagementId, portalId, userId, ownerId } = {}) => {
       cti.initialized({
         engagementId,
@@ -220,11 +220,13 @@ export function userUnavailable() {
 }
 
 export function incomingCall() {
+  state.externalCallId = uuidv4();
   window.setTimeout(() => {
     cti.incomingCall({
       createEngagement: true,
       fromNumber: state.fromNumber,
       toNumber: state.toNumber,
+      externalCallId: state.externalCallId,
     });
   }, 500);
   disableButtons([OUTGOING_CALL, INCOMING_CALL, USER_UNAVAILABLE]);
@@ -232,11 +234,13 @@ export function incomingCall() {
 }
 
 export function outgoingCall() {
+  state.externalCallId = uuidv4();
   window.setTimeout(() => {
     cti.outgoingCall({
       createEngagement: true,
       toNumber: state.toNumber,
       fromNumber: state.fromNumber,
+      externalCallId: state.externalCallId,
     });
   }, 500);
   disableButtons([OUTGOING_CALL, INCOMING_CALL, USER_UNAVAILABLE]);
@@ -244,13 +248,14 @@ export function outgoingCall() {
 }
 
 export function answerCall() {
-  cti.callAnswered();
+  cti.callAnswered({ externalCallId: state.externalCallId });
   disableButtons([ANSWER_CALL]);
 }
 
 export function endCall() {
   cti.callEnded({
     callEndStatus: callEndStatus.INTERNAL_COMPLETED,
+    externalCallId: state.externalCallId,
   });
   disableButtons([ANSWER_CALL, END_CALL]);
   enableButtons([COMPLETE_CALL]);
@@ -259,12 +264,14 @@ export function endCall() {
 export function completeCall() {
   cti.callCompleted({
     engagementId: state.engagementId,
+    externalCallId: state.externalCallId,
     hideWidget: false,
     engagementProperties: {
       hs_call_title: "Demo call",
       hs_call_body: "Resolved issue",
     },
   });
+  state.externalCallId = "";
   disableButtons([COMPLETE_CALL]);
   enableButtons([OUTGOING_CALL, INCOMING_CALL, USER_UNAVAILABLE]);
 }
diff --git a/demos/demo-minimal-js/package-lock.json b/demos/demo-minimal-js/package-lock.json
index 5f891af..0ebeb77 100644
--- a/demos/demo-minimal-js/package-lock.json
+++ b/demos/demo-minimal-js/package-lock.json
@@ -9,7 +9,8 @@
       "version": "1.0.0",
       "license": "MIT",
       "dependencies": {
-        "@hubspot/calling-extensions-sdk": "^0.6.3"
+        "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.9",
+        "uuid": "^10.0.0"
       },
       "devDependencies": {
         "cross-env": "^7.0.3",
@@ -32,9 +33,9 @@
       }
     },
     "node_modules/@hubspot/calling-extensions-sdk": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.3.tgz",
-      "integrity": "sha512-3HaIVj/ATJ8RjN5H+VfY/DU7kNm0DCaNU80AEGcdn3/hseIucH5fOlU42EHy/TaW2rFZJHr/OUiBNMf4E6AbwA==",
+      "version": "0.6.4-alpha.9",
+      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.9.tgz",
+      "integrity": "sha512-7ijBQn/CWOCS6LChTdVhpfPBnBJ8bu3Pz7KDU/kllGulszSST0Of1Darw3EnQaAuTE7GvvfjliEZm4xD+mNpTA==",
       "engines": {
         "node": ">=14"
       }
@@ -3191,6 +3192,15 @@
         "websocket-driver": "^0.7.4"
       }
     },
+    "node_modules/sockjs/node_modules/uuid": {
+      "version": "8.3.2",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
+      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+      "dev": true,
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/source-map": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
@@ -3541,10 +3551,13 @@
       }
     },
     "node_modules/uuid": {
-      "version": "8.3.2",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
-      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
-      "dev": true,
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+      "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
       "bin": {
         "uuid": "dist/bin/uuid"
       }
diff --git a/demos/demo-minimal-js/package.json b/demos/demo-minimal-js/package.json
index 1fbf833..41c6d57 100644
--- a/demos/demo-minimal-js/package.json
+++ b/demos/demo-minimal-js/package.json
@@ -21,6 +21,7 @@
     "webpack-dev-server": "^4.11.1"
   },
   "dependencies": {
-    "@hubspot/calling-extensions-sdk": "^0.6.3"
+    "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.9",
+    "uuid": "^10.0.0"
   }
 }

From 74b013e8da55c53d4578c425f73ea7997564ffaf Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Tue, 10 Sep 2024 11:54:15 -0400
Subject: [PATCH 19/22] feedback fix

---
 demos/demo-react-ts/src/hooks/useCti.ts | 12 ++++++++----
 src/CallingExtensions.js                |  4 +++-
 src/IFrameManager.js                    | 24 ++++++++++++++++--------
 src/typedefs.js                         |  5 ++---
 4 files changed, 29 insertions(+), 16 deletions(-)

diff --git a/demos/demo-react-ts/src/hooks/useCti.ts b/demos/demo-react-ts/src/hooks/useCti.ts
index 9ba2b98..e1b17fb 100644
--- a/demos/demo-react-ts/src/hooks/useCti.ts
+++ b/demos/demo-react-ts/src/hooks/useCti.ts
@@ -179,7 +179,11 @@ export const useCti = (
           cti.initialized({
             isLoggedIn: true,
             engagementId,
-          });
+            sizeInfo: {
+              width: 400,
+              height: 650,
+            },
+          } as OnInitialized);
           const incomingNumber =
             window.localStorage.getItem(INCOMING_NUMBER_KEY);
           const incomingContactName = window.localStorage.getItem(
@@ -243,9 +247,9 @@ export const useCti = (
               cti.incomingNumber
             );
             window.localStorage.setItem(INCOMING_CONTACT_NAME_KEY, name);
-            // cti.navigateToRecord({
-            //   objectCoordinates: firstCallerIdMatch.objectCoordinates,
-            // });
+            cti.navigateToRecord({
+              objectCoordinates: firstCallerIdMatch.objectCoordinates,
+            });
             return;
           }
           cti.logDebugMessage({
diff --git a/src/CallingExtensions.js b/src/CallingExtensions.js
index d5f9142..80f94ba 100644
--- a/src/CallingExtensions.js
+++ b/src/CallingExtensions.js
@@ -215,7 +215,9 @@ class CallingExtensions {
     let handler;
     if (type in messageHandlerNames) {
       const name = messageHandlerNames[type];
-      handler = eventHandlers[name];
+      if (name in eventHandlers) {
+        handler = eventHandlers[name];
+      }
     } else {
       // Send back a message indicating an unknown event is received
       this.sendMessage({
diff --git a/src/IFrameManager.js b/src/IFrameManager.js
index 0b6ebc0..95fc425 100644
--- a/src/IFrameManager.js
+++ b/src/IFrameManager.js
@@ -145,17 +145,25 @@ class IFrameManager {
    */
   updateIFrameSize(sizeInfo) {
     const { width, height } = sizeInfo;
-    const formatSize = (/** @type {number} */ size) => {
-      return typeof size === "number" ? `${size}px` : size;
-    };
-    if (width && this.iFrame) {
-      this.iFrame.setAttribute("width", formatSize(width));
-    }
-    if (height && this.iFrame) {
-      this.iFrame.setAttribute("height", formatSize(height));
+    if (this.iFrame) {
+      if (width) {
+        this.iFrame.setAttribute("width", IFrameManager.formatSize(width));
+      }
+      if (height) {
+        this.iFrame.setAttribute("height", IFrameManager.formatSize(height));
+      }
     }
   }
 
+  /**
+   *
+   * @param {number | string} size
+   * @returns {string}
+   */
+  static formatSize(size) {
+    return typeof size === "number" ? `${size}px` : size;
+  }
+
   onReady(data = {}) {
     this.isReady = true;
     this.onMessageHandler({
diff --git a/src/typedefs.js b/src/typedefs.js
index 22fd26a..1852ab3 100644
--- a/src/typedefs.js
+++ b/src/typedefs.js
@@ -5,11 +5,10 @@
  */
 
 /**
- * @typedef {Object} EventHandlers
+ * @typedef {Object.<string, function>} EventHandlers
  * @property {function} onReady - Called when HubSpot is ready to receive messages.
  * @property {function} onDialNumber - Called when the HubSpot sends a dial number from the contact.
- * @property {function} onEngagementCreated - Called when HubSpot creates an engagement
- * for the call.
+ * @property {function} onEngagementCreated - Called when HubSpot creates an engagement for the call.
  * @property {function} onVisibilityChanged - Called when the call widget's visibility changes.
  * @property {function} onCallerIdMatchFailed - Called when the caller ID match fails.
  * @property {function} onCallerIdMatchSucceeded - Called when the caller ID match succeeds.

From dc0a009aa3d4f5992824d936b44794189f0a8a7e Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Tue, 10 Sep 2024 14:02:11 -0400
Subject: [PATCH 20/22] 0.7.0-alpha.0

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index b4dcb26..0df57f3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.9",
+  "version": "0.7.0-alpha.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.6.4-alpha.9",
+      "version": "0.7.0-alpha.0",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index a9bc63f..5f2180c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.6.4-alpha.9",
+  "version": "0.7.0-alpha.0",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"

From dc11e1cd18fb1d7ef303abfeaa4177a68462d8d2 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Tue, 10 Sep 2024 14:10:51 -0400
Subject: [PATCH 21/22] 0.7.0-beta.0

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 0df57f3..a7e9c7b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.7.0-alpha.0",
+  "version": "0.7.0-beta.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@hubspot/calling-extensions-sdk",
-      "version": "0.7.0-alpha.0",
+      "version": "0.7.0-beta.0",
       "license": "MIT",
       "devDependencies": {
         "@babel/cli": "^7.21.0",
diff --git a/package.json b/package.json
index 5f2180c..75990e5 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/calling-extensions-sdk",
-  "version": "0.7.0-alpha.0",
+  "version": "0.7.0-beta.0",
   "description": "A JavaScript SDK for integrating calling apps into HubSpot.",
   "publishConfig": {
     "access": "public"

From a3cc4c89c898dc971adef1d338dac9d55aabddc8 Mon Sep 17 00:00:00 2001
From: hthakkar <hthakkar@hubspot.com>
Date: Tue, 10 Sep 2024 14:12:25 -0400
Subject: [PATCH 22/22] Update demos to beta version

---
 demos/demo-minimal-js/package-lock.json |  8 ++++----
 demos/demo-minimal-js/package.json      |  2 +-
 demos/demo-react-ts/package-lock.json   | 14 +++++++-------
 demos/demo-react-ts/package.json        |  2 +-
 4 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/demos/demo-minimal-js/package-lock.json b/demos/demo-minimal-js/package-lock.json
index 0ebeb77..b00eb7c 100644
--- a/demos/demo-minimal-js/package-lock.json
+++ b/demos/demo-minimal-js/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.0.0",
       "license": "MIT",
       "dependencies": {
-        "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.9",
+        "@hubspot/calling-extensions-sdk": "^0.7.0-beta.0",
         "uuid": "^10.0.0"
       },
       "devDependencies": {
@@ -33,9 +33,9 @@
       }
     },
     "node_modules/@hubspot/calling-extensions-sdk": {
-      "version": "0.6.4-alpha.9",
-      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.9.tgz",
-      "integrity": "sha512-7ijBQn/CWOCS6LChTdVhpfPBnBJ8bu3Pz7KDU/kllGulszSST0Of1Darw3EnQaAuTE7GvvfjliEZm4xD+mNpTA==",
+      "version": "0.7.0-beta.0",
+      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.7.0-beta.0.tgz",
+      "integrity": "sha512-afw8c/bnquyIy1OfdKMLh5Ic/fYX2uMIz2tsunCuSFRUVRpStYkAdIXjWi9vblMmcz/+7k50yeNNl8QclRxQXw==",
       "engines": {
         "node": ">=14"
       }
diff --git a/demos/demo-minimal-js/package.json b/demos/demo-minimal-js/package.json
index 41c6d57..d6fde47 100644
--- a/demos/demo-minimal-js/package.json
+++ b/demos/demo-minimal-js/package.json
@@ -21,7 +21,7 @@
     "webpack-dev-server": "^4.11.1"
   },
   "dependencies": {
-    "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.9",
+    "@hubspot/calling-extensions-sdk": "^0.7.0-beta.0",
     "uuid": "^10.0.0"
   }
 }
diff --git a/demos/demo-react-ts/package-lock.json b/demos/demo-react-ts/package-lock.json
index ad828be..909e96e 100644
--- a/demos/demo-react-ts/package-lock.json
+++ b/demos/demo-react-ts/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.0.0",
       "license": "MIT",
       "dependencies": {
-        "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.9",
+        "@hubspot/calling-extensions-sdk": "^0.7.0-beta.0",
         "react": "^18.2.0",
         "react-aria": "^3.22.0",
         "react-dom": "^18.2.0",
@@ -1860,9 +1860,9 @@
       }
     },
     "node_modules/@hubspot/calling-extensions-sdk": {
-      "version": "0.6.4-alpha.9",
-      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.9.tgz",
-      "integrity": "sha512-7ijBQn/CWOCS6LChTdVhpfPBnBJ8bu3Pz7KDU/kllGulszSST0Of1Darw3EnQaAuTE7GvvfjliEZm4xD+mNpTA==",
+      "version": "0.7.0-beta.0",
+      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.7.0-beta.0.tgz",
+      "integrity": "sha512-afw8c/bnquyIy1OfdKMLh5Ic/fYX2uMIz2tsunCuSFRUVRpStYkAdIXjWi9vblMmcz/+7k50yeNNl8QclRxQXw==",
       "engines": {
         "node": ">=14"
       }
@@ -9879,9 +9879,9 @@
       }
     },
     "@hubspot/calling-extensions-sdk": {
-      "version": "0.6.4-alpha.9",
-      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.6.4-alpha.9.tgz",
-      "integrity": "sha512-7ijBQn/CWOCS6LChTdVhpfPBnBJ8bu3Pz7KDU/kllGulszSST0Of1Darw3EnQaAuTE7GvvfjliEZm4xD+mNpTA=="
+      "version": "0.7.0-beta.0",
+      "resolved": "https://registry.npmjs.org/@hubspot/calling-extensions-sdk/-/calling-extensions-sdk-0.7.0-beta.0.tgz",
+      "integrity": "sha512-afw8c/bnquyIy1OfdKMLh5Ic/fYX2uMIz2tsunCuSFRUVRpStYkAdIXjWi9vblMmcz/+7k50yeNNl8QclRxQXw=="
     },
     "@internationalized/date": {
       "version": "3.1.0",
diff --git a/demos/demo-react-ts/package.json b/demos/demo-react-ts/package.json
index f6bf98a..b39ec98 100644
--- a/demos/demo-react-ts/package.json
+++ b/demos/demo-react-ts/package.json
@@ -18,7 +18,7 @@
     "node": ">=14"
   },
   "dependencies": {
-    "@hubspot/calling-extensions-sdk": "^0.6.4-alpha.9",
+    "@hubspot/calling-extensions-sdk": "^0.7.0-beta.0",
     "react": "^18.2.0",
     "react-aria": "^3.22.0",
     "react-dom": "^18.2.0",