@saasquatch/squatch-js 2.8.0 → 2.8.2-1

package/dist/squatch.js

@@ -892,6 +892,9 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       if ((options == null ? void 0 : options.maxWidth) || (options == null ? void 0 : options.minWidth)) {
         frame.style.width = "100%";
       }
+      if (options == null ? void 0 : options.initialHeight) {
+        frame.height = options.initialHeight;
+      }
       return frame;
     }
     _findFrame() {
@@ -1115,21 +1118,31 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       if (container) this.container = container;
     }
     async load() {
-      var _a2, _b, _c, _d, _e;
+      var _a2, _b, _c, _d, _e, _f, _g, _h;
       const brandingConfig = (_b = (_a2 = this.context.widgetConfig) == null ? void 0 : _a2.values) == null ? void 0 : _b.brandingConfig;
-      const sizes = (_c = brandingConfig == null ? void 0 : brandingConfig.widgetSize) == null ? void 0 : _c.embeddedWidgets;
+      const initialHeight = (_e = (_d = (_c = this.context.widgetConfig) == null ? void 0 : _c.values) == null ? void 0 : _d.brandingConfig) == null ? void 0 : _e.loadingHeight;
+      const sizes = (_f = brandingConfig == null ? void 0 : brandingConfig.widgetSize) == null ? void 0 : _f.embeddedWidgets;
       const maxWidth = (sizes == null ? void 0 : sizes.maxWidth) ? formatWidth(sizes.maxWidth) : "";
       const minWidth = (sizes == null ? void 0 : sizes.minWidth) ? formatWidth(sizes.minWidth) : "";
-      const frame = this._createFrame({ minWidth, maxWidth });
+      console.log({
+        brandingConfig,
+        initialHeight,
+        widgetConfig: this.context.widgetConfig
+      });
+      const frame = this._createFrame({
+        minWidth,
+        maxWidth,
+        initialHeight
+      });
       const element = this._findElement();
-      if ((_d = this.context) == null ? void 0 : _d.container) {
+      if ((_g = this.context) == null ? void 0 : _g.container) {
         element.style.visibility = "hidden";
         element.style.height = "0";
         element.style["overflow-y"] = "hidden";
       }
       if (this.container) {
         if (element.shadowRoot) {
-          if (((_e = element.shadowRoot.lastChild) == null ? void 0 : _e.nodeName) === "IFRAME") {
+          if (((_h = element.shadowRoot.lastChild) == null ? void 0 : _h.nodeName) === "IFRAME") {
             element.shadowRoot.replaceChild(frame, element.shadowRoot.lastChild);
           } else {
             element.shadowRoot.appendChild(frame);
@@ -1148,14 +1161,19 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       }
       const frameDoc = contentWindow.document;
       frameDoc.open();
-      frameDoc.write(this.content);
-      frameDoc.write(
-        `<script src="${this.npmCdn}/resize-observer-polyfill@1.5.x"><\/script>`
-      );
+      console.log({ content: this.content });
+      frameDoc.write(`
+      <script src="${this.npmCdn}/resize-observer-polyfill@1.5.x"><\/script>
+      ${this.content}
+            <style data-styles>
+      html:not(.hydrated) { visibility:hidden; }
+      </style>
+      `);
       frameDoc.close();
       domready(frameDoc, async () => {
         const _sqh = contentWindow.squatch || contentWindow.widgetIdent;
-        frame.height = frameDoc.body.scrollHeight;
+        frame.height = initialHeight || frameDoc.body.scrollHeight;
+        console.log({ height: frameDoc.body.scrollHeight });
         const ro = new contentWindow["ResizeObserver"]((entries) => {
           for (const entry of entries) {
             const { height } = entry.contentRect;