@saasquatch/squatch-js 2.6.0-1 → 2.6.0-11

package/dist/squatch.js

@@ -39,10 +39,61 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
+var DEFAULT_DOMAIN = "https://app.referralsaasquatch.com";
+var DEFAULT_NPM_CDN = "https://fast.ssqt.io/npm";
+var DEFAULT_NAMESPACE = "squatch";
+var IMPACT_NAMESPACE = "impact";
+
+function validateConfig(_raw) {
+  if (typeof _raw !== "object") throw new Error("config must be an object");
+  var tenant = window.squatchTenant;
+  var config = getConfig();
+  var raw = {
+    tenantAlias: (_raw == null ? void 0 : _raw["tenantAlias"]) || tenant,
+    domain: (_raw == null ? void 0 : _raw["domain"]) || (config == null ? void 0 : config.domain),
+    npmCdn: (_raw == null ? void 0 : _raw["npmCdn"]) || (config == null ? void 0 : config.npmCdn),
+    debug: (_raw == null ? void 0 : _raw["debug"]) || (config == null ? void 0 : config.debug)
+  };
+  if (typeof raw.tenantAlias !== "string") throw new Error("tenantAlias not provided");
+  var tenantAlias = raw.tenantAlias;
+  var domain = typeof raw.domain === "string" && raw.domain || DEFAULT_DOMAIN;
+  var debug = typeof raw.debug === "boolean" && raw.debug || false;
+  var npmCdn = typeof raw.npmCdn === "string" && raw.npmCdn || DEFAULT_NPM_CDN;
+  return {
+    tenantAlias,
+    domain,
+    debug,
+    npmCdn
+  };
+}
+function isObject$1(obj) {
+  return typeof obj === "object" && !Array.isArray(obj) && obj !== null;
+}
+function validateLocale(locale) {
+  if (locale && /^[a-z]{2}_(?:[A-Z]{2}|[0-9]{3})$/.test(locale)) {
+    return locale;
+  }
+}
+function validateWidgetConfig(raw) {
+  if (!isObject$1(raw)) throw new Error("Widget properties must be an object");
+  if (!(raw != null && raw["user"])) throw new Error("Required properties missing.");
+  return raw;
+}
+function validatePasswordlessConfig(raw) {
+  if (!isObject$1(raw)) throw new Error("Widget properties must be an object");
+  return raw;
+}
+function getToken() {
+  return window.impactToken || window.squatchToken;
+}
+function getConfig() {
+  return window.impactConfig || window.squatchConfig;
+}
+
 debug.debug("squatch-js:io");
 
 async function doQuery(url, query, variables, jwt) {
-  var token = jwt || window.squatchToken;
+  var token = jwt || getToken();
 
   var headers = _extends({
     Accept: "application/json",
@@ -77,7 +128,7 @@ async function doGet(url, jwt) {
     Accept: "application/json",
     "Content-Type": "application/json"
   };
-  var token = jwt || window.squatchToken;
+  var token = jwt || getToken();
   if (token) headers["X-SaaSquatch-User-Token"] = token;
 
   try {
@@ -98,7 +149,7 @@ async function doPost(url, data, jwt) {
     Accept: "application/json",
     "Content-Type": "application/json"
   };
-  var token = jwt || window.squatchToken;
+  var token = jwt || getToken();
   if (token) headers["X-SaaSquatch-User-Token"] = token;
 
   try {
@@ -120,7 +171,7 @@ async function doPut(url, data, jwt) {
     "Content-Type": "application/json",
     "X-SaaSquatch-Referrer": window ? window.location.href : ""
   };
-  var token = jwt || window.squatchToken;
+  var token = jwt || getToken();
   if (token) headers["X-SaaSquatch-User-Token"] = token;
 
   try {
@@ -138,48 +189,6 @@ async function doPut(url, data, jwt) {
   }
 }
 
-var DEFAULT_DOMAIN = "https://app.referralsaasquatch.com";
-var DEFAULT_NPM_CDN = "https://fast.ssqt.io/npm";
-function validateConfig(_raw) {
-  var _window$squatchConfig, _window$squatchConfig2, _window$squatchConfig3;
-
-  if (typeof _raw !== "object") throw new Error("config must be an object");
-  var raw = {
-    tenantAlias: (_raw == null ? void 0 : _raw["tenantAlias"]) || window.squatchTenant,
-    domain: (_raw == null ? void 0 : _raw["domain"]) || ((_window$squatchConfig = window.squatchConfig) == null ? void 0 : _window$squatchConfig.domain),
-    npmCdn: (_raw == null ? void 0 : _raw["npmCdn"]) || ((_window$squatchConfig2 = window.squatchConfig) == null ? void 0 : _window$squatchConfig2.npmCdn),
-    debug: (_raw == null ? void 0 : _raw["debug"]) || ((_window$squatchConfig3 = window.squatchConfig) == null ? void 0 : _window$squatchConfig3.debug)
-  };
-  if (typeof raw.tenantAlias !== "string") throw new Error("tenantAlias not provided");
-  var tenantAlias = raw.tenantAlias;
-  var domain = typeof raw.domain === "string" && raw.domain || DEFAULT_DOMAIN;
-  var debug = typeof raw.debug === "boolean" && raw.debug || false;
-  var npmCdn = typeof raw.npmCdn === "string" && raw.npmCdn || DEFAULT_NPM_CDN;
-  return {
-    tenantAlias,
-    domain,
-    debug,
-    npmCdn
-  };
-}
-function isObject$1(obj) {
-  return typeof obj === "object" && !Array.isArray(obj) && obj !== null;
-}
-function validateLocale(locale) {
-  if (locale && /^[a-z]{2}_(?:[A-Z]{2}|[0-9]{3})$/.test(locale)) {
-    return locale;
-  }
-}
-function validateWidgetConfig(raw) {
-  if (!isObject$1(raw)) throw new Error("Widget properties must be an object");
-  if (!(raw != null && raw["user"])) throw new Error("Required properties missing.");
-  return raw;
-}
-function validatePasswordlessConfig(raw) {
-  if (!isObject$1(raw)) throw new Error("Widget properties must be an object");
-  return raw;
-}
-
 var RENDER_WIDGET_QUERY = "\n  query renderWidget ($user: UserIdInput, $engagementMedium: UserEngagementMedium, $widgetType: WidgetType, $locale: RSLocale) {\n    renderWidget(user: $user, engagementMedium: $engagementMedium, widgetType: $widgetType, locale: $locale) {\n      template\n      user {\n        id\n        accountId\n      }\n      jsOptions\n      widgetConfig {\n        values\n      }\n    }\n  }\n";
 
 /**
@@ -209,6 +218,7 @@ class WidgetApi {
     this.tenantAlias = void 0;
     this.domain = void 0;
     this.npmCdn = void 0;
+    this.referralCookie = this.squatchReferralCookie;
     var raw = config;
     var clean = validateConfig(raw);
     this.tenantAlias = clean.tenantAlias;
@@ -216,7 +226,7 @@ class WidgetApi {
     this.npmCdn = clean.npmCdn;
   }
   /**
-   * Creates/upserts user.
+   * Creates/upserts user, requests widget template.
    *
    * @param {Object} params Parameters for request
    * @param {Object?} params.user The user details
@@ -238,6 +248,7 @@ class WidgetApi {
       widgetType,
       engagementMedium = "POPUP",
       jwt,
+      locale,
       user
     } = clean;
     var tenantAlias = encodeURIComponent(this.tenantAlias);
@@ -246,7 +257,8 @@ class WidgetApi {
 
     var optionalParams = _buildParams({
       widgetType,
-      engagementMedium
+      engagementMedium,
+      locale
     });
 
     var path = "/api/v1/" + tenantAlias + "/widget/account/" + accountId + "/user/" + userId + "/upsert" + optionalParams;
@@ -256,7 +268,7 @@ class WidgetApi {
     return doPut(url, JSON.stringify(user), jwt);
   }
   /**
-   * Description here.
+   * Requests widget template
    *
    * @param {Object} params Parameters for request
    * @param {Object} params.user The user details
@@ -331,12 +343,14 @@ class WidgetApi {
 function _buildParams(_ref) {
   var {
     widgetType,
-    engagementMedium
+    engagementMedium,
+    locale
   } = _ref;
-  var widgetTypeP = widgetType ? "?widgetType=" + encodeURIComponent(widgetType) : "";
-  var engagementMediumP = (widgetType ? "&" : "?") + "engagementMedium=" + encodeURIComponent(engagementMedium);
-  var optionalParams = widgetTypeP + engagementMediumP;
-  return optionalParams;
+  var queryParams = new URLSearchParams();
+  queryParams.append("engagementMedium", engagementMedium);
+  if (widgetType) queryParams.append("widgetType", widgetType);
+  if (locale) queryParams.append("locale", locale);
+  return "?" + queryParams.toString();
 }
 
 // @ts-check
@@ -357,14 +371,14 @@ class AnalyticsApi {
    *
    */
   constructor(config) {
-    var _window$squatchConfig;
+    var _getConfig;
 
     this.domain = void 0;
     var raw = config;
 
     var clean = _validateAnalyticsConfig(raw);
 
-    this.domain = (clean == null ? void 0 : clean["domain"]) || ((_window$squatchConfig = window.squatchConfig) == null ? void 0 : _window$squatchConfig.domain) || DEFAULT_DOMAIN;
+    this.domain = (clean == null ? void 0 : clean["domain"]) || ((_getConfig = getConfig()) == null ? void 0 : _getConfig.domain) || DEFAULT_DOMAIN;
   }
 
   pushAnalyticsLoadEvent(params) {
@@ -400,7 +414,7 @@ function _validateAnalyticsConfig(raw) {
 // @ts-check
 /** @hidden */
 
-var _log$7 = debug.debug("squatch-js:widget");
+var _log$8 = debug.debug("squatch-js:widget");
 /*
  * The Widget class is the base class for the different widget types available
  *
@@ -413,6 +427,8 @@ var _log$7 = debug.debug("squatch-js:widget");
 
 class Widget {
   constructor(params) {
+    var _params$context;
+
     this.type = void 0;
     this.content = void 0;
     this.analyticsApi = void 0;
@@ -421,7 +437,7 @@ class Widget {
     this.npmCdn = void 0;
     this.container = void 0;
 
-    _log$7("widget initializing ...");
+    _log$8("widget initializing ...");
 
     this.content = params.content === "error" ? this._error(params.rsCode) : params.content;
     this.type = params.type;
@@ -431,7 +447,7 @@ class Widget {
       domain: params.domain
     });
     this.context = params.context;
-    this.container = params.container;
+    this.container = ((_params$context = params.context) == null ? void 0 : _params$context.container) || params.container;
   }
 
   _findElement() {
@@ -441,25 +457,25 @@ class Widget {
       // selector is a string
       element = document.querySelector(this.container);
 
-      _log$7("loading widget with selector", element); // selector is an HTML element
+      _log$8("loading widget with selector", element); // selector is an HTML element
 
     } else if (this.container instanceof HTMLElement) {
       element = this.container;
 
-      _log$7("loading widget with container", element); // garbage container found
+      _log$8("loading widget with container", element); // garbage container found
 
     } else if (this.container) {
       element = null;
 
-      _log$7("container must be an HTMLElement or string", this.container); // find element on page
+      _log$8("container must be an HTMLElement or string", this.container); // find element on page
 
     } else {
-      element = document.querySelector("#squatchembed") || document.querySelector(".squatchembed");
+      element = document.querySelector("#squatchembed") || document.querySelector(".squatchembed") || document.querySelector("#impactembed") || document.querySelector(".impactembed");
 
-      _log$7("loading widget with default selector", element);
+      _log$8("loading widget with default selector", element);
     }
 
-    if (!(element instanceof HTMLElement)) throw new Error("element with selector '" + (this.container || "#squatchembed or .squatchembed") + "' not found.'");
+    if (!(element instanceof HTMLElement)) throw new Error("element with selector '" + (this.container || "#squatchembed, .squatchembed, #impactembed, or .impactembed") + "' not found.'");
     return element;
   }
 
@@ -475,8 +491,7 @@ class Widget {
   }
 
   _findFrame() {
-    var element = this._findElement();
-
+    var element = this.container ? this._findElement() : document.body;
     var parent = element.shadowRoot || element;
     return parent.querySelector("iframe#squatchFrame");
   }
@@ -515,9 +530,9 @@ class Widget {
     }
 
     (_this$analyticsApi$pu = this.analyticsApi.pushAnalyticsLoadEvent(params)) == null ? void 0 : _this$analyticsApi$pu.then(response => {
-      _log$7(params.engagementMedium + " loaded event recorded.");
+      _log$8(params.engagementMedium + " loaded event recorded.");
     }).catch(ex => {
-      _log$7("ERROR: pushAnalyticsLoadEvent() " + ex);
+      _log$8("ERROR: pushAnalyticsLoadEvent() " + ex);
     });
   }
 
@@ -530,13 +545,12 @@ class Widget {
         engagementMedium: sqh.mode.widgetMode,
         shareMedium: medium
       }).then(response => {
-        _log$7(sqh.mode.widgetMode + " share " + medium + " event recorded. " + response);
+        _log$8(sqh.mode.widgetMode + " share " + medium + " event recorded. " + response);
       }).catch(ex => {
-        _log$7("ERROR: pushAnalyticsShareClickedEvent() " + ex);
+        _log$8("ERROR: pushAnalyticsShareClickedEvent() " + ex);
       });
     }
-  } // TODO: CA: Refactor how error templates are shown
-
+  }
 
   _error(rs, mode, style) {
     if (mode === void 0) {
@@ -654,7 +668,7 @@ class Widget {
         message
       } = _ref3;
 
-      _log$7("" + message);
+      _log$8("" + message);
     });
   }
 
@@ -681,10 +695,8 @@ class Widget {
 }
 
 function delay(duration) {
-  return new Promise(function (resolve, reject) {
-    setTimeout(function () {
-      resolve(() => {});
-    }, duration);
+  return new Promise(resolve => {
+    setTimeout(resolve, duration);
   });
 }
 
@@ -713,12 +725,17 @@ function domready(targetDoc, fn) {
 
 // @ts-check
 
-var _log$6 = debug.debug("squatch-js:EMBEDwidget");
+var _log$7 = debug.debug("squatch-js:EMBEDwidget");
 /**
  * An EmbedWidget is displayed inline in part of your page.
  *
  * To create an EmbedWidget use {@link Widgets}
  *
+ * @example
+ * const widget = new EmbedWidget({ ... })
+ * widget.load() // Loads widget into the DOM
+ * widget.open() // Makes the iframe container visible
+ * widget.close() // Hides the iframe container
  */
 
 
@@ -727,18 +744,30 @@ class EmbedWidget extends Widget {
     super(params);
     this.show = this.open;
     this.hide = this.close;
+    if (container) this.container = container;
   }
 
   async load() {
+    var _this$context;
+
     var frame = this._createFrame();
 
     var element = this._findElement();
 
+    if ((_this$context = this.context) != null && _this$context.container) {
+      // Custom container is used
+      element.style.visibility = "hidden";
+      element.style.height = "0";
+      element.style["overflow-y"] = "hidden";
+    }
+
     if (this.container) {
       if (element.shadowRoot) {
         var _element$shadowRoot$l;
 
-        if (((_element$shadowRoot$l = element.shadowRoot.lastChild) == null ? void 0 : _element$shadowRoot$l.nodeName) === "IFRAME") element.shadowRoot.replaceChild(frame, element.shadowRoot.lastChild);else {
+        if (((_element$shadowRoot$l = element.shadowRoot.lastChild) == null ? void 0 : _element$shadowRoot$l.nodeName) === "IFRAME") {
+          element.shadowRoot.replaceChild(frame, element.shadowRoot.lastChild);
+        } else {
           element.shadowRoot.appendChild(frame);
         }
       } // Widget reloaded - replace existing element
@@ -770,6 +799,8 @@ class EmbedWidget extends Widget {
 
       frame.height = frameDoc.body.scrollHeight; // Adjust frame height when size of body changes
 
+      /* istanbul ignore next: hard to test */
+
       var ro = new contentWindow["ResizeObserver"](entries => {
         for (var entry of entries) {
           var {
@@ -777,44 +808,50 @@ class EmbedWidget extends Widget {
           } = entry.contentRect; // @ts-ignore -- number will be cast to string by browsers
 
           frame.height = height;
+          console.log("RESIZE");
         }
       });
-      ro.observe(await this._findInnerContainer(frame)); // Regular load - trigger event
+      var container = await this._findInnerContainer(frame);
+      ro.observe(container);
 
-      if (!this.container) {
+      if (this._shouldFireLoadEvent()) {
         this._loadEvent(_sqh);
 
-        _log$6("loaded");
+        _log$7("loaded");
       }
     });
-  } // Un-hide if element is available and refresh data
+  }
+  /**
+   * Un-hide if element is available and refresh data
+   */
 
 
   open() {
-    var _frame$contentDocumen, _frame$contentWindow, _frame$contentWindow2;
-
     var frame = this._findFrame();
 
-    if (!frame) return _log$6("no target element to open");
+    if (!frame) return _log$7("no target element to open");
+    if (!frame.contentWindow) return _log$7("Frame needs a content window");
 
     var element = this._findElement();
 
     element.style.visibility = "unset";
     element.style.height = "auto";
     element.style["overflow-y"] = "auto";
-    frame == null ? void 0 : (_frame$contentDocumen = frame.contentDocument) == null ? void 0 : _frame$contentDocumen.dispatchEvent(new CustomEvent("sq:refresh"));
+    frame.contentWindow.document.dispatchEvent(new CustomEvent("sq:refresh"));
 
-    var _sqh = (frame == null ? void 0 : (_frame$contentWindow = frame.contentWindow) == null ? void 0 : _frame$contentWindow.squatch) || (frame == null ? void 0 : (_frame$contentWindow2 = frame.contentWindow) == null ? void 0 : _frame$contentWindow2.widgetIdent);
+    var _sqh = frame.contentWindow.squatch || frame.contentWindow.widgetIdent;
 
-    this._loadEvent(_sqh);
+    if (this.context.user) {
+      this._loadEvent(_sqh);
 
-    _log$6("loaded");
+      _log$7("loaded");
+    }
   }
 
   close() {
     var frame = this._findFrame();
 
-    if (!frame) return _log$6("no target element to close");
+    if (!frame) return _log$7("no target element to close");
 
     var element = this._findElement();
 
@@ -822,7 +859,7 @@ class EmbedWidget extends Widget {
     element.style.height = "0";
     element.style["overflow-y"] = "hidden";
 
-    _log$6("Embed widget closed");
+    _log$7("Embed widget closed");
   }
 
   _error(rs, mode, style) {
@@ -837,11 +874,18 @@ class EmbedWidget extends Widget {
     return super._error(rs, mode, style);
   }
 
+  _shouldFireLoadEvent() {
+    var noContainer = !this.container;
+    var isComponent = this.container instanceof HTMLElement && (this.container.tagName.startsWith("SQUATCH-") || this.container.tagName.startsWith("IMPACT-"));
+    var isVerified = !!this.context.user;
+    return isVerified && (noContainer || isComponent);
+  }
+
 }
 
 // @ts-check
 
-var _log$5 = debug.debug("squatch-js:POPUPwidget");
+var _log$6 = debug.debug("squatch-js:POPUPwidget");
 
 var popupId = 0;
 /**
@@ -850,6 +894,11 @@ var popupId = 0;
  *
  * To create a PopupWidget use {@link Widgets}
  *
+ * @example
+ * const widget = new PopupWidget({ ... })
+ * widget.load() // Loads the widget into a dialog element
+ * widget.open() // Opens the dialog element
+ * widget.close() // Hides the dialog element
  */
 
 class PopupWidget extends Widget {
@@ -875,17 +924,17 @@ class PopupWidget extends Widget {
     document.head.insertAdjacentHTML("beforeend", "<style>#" + this.id + "::-webkit-scrollbar { display: none; }</style>");
   }
 
-  _initialiseCTA(frame) {
+  _initialiseCTA() {
     if (!this.trigger) return;
     var triggerElement;
 
     try {
       triggerElement
       /* HTMLButton */
-      = document.querySelector(this.trigger);
-      if (this.trigger && !triggerElement) _log$5("No element found with trigger selector", this.trigger);
+      = document.querySelector(this.trigger) || document.querySelector(".impactpop");
+      if (this.trigger && !triggerElement) _log$6("No element found with trigger selector", this.trigger);
     } catch (_unused) {
-      _log$5("Not a valid selector", this.trigger);
+      _log$6("Not a valid selector", this.trigger);
     } // Trigger is optional
 
 
@@ -893,16 +942,7 @@ class PopupWidget extends Widget {
       triggerElement.onclick = () => {
         this.open();
       };
-    } // const element = this._findElement();
-    // If widget is loaded with CTA, look for a 'squatchpop' element to use
-    // that element as a trigger as well.
-    // const triggerWhenCTA = element.querySelector(".squatchpop") as HTMLElement;
-    // if (this.trigger === "#cta" && triggerWhenCTA) {
-    //   triggerWhenCTA.onclick = () => {
-    //     this.open(frame);
-    //   };
-    // }
-
+    }
   }
 
   _createPopupDialog() {
@@ -911,6 +951,7 @@ class PopupWidget extends Widget {
     dialog.setAttribute("style", "width: 100%; max-width: 500px; border: none; padding: 0;");
 
     var onClick = e => {
+      e.stopPropagation();
       if (e.target === dialog) dialog.close();
     };
 
@@ -918,15 +959,14 @@ class PopupWidget extends Widget {
     return dialog;
   }
 
-  load() {
+  async load() {
     var _dialogParent$lastChi;
 
     var frame = this._createFrame();
 
-    this._initialiseCTA(frame);
-
-    var element = this._findElement();
+    this._initialiseCTA();
 
+    var element = this.container ? this._findElement() : document.body;
     var dialogParent = element.shadowRoot || element;
 
     var dialog = this._createPopupDialog();
@@ -955,12 +995,12 @@ class PopupWidget extends Widget {
     frameDoc.write("<script src=\"" + this.npmCdn + "/resize-observer-polyfill@1.5.x\"></script>");
     frameDoc.close();
 
-    _log$5("Popup template loaded into iframe");
+    _log$6("Popup template loaded into iframe");
 
-    this._setupResizeHandler(frame);
+    await this._setupResizeHandler(frame);
   }
 
-  _setupResizeHandler(frame) {
+  async _setupResizeHandler(frame) {
     var {
       contentWindow
     } = frame;
@@ -992,8 +1032,7 @@ class PopupWidget extends Widget {
   }
 
   open() {
-    var element = this._findElement();
-
+    var element = this.container ? this._findElement() : document.body;
     var parent = element.shadowRoot || element;
     var dialog = parent.querySelector("#" + this.id);
     if (!dialog) throw new Error("Could not determine container div");
@@ -1015,21 +1054,22 @@ class PopupWidget extends Widget {
 
       (_frame$contentDocumen = frame.contentDocument) == null ? void 0 : _frame$contentDocumen.dispatchEvent(new CustomEvent("sq:refresh"));
 
-      this._loadEvent(_sqh);
+      if (this.context.user) {
+        this._loadEvent(_sqh);
 
-      _log$5("Popup opened");
+        _log$6("Popup opened");
+      }
     });
   }
 
   close() {
-    var element = this._findElement();
-
+    var element = this.container ? this._findElement() : document.body;
     var parent = element.shadowRoot || element;
     var dialog = parent.querySelector("#" + this.id);
     if (!dialog) throw new Error("Could not determine container div");
     dialog.close();
 
-    _log$5("Popup closed");
+    _log$6("Popup closed");
   }
 
   _clickedOutside(_ref) {
@@ -1050,16 +1090,33 @@ class PopupWidget extends Widget {
 
 }
 
-var _log$4 = debug.debug("squatch-js:widgets");
+var _log$5 = debug.debug("squatch-js:widgets");
 /**
- *
  * `Widgets` is a factory for creating widgets. It's possible to build your own widgets using the
  * {@link WidgetApi} but most people will prefer to use these easy methods.
- *
+ * @class
  */
 
 
 class Widgets {
+  /**
+   * Instance of {@link WidgetApi}
+   */
+
+  /**
+   * Tenant alias of SaaSquatch tenant
+   */
+
+  /**
+   * SaaSquatch domain for API requests
+   * @default "https://app.referralsaasquatch.com"
+   */
+
+  /**
+   * Hosted CDN for npm packages
+   * @default "https://fast.ssqt.io/npm"
+   */
+
   /**
    * Initialize a new {@link Widgets} instance.
    *
@@ -1085,7 +1142,7 @@ class Widgets {
     this.tenantAlias = config.tenantAlias;
     this.domain = config.domain;
     this.npmCdn = config.npmCdn;
-    this.api = new WidgetApi(config); // listens to a 'submit_email' event in the theme.
+    this.api = new WidgetApi(config);
   }
   /**
    * This function calls the {@link WidgetApi.upsertUser} method, and it renders
@@ -1095,13 +1152,13 @@ class Widgets {
    * @param {Object} config.user The user details
    * @param {string} config.user.id The user id
    * @param {string} config.user.accountId The user account id
-   * @param {WidgetType} config.widgetType The content of the widget.
-   * @param {EngagementMedium} config.engagementMedium How to display the widget.
+   * @param {WidgetType} config.widgetType The content of the widget
+   * @param {EngagementMedium} config.engagementMedium How to display the widget
    * @param {string} config.jwt the JSON Web Token (JWT) that is used to validate the data (can be disabled)
    * @param {HTMLElement | string | undefined} config.container Element to load the widget into
    * @param {string | undefined} config.trigger Trigger element for opening the popup widget
    *
-   * @return {Promise<WidgetResult>} json object if true, with a Widget and user details.
+   * @return {Promise<WidgetResult>} json object if true, with a Widget and user details
    */
 
 
@@ -1114,7 +1171,7 @@ class Widgets {
       return {
         widget: this._renderWidget(response, clean, {
           type: "upsert",
-          user: clean.user || null,
+          user: clean.user,
           engagementMedium: config.engagementMedium,
           container: config.container,
           trigger: config.trigger
@@ -1122,7 +1179,7 @@ class Widgets {
         user: response.user
       };
     } catch (err) {
-      _log$4(err);
+      _log$5(err);
 
       if (err.apiErrorCode) {
         this._renderErrorWidget(err, config.engagementMedium);
@@ -1139,12 +1196,12 @@ class Widgets {
    * @param {Object} config.user The user details
    * @param {string} config.user.id The user id
    * @param {string} config.user.accountId The user account id
-   * @param {WidgetType} config.widgetType The content of the widget.
-   * @param {EngagementMedium} config.engagementMedium How to display the widget.
+   * @param {WidgetType} config.widgetType The content of the widget
+   * @param {EngagementMedium} config.engagementMedium How to display the widget
    * @param {string} config.jwt the JSON Web Token (JWT) that is used
    *                            to validate the data (can be disabled)
    *
-   * @return {Promise<WidgetResult>} json object if true, with a Widget and user details.
+   * @return {Promise<WidgetResult>} json object if true, with a Widget and user details
    */
 
 
@@ -1157,7 +1214,9 @@ class Widgets {
       return {
         widget: this._renderWidget(response, clean, {
           type: "passwordless",
-          engagementMedium: clean.engagementMedium
+          engagementMedium: clean.engagementMedium,
+          container: clean.container,
+          trigger: clean.trigger
         }),
         user: response.user
       };
@@ -1186,7 +1245,7 @@ class Widgets {
         var response = await this.api.squatchReferralCookie();
         input(response);
       } catch (e) {
-        _log$4("Autofill error", e);
+        _log$5("Autofill error", e);
 
         throw new Error(e);
       }
@@ -1202,7 +1261,7 @@ class Widgets {
       // Only use the first element found
       elem = elems[0];
     } else {
-      _log$4("Element id/class or function missing");
+      _log$5("Element id/class or function missing");
 
       throw new Error("Element id/class or function missing");
     }
@@ -1226,15 +1285,17 @@ class Widgets {
 
 
   _renderWidget(response, config, context) {
-    _log$4("Rendering Widget...");
+    var _opts$widget;
+
+    _log$5("Rendering Widget...");
 
     if (!response) throw new Error("Unable to get a response");
     var widget;
     var displayOnLoad = !!config.displayOnLoad;
-    var opts = response.jsOptions || "";
+    var opts = response.jsOptions || {};
     var params = {
       content: response.template,
-      type: config.widgetType || opts.widget.defaultWidgetType,
+      type: config.widgetType || ((_opts$widget = opts.widget) == null ? void 0 : _opts$widget.defaultWidgetType),
       api: this.api,
       domain: this.domain,
       npmCdn: this.npmCdn,
@@ -1244,19 +1305,21 @@ class Widgets {
     if (opts.widgetUrlMappings) {
       opts.widgetUrlMappings.forEach(rule => {
         if (Widgets._matchesUrl(rule.url)) {
-          if (rule.widgetType !== "CONVERSION_WIDGET" || response.user.referredBy && response.user.referredBy.code) {
+          var _response$user, _response$user$referr;
+
+          if (rule.widgetType !== "CONVERSION_WIDGET" || (_response$user = response.user) != null && (_response$user$referr = _response$user.referredBy) != null && _response$user$referr.code) {
             displayOnLoad = rule.displayOnLoad;
 
-            _log$4("Display " + rule.widgetType + " on " + rule.url);
+            _log$5("Display " + rule.widgetType + " on " + rule.url);
           } else {
-            _log$4("Don't display " + rule.widgetType + " when no referral on widget rule match " + rule.url);
+            _log$5("Don't display " + rule.widgetType + " when no referral on widget rule match " + rule.url);
           }
         }
       });
     }
 
     if (opts.fuelTankAutofillUrls) {
-      _log$4("We found a fuel tank autofill!");
+      _log$5("We found a fuel tank autofill!");
 
       opts.fuelTankAutofillUrls.forEach(_ref => {
         var {
@@ -1265,15 +1328,19 @@ class Widgets {
         } = _ref;
 
         if (Widgets._matchesUrl(url)) {
-          _log$4("Fuel Tank URL matches");
+          var _response$user2, _response$user2$refer;
 
-          if (response.user.referredBy && response.user.referredBy.code) {
+          _log$5("Fuel Tank URL matches");
+
+          if ((_response$user2 = response.user) != null && (_response$user2$refer = _response$user2.referredBy) != null && _response$user2$refer.code) {
             var formAutofill = document.querySelector(formSelector);
 
             if (formAutofill) {
-              formAutofill.value = response.user.referredBy.referredReward.fuelTankCode || "";
+              var _response$user$referr2;
+
+              formAutofill.value = ((_response$user$referr2 = response.user.referredBy.referredReward) == null ? void 0 : _response$user$referr2.fuelTankCode) || "";
             } else {
-              _log$4(new Error("Element with id/class " + formSelector + " was not found."));
+              _log$5(new Error("Element with id/class " + formSelector + " was not found."));
             }
           }
         }
@@ -1281,15 +1348,9 @@ class Widgets {
     }
 
     if (config.engagementMedium === "EMBED") {
-      this._renderEmbedWidget(params, params.context.container);
-    } else if (config.engagementMedium === "POPUP") {
-      widget = this._renderPopupWidget(params);
-      if (displayOnLoad) widget.open();
+      widget = this._renderEmbedWidget(params);
     } else {
-      _log$4("display popup on load");
-
-      widget = new PopupWidget(params);
-      widget.load();
+      widget = this._renderPopupWidget(params);
       if (displayOnLoad) widget.open();
     }
 
@@ -1302,8 +1363,8 @@ class Widgets {
     return widget;
   }
 
-  _renderEmbedWidget(params, container) {
-    var widget = new EmbedWidget(params);
+  _renderEmbedWidget(params) {
+    var widget = new EmbedWidget(params, params.context.container);
     widget.load();
     return widget;
   }
@@ -1326,7 +1387,7 @@ class Widgets {
       message
     } = props;
 
-    _log$4(new Error(apiErrorCode + " (" + rsCode + ") " + message));
+    _log$5(new Error(apiErrorCode + " (" + rsCode + ") " + message));
 
     var params = {
       content: "error",
@@ -1441,28 +1502,32 @@ function _validateTrackOptions(raw) {
 }
 
 /** @hidden */
+
 function asyncLoad() {
-  var loaded = window.squatch || null;
-  var cached = window._squatch || null;
+  var _window;
 
-  if (loaded && cached) {
-    var ready = cached.ready || [];
-    ready.forEach(cb => setTimeout(() => cb(), 0));
-    setTimeout(() => window.squatch._auto(), 0); // @ts-ignore -- intetionally deletes `_squatch` to cleanup initialization
+  var namespace = window[IMPACT_NAMESPACE] ? IMPACT_NAMESPACE : DEFAULT_NAMESPACE;
+  var cached = ((_window = window["_" + namespace]) == null ? void 0 : _window.ready) || [];
+  var declarativeCache = window.impactOnReady || window.squatchOnReady;
+  var readyFns = [...cached, declarativeCache].filter(a => !!a); // Run all of this in a setTimeout because we need to wait for the squatch module to finish loading
 
-    window._squatch = undefined;
+  setTimeout(() => {
+    // Set window.impact as an alias for window.squatch.
+    window[IMPACT_NAMESPACE] = window[DEFAULT_NAMESPACE]; // Run all the ready functions in a set timeout to they happen after namespace aliasing.
 
-    try {
-      delete window._squatch;
-    } catch (e) {
-      throw e;
-    }
-  }
+    readyFns.forEach(cb => cb()); // Perform auto popup
+
+    window[DEFAULT_NAMESPACE]._auto(); // @ts-ignore -- intentionally deletes `_squatch` to cleanup initialization
+
+
+    window["_" + namespace] = undefined;
+    delete window["_" + namespace];
+  }, 0);
 }
 
 /** @hidden */
 
-var _log$3 = debug.debug("squatch-js");
+var _log$4 = debug.debug("squatch-js");
 
 var isObject = item => typeof item === "object" && !Array.isArray(item);
 
@@ -1515,7 +1580,7 @@ function _pushCookie() {
     try {
       paramsJSON = JSON.parse(b64decode(refParam));
     } catch (error) {
-      _log$3("Unable to decode params", error); // don't merge invalid params
+      _log$4("Unable to decode params", error); // don't merge invalid params
 
 
       return;
@@ -1524,26 +1589,26 @@ function _pushCookie() {
     try {
       existingCookie = JSON.parse(b64decode(Cookies__default['default'].get("_saasquatch")));
 
-      _log$3("existing cookie", existingCookie);
+      _log$4("existing cookie", existingCookie);
     } catch (error) {
-      _log$3("Unable to retrieve cookie", error);
+      _log$4("Unable to retrieve cookie", error);
     } // don't merge if there's no existing object
 
 
     try {
       var domain = getTopDomain();
 
-      _log$3("domain retrieved:", domain);
+      _log$4("domain retrieved:", domain);
 
       if (existingCookie) {
         var newCookie = deepMerge(existingCookie, paramsJSON);
         reEncodedCookie = b64encode(JSON.stringify(newCookie));
 
-        _log$3("cookie to store:", newCookie);
+        _log$4("cookie to store:", newCookie);
       } else {
         reEncodedCookie = b64encode(JSON.stringify(paramsJSON));
 
-        _log$3("cookie to store:", paramsJSON);
+        _log$4("cookie to store:", paramsJSON);
       }
 
       Cookies__default['default'].set("_saasquatch", reEncodedCookie, {
@@ -1554,14 +1619,14 @@ function _pushCookie() {
         path: "/"
       });
     } catch (error) {
-      _log$3("Unable to set cookie", error);
+      _log$4("Unable to set cookie", error);
     }
   }
 }
 
 /** @hidden */
 
-var _log$2 = debug.debug("squatch-js");
+var _log$3 = debug.debug("squatch-js");
 
 function _getAutoConfig(configIn) {
   var queryString = window.location.search;
@@ -1569,7 +1634,7 @@ function _getAutoConfig(configIn) {
   var refParam = urlParams.get("_saasquatchExtra") || "";
 
   if (!refParam) {
-    _log$2("No _saasquatchExtra param");
+    _log$3("No _saasquatchExtra param");
 
     return;
   }
@@ -1579,7 +1644,7 @@ function _getAutoConfig(configIn) {
   try {
     raw = JSON.parse(b64decode(refParam));
   } catch (e) {
-    _log$2("Unable to decode _saasquatchExtra config");
+    _log$3("Unable to decode _saasquatchExtra config");
 
     return;
   }
@@ -1591,7 +1656,7 @@ function _getAutoConfig(configIn) {
   } = convertExtraToConfig(raw);
 
   if (!domain || !tenantAlias || !widgetConfig) {
-    _log$2("_saasquatchExtra did not have an expected structure");
+    _log$3("_saasquatchExtra did not have an expected structure");
 
     return undefined;
   }
@@ -1634,7 +1699,7 @@ function convertExtraToConfig(obj) {
   };
 }
 
-var _log$1 = debug.debug("squatch-js:decodeJwt");
+var _log$2 = debug.debug("squatch-js:decodeUserJwt");
 
 function decodeUserJwt(tokenStr) {
   try {
@@ -1645,28 +1710,88 @@ function decodeUserJwt(tokenStr) {
     var jsonStr = b64decode(base64Url);
     return (_JSON$parse = JSON.parse(jsonStr)) == null ? void 0 : _JSON$parse.user;
   } catch (e) {
-    _log$1(e);
+    _log$2(e);
 
     return null;
   }
 }
 
-debug__default['default']("sqh:DeclarativeWidget");
+var _log$1 = debug__default['default']("squatch-js:DeclarativeWidget");
+/**
+ * Abstract class for building web-components that render SaaSquatch widgets to the DOM
+ * @abstract
+ * @example
+ * class TestWidgetElement extends DeclarativeWidget {}
+ * const testWidget = new TestWidgetElement()
+ * testWidget.widgetType = 'w/widget-type'
+ * testWidget.type = 'EMBED'
+ * testWidget.renderWidget()
+ */
+
 
 class DeclarativeWidget extends HTMLElement {
+  /**
+   * Configuration overrides
+   * @default window.squatchConfig
+   */
+
+  /**
+   * Signed JWT containing user information
+   * @default window.squatchToken
+   */
+
+  /**
+   * Tenant alias of SaaSquatch tenant
+   * @default window.squatchTenant
+   */
+
+  /**
+   * widgetType of widget to load
+   */
+
+  /**
+   * Locale to render the widget in
+   */
+
+  /**
+   * Instance of {@link WidgetApi}
+   */
+
+  /**
+   * Instance of {@link AnalyticsApi}
+   */
+
+  /**
+   * Instance of {@link EmbedWidget} or {@link PopupWidget}
+   */
+
+  /**
+   * Determines whether to render the widget as an embedding widget or popup widget
+   */
+
+  /**
+   * Container element to contain the widget iframe
+   * @default this
+   */
+
+  /**
+   * Flag for if the component has been loaded or not
+   * @hidden
+   */
   constructor() {
     super();
     this.config = void 0;
     this.token = void 0;
     this.tenant = void 0;
     this.widgetType = void 0;
+    this.locale = void 0;
     this.widgetApi = void 0;
     this.analyticsApi = void 0;
-    this.type = void 0;
     this.widgetInstance = void 0;
+    this.type = void 0;
     this.container = void 0;
     this.element = void 0;
-    this._hasChildren = void 0;
+    this.loaded = void 0;
 
     this._setWidget = (template, config) => {
       var _this$config;
@@ -1676,18 +1801,21 @@ class DeclarativeWidget extends HTMLElement {
         content: template,
         context: {
           type: config.type,
+          user: config.user,
+          container: this.container || undefined,
           engagementMedium: this.type
         },
         type: this.widgetType,
         domain: ((_this$config = this.config) == null ? void 0 : _this$config.domain) || DEFAULT_DOMAIN,
         npmCdn: DEFAULT_NPM_CDN,
-        container: this.container || this
+        container: this
       };
 
       if (this.type === "EMBED") {
         return new EmbedWidget(params);
       } else {
-        return new PopupWidget(params, this.firstChild ? null : undefined);
+        var useFirstChildTrigger = this.firstChild ? null : undefined;
+        return new PopupWidget(params, useFirstChildTrigger);
       }
     };
 
@@ -1698,28 +1826,31 @@ class DeclarativeWidget extends HTMLElement {
         api: this.widgetApi,
         content: "error",
         context: {
-          type: "error"
+          type: "error",
+          container: this.container || undefined
         },
         type: "ERROR_WIDGET",
         domain: ((_this$config2 = this.config) == null ? void 0 : _this$config2.domain) || DEFAULT_DOMAIN,
         npmCdn: DEFAULT_NPM_CDN,
-        container: this.container || this
+        container: this
       };
 
       if (this.type === "EMBED") {
         return new EmbedWidget(params);
       } else {
-        return new PopupWidget(params, this.firstChild ? null : undefined);
+        var useFirstChildTrigger = this.firstChild ? null : undefined;
+        return new PopupWidget(params, useFirstChildTrigger);
       }
     };
 
+    this.reload = this.renderWidget;
     this.show = this.open;
     this.hide = this.close;
     this.attachShadow({
       mode: "open"
-    }).innerHTML = "<style>:host { display: contents; }</style><slot></slot>";
-    this.config = window.squatchConfig;
-    this.token = window.squatchToken;
+    }).innerHTML = "<style>:host { display: block; }</style><slot></slot>";
+    this.config = getConfig();
+    this.token = getToken();
     this.tenant = window.squatchTenant;
     this.container = this;
   }
@@ -1727,7 +1858,7 @@ class DeclarativeWidget extends HTMLElement {
   _setupApis(config) {
     var _this$config3, _this$config4;
 
-    if (!this.tenant) throw new Error("Requires tenantAlias");
+    if (!this.tenant) throw new Error("tenantAlias not provided");
     this.widgetApi = new WidgetApi({
       tenantAlias: (config == null ? void 0 : config.tenantAlias) || this.tenant,
       domain: (config == null ? void 0 : config.domain) || ((_this$config3 = this.config) == null ? void 0 : _this$config3.domain) || DEFAULT_DOMAIN
@@ -1738,15 +1869,14 @@ class DeclarativeWidget extends HTMLElement {
   }
 
   async renderPasswordlessVariant() {
-    var _configs$widgetConfig, _configs$widgetConfig2;
-
-    var configs = _getAutoConfig();
+    this._setupApis();
 
-    this._setupApis(configs == null ? void 0 : configs.squatchConfig);
+    _log$1("Rendering as an Instant Access widget");
 
     return await this.widgetApi.render({
-      engagementMedium: (configs == null ? void 0 : (_configs$widgetConfig = configs.widgetConfig) == null ? void 0 : _configs$widgetConfig.engagementMedium) || this.type,
-      widgetType: (configs == null ? void 0 : (_configs$widgetConfig2 = configs.widgetConfig) == null ? void 0 : _configs$widgetConfig2.widgetType) || this.widgetType
+      engagementMedium: this.type,
+      widgetType: this.widgetType,
+      locale: this.locale
     }).then(res => this._setWidget(res.template, {
       type: "passwordless"
     })).catch(this.setErrorWidget);
@@ -1756,21 +1886,35 @@ class DeclarativeWidget extends HTMLElement {
     this._setupApis();
 
     var userObj = decodeUserJwt(this.token);
-    if (!userObj) throw new Error("Could not load user information from jwt");
+
+    if (!userObj) {
+      return this.setErrorWidget(Error("No user object in token."));
+    }
+
+    _log$1("Rendering as a Verified widget");
+
     var widgetInstance = await this.widgetApi.upsertUser({
       user: userObj,
+      locale: this.locale,
       engagementMedium: this.type,
       widgetType: this.widgetType,
       jwt: this.token
     }).then(res => this._setWidget(res.template, {
-      type: "upsert"
+      type: "upsert",
+      user: userObj
     })).catch(this.setErrorWidget);
     return widgetInstance;
   }
 
+  /**
+   * Fetches widget content from SaaSquatch and builds a Widget instance to support rendering the widget in the DOM
+   * @returns Instance of either {@link EmbedWidget} or {@link PopupWidget} depending on `this.type`
+   * @throws Throws an Error if `widgetType` is undefined
+   */
   async getWidgetInstance() {
     var widgetInstance;
     this.widgetType = this.getAttribute("widget") || undefined;
+    this.locale = this.getAttribute("locale") || this.locale;
     if (!this.widgetType) throw new Error("No widget has been specified");
 
     if (!this.token) {
@@ -1779,82 +1923,130 @@ class DeclarativeWidget extends HTMLElement {
       widgetInstance = await this.renderUserUpsertVariant();
     }
 
-    if (!widgetInstance) throw new Error("Could not create widget.");
     this.widgetInstance = widgetInstance;
     return widgetInstance;
   }
+  /**
+   * Calls {@link getWidgetInstance} to build the Widget instance and loads the widget iframe into the DOM
+   */
+
 
   async renderWidget() {
     await this.getWidgetInstance();
     await this.widgetInstance.load();
   }
+  /**
+   * Builds a Widget instance for the default error widget
+   * @returns Instance of either {@link EmbedWidget} or {@link PopupWidget} depending on `this.type`
+   */
+
 
+  /**
+   * Calls `open` method of `widgetInstance`
+   * @throws Throws an Error if called before the widget has loaded
+   */
   open() {
+    if (!this.widgetInstance) throw new Error("Widget has not loaded yet");
     this.widgetInstance.open();
   }
+  /**
+   * Calls `close` method of `widgetInstance`
+   * @throws Throws an Error if called before the widget has loaded
+   */
+
 
   close() {
+    if (!this.widgetInstance) throw new Error("Widget has not loaded yet");
     this.widgetInstance.close();
   }
 
 }
 
+/**
+ * Base class for `squatch-embed` web-component
+ * @extends {DeclarativeWidget}
+ * @class
+ * @example
+ * window.createCustomElement('squatch-embed', DeclarativeEmbedWidget)
+ * const widget = document.querySelector('squatch-embed') as DeclarativeEmbedWidget
+ * widget.open()
+ * widget.close()
+ * widget.reload()
+ */
+
 class DeclarativeEmbedWidget extends DeclarativeWidget {
   constructor() {
     super();
+    /**
+     * @static
+     */
+
     this.type = "EMBED";
+    this.loaded = false;
   }
 
   static get observedAttributes() {
-    return ["widget", "container"];
+    return ["widget", "locale"];
   }
 
   attributeChangedCallback(attr, oldVal, newVal) {
-    if (oldVal === newVal || !oldVal) return; // nothing to do
+    if (oldVal === newVal || !this.loaded) return; // nothing to do
 
     switch (attr) {
+      case "locale":
       case "widget":
         this.connectedCallback();
         break;
-      // Specific to embed widgets
-
-      case "container":
-        if (this.widgetInstance._findElement()) this.close();
-        this.connectedCallback();
-        break;
     }
   }
 
   async connectedCallback() {
     var _ref, _this$shadowRoot;
 
-    this.container = this.getAttribute("container") || this;
+    this.loaded = true;
+    this.container = this.getAttribute("container");
     await this.renderWidget();
     var slot = (_ref = this.shadowRoot && Array.from(this.shadowRoot.children)) == null ? void 0 : _ref.find(c => c.tagName === "SLOT");
     if (slot) (_this$shadowRoot = this.shadowRoot) == null ? void 0 : _this$shadowRoot.removeChild(slot);
   }
 
 }
+/**
+ * Base class for `squatch-popup` web-component
+ * @extends {DeclarativeWidget}
+ * @class
+ * @example
+ * window.createCustomElement('squatch-popup', DeclarativePopupWidget)
+ * const widget = document.querySelector('squatch-popup') as DeclarativePopupWidget
+ * widget.open()
+ * widget.close()
+ * widget.reload()
+ */
+
 class DeclarativePopupWidget extends DeclarativeWidget {
   constructor() {
     super();
+    /**
+     * @static
+     */
+
     this.type = "POPUP";
+    this.loaded = false;
     this.addEventListener("click", e => {
-      e.stopPropagation(); // SQUATCH-POPUP target means something in the shadowDOM was clicked (i.e. the dialog element)
-
-      if (e.target.tagName !== "SQUATCH-POPUP") this.open();
+      e.stopPropagation();
+      this.open();
     });
   }
 
   static get observedAttributes() {
-    return ["widget", "id", "open"];
+    return ["widget", "locale"];
   }
 
   attributeChangedCallback(attr, oldVal, newVal) {
-    if (oldVal === newVal || !oldVal) return; // nothing to do
+    if (oldVal === newVal || !this.loaded) return; // nothing to do
 
     switch (attr) {
-      case "open":
+      case "locale":
       case "widget":
         this.connectedCallback();
         break;
@@ -1862,13 +2054,26 @@ class DeclarativePopupWidget extends DeclarativeWidget {
   }
 
   async connectedCallback() {
+    this.loaded = true;
+    this.container = this.getAttribute("container");
     await this.renderWidget();
     if (this.getAttribute("open") !== null) this.open();
   }
 
 }
-window.customElements.define("squatch-embed", DeclarativeEmbedWidget);
-window.customElements.define("squatch-popup", DeclarativePopupWidget);
+
+class SquatchEmbed extends DeclarativeEmbedWidget {}
+
+class SquatchPopup extends DeclarativePopupWidget {}
+
+class ImpactEmbed extends DeclarativeEmbedWidget {}
+
+class ImpactPopup extends DeclarativePopupWidget {}
+
+window.customElements.define("squatch-embed", SquatchEmbed);
+window.customElements.define("impact-embed", ImpactEmbed);
+window.customElements.define("squatch-popup", SquatchPopup);
+window.customElements.define("impact-popup", ImpactPopup);
 
 // @ts-check
 function help() {
@@ -1896,10 +2101,14 @@ var _events = null;
  * Read the {@link WidgetApi} docs.
  *
  * @returns WidgetApi static instance
+ * @example
+ * squatch.api().render({ ... })
+ * squatch.api().upsertUser({ ... })
+ * squatch.api().squatchReferralCookie()
  */
 
 function api() {
-  if (!_api) exports.init({});
+  if (!_api) init({});
   return _api;
 }
 /**
@@ -1908,10 +2117,14 @@ function api() {
  * Read the {@link Widgets} docs.
  *
  * @returns static instance
+ * @example
+ * squatch.widgets().render({ widgetType: "w/widget-type" })
+ * squatch.widgets().upsertUser({ user: { ... }, widgetType: "w/widget-type" })
+ * squatch.widgets().autofill(".referral-code")
  */
 
 function widgets() {
-  if (!_widgets) exports.init({});
+  if (!_widgets) init({});
   return _widgets;
 }
 /**
@@ -1920,14 +2133,24 @@ function widgets() {
  * Read the {@link EventsApi} docs.
  *
  * @returns EventsApi static instance
+ *
+ * @example
+ * squatch.events().track({ ... })
  */
 
 function events() {
-  if (!_events) exports.init({});
+  if (!_events) init({});
   return _events;
 }
 /**
  * Entry-point for high level API to render a widget using the instance of {@link Widgets} created when you call {@link #init init}.
+ *
+ * Read the {@link Widgets.render} docs.
+ *
+ * @example
+ * squatch.widget().then(res => {
+ *   const widget = res.widget
+ * }).catch(e => console.error("Did not render widget:", e))
  */
 
 function widget(widgetConfig) {
@@ -1937,6 +2160,9 @@ function widget(widgetConfig) {
 }
 /**
  * Extracts widget configuration from `_saasquatchExtra` UTM parameter. Initialises `squatch` and renders the widget as a {@link PopupWidget} via static instanct of {@link Widgets}.
+ *
+ * Called by default on startup via the loader script.
+ * @private
  */
 
 function _auto(configIn) {
@@ -1963,7 +2189,9 @@ function _auto(configIn) {
  * @param config Configuration details
  *
  * @example
- * squatch.init({tenantAlias:'test_basbtabstq51v'});
+ * squatch.init({
+ *   tenantAlias:'test_basbtabstq51v',
+ * });
  */
 
 function init(configIn) {
@@ -1972,6 +2200,8 @@ function init(configIn) {
 
   if (config.tenantAlias.match("^test") || config.debug) {
     debug.debug.enable("squatch-js*");
+  } else {
+    debug.debug.disable();
   }
 
   _log("initializing ...");
@@ -1995,7 +2225,7 @@ function init(configIn) {
  * @example
  * squatch.ready(function() {
  *   console.log("ready!");
- *   squatch.api().upsertUser();
+ *   squatch.api().upsertUser({ ... });
  * });
  */
 
@@ -2008,30 +2238,15 @@ function ready(fn) {
  *
  * @param {string} selector Element class/id
  * @returns {void}
- */
-
-function autofill(selector) {
-  // @ts-ignore -- will throw occasionally throw a null pointer exception at runtime
-  widgets().autofill(selector);
-}
-/**
- * Overrides the default function that submits the user email. If you have
- * Security enabled, the email needs to be signed before it's submitted.
- *
- * @param {function} fn Callback function for the 'submit_email' event.
- * @returns {void}
  *
  * @example
- * squatch.submitEmail(function(target, widget, email) {
- *   // Sign email and generate jwt token
- *   var jwt = 'token';
- *   widget.reload(email, jwt);
- * });
+ * squatch.autofill("input.referral-code")
+ * squatch.autofill("input#referral-code")
  */
 
-function submitEmail(fn) {
+function autofill(selector) {
   // @ts-ignore -- will throw occasionally throw a null pointer exception at runtime
-  widgets().submitEmail(fn);
+  widgets().autofill(selector);
 }
 /**
  * Manually set the _saasquatch cookie as a 1st party cookie if available as a URL parameter on the current page.
@@ -2071,7 +2286,6 @@ exports.help = help;
 exports.init = init;
 exports.pushCookie = pushCookie;
 exports.ready = ready;
-exports.submitEmail = submitEmail;
 exports.widget = widget;
 exports.widgets = widgets;
 //# sourceMappingURL=squatch.js.map