@saasquatch/squatch-js 2.8.2-5 → 2.8.2-7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/squatch.cjs.js +10 -2
- package/dist/squatch.cjs.js.map +1 -1
- package/dist/squatch.esm.js +10 -2
- package/dist/squatch.esm.js.map +1 -1
- package/dist/squatch.js +10 -2
- package/dist/squatch.js.map +1 -1
- package/dist/squatch.min.js +1 -1
- package/package.json +1 -1
package/dist/squatch.cjs.js
CHANGED
|
@@ -2490,21 +2490,29 @@ class DeclarativeEmbedWidget extends DeclarativeWidget {
|
|
|
2490
2490
|
// }
|
|
2491
2491
|
// }
|
|
2492
2492
|
async connectedCallback() {
|
|
2493
|
+
var _a2;
|
|
2493
2494
|
this.loaded = true;
|
|
2494
2495
|
this.container = this.getAttribute("container");
|
|
2495
|
-
const
|
|
2496
|
+
const skeletonHTML = `
|
|
2496
2497
|
<div>
|
|
2497
2498
|
<h1>Dynamic Content</h1>
|
|
2498
2499
|
<p>This content was dynamically added to the widget before it loaded.</p>
|
|
2499
2500
|
</div>
|
|
2500
2501
|
`;
|
|
2502
|
+
const skeletonContainer = document.createElement("div");
|
|
2503
|
+
skeletonContainer.id = "loading-skeleton";
|
|
2504
|
+
skeletonContainer.innerHTML = skeletonHTML;
|
|
2501
2505
|
if (!this.shadowRoot) {
|
|
2502
2506
|
this.attachShadow({ mode: "open" });
|
|
2503
2507
|
}
|
|
2504
2508
|
if (this.shadowRoot) {
|
|
2505
|
-
this.shadowRoot.innerHTML =
|
|
2509
|
+
this.shadowRoot.innerHTML = skeletonHTML;
|
|
2506
2510
|
}
|
|
2507
2511
|
await this.renderWidget();
|
|
2512
|
+
const loadingElement = (_a2 = this.shadowRoot) == null ? void 0 : _a2.getElementById("loading-skeleton");
|
|
2513
|
+
if (loadingElement) {
|
|
2514
|
+
loadingElement.remove();
|
|
2515
|
+
}
|
|
2508
2516
|
if (this.getAttribute("open") !== null) this.open();
|
|
2509
2517
|
}
|
|
2510
2518
|
}
|