import { LitElement, html } from "lit" import { unsafeHTML } from "lit/directives/unsafe-html.js" export default class Element extends LitElement { static override properties = { type: { type: String }, } type!: "info" | "tip" | "warning" | "danger" constructor() { super() this.type = "info" } override render() { return html`

${unsafeHTML(icons[this.type])}

` } } if (typeof customElements !== "undefined" && !customElements.get("doc-callout")) { customElements.define("doc-callout", Element) } const colors = { info: { background: "#dff7fc", border: "#80eaff", icon: "#0891b2", }, tip: { background: "#e6f4e6", border: "#80e680", icon: "#008000", }, warning: { background: "#fff7cc", border: "#ffe680", icon: "#ff9900", }, danger: { background: "#f9dada", border: "#ff8080", icon: "#cc0000", }, } const icons = { info: ``, tip: ``, warning: ``, danger: ``, }