@saasquatch/squatch-js 2.8.3-1 → 2.8.3-2

package/dist/squatch.esm.js

@@ -667,7 +667,7 @@ class pe {
     const e = document.createElement("iframe");
     return e.squatchJsApi = this, e.id = "squatchFrame", e.width = "100%", e.src = "about:blank", e.scrolling = "no", e.setAttribute(
       "style",
-      "border: 0; background-color: none; width: 1px; min-width: 100%;"
+      "border: 0; background-color: none; width: 1px; min-width: 100%; display: block;"
     ), t != null && t.minWidth && (e.style.minWidth = t.minWidth), t != null && t.maxWidth && (e.style.maxWidth = t.maxWidth), (t != null && t.maxWidth || t != null && t.minWidth) && (e.style.width = "100%"), t != null && t.initialHeight && (e.height = String(t.initialHeight)), e;
   }
   _findFrame() {
@@ -891,7 +891,7 @@ function Le() {
       });
     });
   }
-  document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", e) : e();
+  document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", e) : setTimeout(e, 0);
 }
 const E = k("squatch-js:EMBEDwidget");
 class O extends pe {
@@ -931,11 +931,11 @@ class O extends pe {
       </style>` : ""}
       ${this._getSkeletonPreloadHTML(n, (ie = e == null ? void 0 : e.color) == null ? void 0 : ie.backgroundColor)}
       ${this.content}
-
+      <script src="${this.npmCdn}/resize-observer-polyfill@1.5.x"><\/script>
       `), u.close(), Q(u, async () => {
       const oe = h.squatch || h.widgetIdent;
       d.height = i;
-      const ye = new ResizeObserver((ke) => {
+      const ye = new h.ResizeObserver((ke) => {
         for (const be of ke) {
           const { height: xe } = be.contentRect;
           d.height = xe;
@@ -1016,8 +1016,8 @@ class j extends pe {
   }
   async load() {
     var p, g, m, w, b, f, _;
-    const e = (g = (p = this.context.widgetConfig) == null ? void 0 : p.values) == null ? void 0 : g.brandingConfig, n = (e == null ? void 0 : e.loadingHeight) || 500, i = (m = this.content) == null ? void 0 : m.includes("mint-components"), s = this._createFrame({ initialHeight: n });
-    this._initialiseCTA();
+    const e = (g = (p = this.context.widgetConfig) == null ? void 0 : p.values) == null ? void 0 : g.brandingConfig, n = (e == null ? void 0 : e.loadingHeight) || 500, i = (m = this.content) == null ? void 0 : m.includes("mint-components"), s = this._createFrame();
+    s.style.height = n + "px", this._initialiseCTA();
     const r = this.container ? this._findElement() : document.body, a = (r == null ? void 0 : r.shadowRoot) || r, d = this._createPopupDialog(e);
     d.appendChild(s), ((w = a.lastChild) == null ? void 0 : w.nodeName) === "DIALOG" ? a.replaceChild(d, a.lastChild) : a.appendChild(d);
     const { contentWindow: c } = s;
@@ -1042,19 +1042,21 @@ class j extends pe {
       </style>` : ""}
       ${this._getSkeletonPreloadHTML(i, (_ = e == null ? void 0 : e.color) == null ? void 0 : _.backgroundColor)}
       ${this.content}
-
-      `), h.close(), T("Popup template loaded into iframe"), await this._setupResizeHandler(s, n);
+      <script src="${this.npmCdn}/resize-observer-polyfill@1.5.x"><\/script>
+      `), h.close(), T("Popup template loaded into iframe"), await this._setupResizeHandler(s);
   }
-  async _setupResizeHandler(e, n) {
-    const { contentWindow: i } = e;
-    if (!i)
+  async _setupResizeHandler(e) {
+    const { contentWindow: n } = e;
+    if (!n)
       throw new Error("Frame needs a content window");
-    const s = i.document;
-    Q(s, async () => {
-      s.body.style.overflowY = "hidden", e.height = n || s.body.offsetHeight, new ResizeObserver((a) => {
+    const i = n.document;
+    Q(i, async () => {
+      i.body.style.overflowY = "hidden";
+      let s = !0;
+      new n.ResizeObserver((a) => {
         for (const d of a) {
           const { top: c, bottom: h } = d.contentRect, u = h + c;
-          e.height = u + "", d.target.style = "";
+          u <= 0 || (s ? (s = !1, e.style.height = "0", e.height = i.body.scrollHeight + "", e.style.height = "") : e.height = u + "", d.target.style = "");
         }
       }).observe(await this._findInnerContainer(e));
     });