Files
calendar/packages/embeds/embed-core/src/Inline/inline.ts
T

33 lines
1.3 KiB
TypeScript

import { CalWindow } from "../embed";
import loaderCss from "../loader.css";
import { getErrorString } from "../utils";
import inlineHtml from "./inlineHtml";
export class Inline extends HTMLElement {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
//@ts-ignore
static get observedAttributes() {
return ["loading"];
}
attributeChangedCallback(name: string, oldValue: string, newValue: string) {
if (name === "loading") {
if (newValue == "done") {
(this.shadowRoot!.querySelector(".loader")! as HTMLElement).style.display = "none";
} else if (newValue === "failed") {
(this.shadowRoot!.querySelector(".loader")! as HTMLElement).style.display = "none";
(this.shadowRoot!.querySelector("#error")! as HTMLElement).style.display = "block";
(this.shadowRoot!.querySelector("slot")! as HTMLElement).style.visibility = "hidden";
const errorString = getErrorString(this.dataset.errorCode);
(this.shadowRoot!.querySelector("#error")! as HTMLElement).innerText = errorString;
}
}
}
constructor() {
super();
this.attachShadow({ mode: "open" });
this.shadowRoot!.innerHTML = `<style>${
(window as CalWindow).Cal!.__css
}</style><style>${loaderCss}</style>${inlineHtml}`;
}
}