@wral/studio.mods.auth 0.3.7

package/dist/auth.es.js

@@ -0,0 +1,3379 @@
+var fe = Object.defineProperty;
+var me = (o, t, e) => t in o ? fe(o, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[t] = e;
+var E = (o, t, e) => me(o, typeof t != "symbol" ? t + "" : t, e);
+function mt(o) {
+  return {
+    // Underlying mechanism to use the REST URLs directly.
+    api: (t, e) => O(o, t, e),
+    mintToken: ({ username: t, password: e }) => ge({ config: o, username: t, password: e }),
+    refreshToken: ({ token: t }) => ve({ config: o, token: t }),
+    pubkey: () => ye({ config: o }),
+    updatePassword: ({ token: t, currentPassword: e, newPassword: r }) => we({ config: o, token: t, currentPassword: e, newPassword: r }),
+    triggerResetPassword: ({ username: t }) => _e({ config: o, username: t }),
+    confirmResetPassword: ({ username: t, newPassword: e, confirmationCode: r }) => $e({ config: o, username: t, newPassword: e, confirmationCode: r })
+  };
+}
+function ge({ config: o, username: t, password: e }) {
+  return O(o, "/v1/user/login", {
+    method: "POST",
+    body: {
+      username: t,
+      password: e
+    }
+  });
+}
+function ve({ config: o, token: t }) {
+  return O(o, "/v1/refresh", {
+    method: "POST",
+    body: {
+      token: t
+    }
+  });
+}
+function ye({ config: o }) {
+  return O(o, "/v1/pubkey", {
+    method: "GET"
+  });
+}
+function we({ config: o, token: t, currentPassword: e, newPassword: r }) {
+  return O(o, "/v1/user/password", {
+    method: "PUT",
+    body: {
+      currentPassword: e,
+      newPassword: r
+    },
+    headers: {
+      Authorization: `Bearer ${t}`
+    }
+  });
+}
+function _e({ config: o, username: t }) {
+  return O(o, "/v1/user/password/reset", {
+    method: "POST",
+    body: {
+      username: t
+    }
+  });
+}
+function $e({ config: o, username: t, newPassword: e, confirmationCode: r }) {
+  return O(o, "/v1/user/password/reset/confirm", {
+    method: "POST",
+    body: {
+      username: t,
+      newPassword: e,
+      confirmationCode: r
+    }
+  });
+}
+async function O(o, t, e) {
+  var c;
+  const r = o.baseUrl.endsWith("/") ? o.baseUrl : `${o.baseUrl}/`, s = t.startsWith("/") ? t.substring(1) : t, i = new URL(s, r), d = Object.assign({}, e, {
+    headers: Object.assign({}, {
+      "Content-Type": "application/json"
+    }, e == null ? void 0 : e.headers),
+    body: e != null && e.body ? JSON.stringify(e.body) : void 0
+  }), l = await fetch(i.toString(), d);
+  if (!l.ok) {
+    const b = new Error("API request failed.");
+    if (b.status = l.status, b.statusText = l.statusText, b.url = i.toString(), b.headers = l.headers, b.bodyUsed = l.bodyUsed, (c = l.headers.get("Content-Type")) != null && c.includes("application/json"))
+      try {
+        b.body = await l.json();
+      } catch {
+        b.body = "Failed to parse response body.";
+      }
+    throw b;
+  }
+  if (l.status !== 204)
+    return await l.json();
+}
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const rt = globalThis, xt = rt.ShadowRoot && (rt.ShadyCSS === void 0 || rt.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, kt = Symbol(), Ut = /* @__PURE__ */ new WeakMap();
+let Jt = class {
+  constructor(t, e, r) {
+    if (this._$cssResult$ = !0, r !== kt) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    this.cssText = t, this.t = e;
+  }
+  get styleSheet() {
+    let t = this.o;
+    const e = this.t;
+    if (xt && t === void 0) {
+      const r = e !== void 0 && e.length === 1;
+      r && (t = Ut.get(e)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), r && Ut.set(e, t));
+    }
+    return t;
+  }
+  toString() {
+    return this.cssText;
+  }
+};
+const xe = (o) => new Jt(typeof o == "string" ? o : o + "", void 0, kt), $ = (o, ...t) => {
+  const e = o.length === 1 ? o[0] : t.reduce((r, s, i) => r + ((n) => {
+    if (n._$cssResult$ === !0) return n.cssText;
+    if (typeof n == "number") return n;
+    throw Error("Value passed to 'css' function must be a 'css' function result: " + n + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
+  })(s) + o[i + 1], o[0]);
+  return new Jt(e, o, kt);
+}, ke = (o, t) => {
+  if (xt) o.adoptedStyleSheets = t.map((e) => e instanceof CSSStyleSheet ? e : e.styleSheet);
+  else for (const e of t) {
+    const r = document.createElement("style"), s = rt.litNonce;
+    s !== void 0 && r.setAttribute("nonce", s), r.textContent = e.cssText, o.appendChild(r);
+  }
+}, Lt = xt ? (o) => o : (o) => o instanceof CSSStyleSheet ? ((t) => {
+  let e = "";
+  for (const r of t.cssRules) e += r.cssText;
+  return xe(e);
+})(o) : o;
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const { is: Ce, defineProperty: Ae, getOwnPropertyDescriptor: Se, getOwnPropertyNames: Ee, getOwnPropertySymbols: Pe, getPrototypeOf: Te } = Object, A = globalThis, Ot = A.trustedTypes, ze = Ot ? Ot.emptyScript : "", lt = A.reactiveElementPolyfillSupport, q = (o, t) => o, R = { toAttribute(o, t) {
+  switch (t) {
+    case Boolean:
+      o = o ? ze : null;
+      break;
+    case Object:
+    case Array:
+      o = o == null ? o : JSON.stringify(o);
+  }
+  return o;
+}, fromAttribute(o, t) {
+  let e = o;
+  switch (t) {
+    case Boolean:
+      e = o !== null;
+      break;
+    case Number:
+      e = o === null ? null : Number(o);
+      break;
+    case Object:
+    case Array:
+      try {
+        e = JSON.parse(o);
+      } catch {
+        e = null;
+      }
+  }
+  return e;
+} }, Ct = (o, t) => !Ce(o, t), It = { attribute: !0, type: String, converter: R, reflect: !1, hasChanged: Ct };
+Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), A.litPropertyMetadata ?? (A.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
+class I extends HTMLElement {
+  static addInitializer(t) {
+    this._$Ei(), (this.l ?? (this.l = [])).push(t);
+  }
+  static get observedAttributes() {
+    return this.finalize(), this._$Eh && [...this._$Eh.keys()];
+  }
+  static createProperty(t, e = It) {
+    if (e.state && (e.attribute = !1), this._$Ei(), this.elementProperties.set(t, e), !e.noAccessor) {
+      const r = Symbol(), s = this.getPropertyDescriptor(t, r, e);
+      s !== void 0 && Ae(this.prototype, t, s);
+    }
+  }
+  static getPropertyDescriptor(t, e, r) {
+    const { get: s, set: i } = Se(this.prototype, t) ?? { get() {
+      return this[e];
+    }, set(n) {
+      this[e] = n;
+    } };
+    return { get() {
+      return s == null ? void 0 : s.call(this);
+    }, set(n) {
+      const d = s == null ? void 0 : s.call(this);
+      i.call(this, n), this.requestUpdate(t, d, r);
+    }, configurable: !0, enumerable: !0 };
+  }
+  static getPropertyOptions(t) {
+    return this.elementProperties.get(t) ?? It;
+  }
+  static _$Ei() {
+    if (this.hasOwnProperty(q("elementProperties"))) return;
+    const t = Te(this);
+    t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
+  }
+  static finalize() {
+    if (this.hasOwnProperty(q("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(q("properties"))) {
+      const e = this.properties, r = [...Ee(e), ...Pe(e)];
+      for (const s of r) this.createProperty(s, e[s]);
+    }
+    const t = this[Symbol.metadata];
+    if (t !== null) {
+      const e = litPropertyMetadata.get(t);
+      if (e !== void 0) for (const [r, s] of e) this.elementProperties.set(r, s);
+    }
+    this._$Eh = /* @__PURE__ */ new Map();
+    for (const [e, r] of this.elementProperties) {
+      const s = this._$Eu(e, r);
+      s !== void 0 && this._$Eh.set(s, e);
+    }
+    this.elementStyles = this.finalizeStyles(this.styles);
+  }
+  static finalizeStyles(t) {
+    const e = [];
+    if (Array.isArray(t)) {
+      const r = new Set(t.flat(1 / 0).reverse());
+      for (const s of r) e.unshift(Lt(s));
+    } else t !== void 0 && e.push(Lt(t));
+    return e;
+  }
+  static _$Eu(t, e) {
+    const r = e.attribute;
+    return r === !1 ? void 0 : typeof r == "string" ? r : typeof t == "string" ? t.toLowerCase() : void 0;
+  }
+  constructor() {
+    super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
+  }
+  _$Ev() {
+    var t;
+    this._$ES = new Promise((e) => this.enableUpdating = e), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), (t = this.constructor.l) == null || t.forEach((e) => e(this));
+  }
+  addController(t) {
+    var e;
+    (this._$EO ?? (this._$EO = /* @__PURE__ */ new Set())).add(t), this.renderRoot !== void 0 && this.isConnected && ((e = t.hostConnected) == null || e.call(t));
+  }
+  removeController(t) {
+    var e;
+    (e = this._$EO) == null || e.delete(t);
+  }
+  _$E_() {
+    const t = /* @__PURE__ */ new Map(), e = this.constructor.elementProperties;
+    for (const r of e.keys()) this.hasOwnProperty(r) && (t.set(r, this[r]), delete this[r]);
+    t.size > 0 && (this._$Ep = t);
+  }
+  createRenderRoot() {
+    const t = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
+    return ke(t, this.constructor.elementStyles), t;
+  }
+  connectedCallback() {
+    var t;
+    this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this.enableUpdating(!0), (t = this._$EO) == null || t.forEach((e) => {
+      var r;
+      return (r = e.hostConnected) == null ? void 0 : r.call(e);
+    });
+  }
+  enableUpdating(t) {
+  }
+  disconnectedCallback() {
+    var t;
+    (t = this._$EO) == null || t.forEach((e) => {
+      var r;
+      return (r = e.hostDisconnected) == null ? void 0 : r.call(e);
+    });
+  }
+  attributeChangedCallback(t, e, r) {
+    this._$AK(t, r);
+  }
+  _$EC(t, e) {
+    var i;
+    const r = this.constructor.elementProperties.get(t), s = this.constructor._$Eu(t, r);
+    if (s !== void 0 && r.reflect === !0) {
+      const n = (((i = r.converter) == null ? void 0 : i.toAttribute) !== void 0 ? r.converter : R).toAttribute(e, r.type);
+      this._$Em = t, n == null ? this.removeAttribute(s) : this.setAttribute(s, n), this._$Em = null;
+    }
+  }
+  _$AK(t, e) {
+    var i;
+    const r = this.constructor, s = r._$Eh.get(t);
+    if (s !== void 0 && this._$Em !== s) {
+      const n = r.getPropertyOptions(s), d = typeof n.converter == "function" ? { fromAttribute: n.converter } : ((i = n.converter) == null ? void 0 : i.fromAttribute) !== void 0 ? n.converter : R;
+      this._$Em = s, this[s] = d.fromAttribute(e, n.type), this._$Em = null;
+    }
+  }
+  requestUpdate(t, e, r) {
+    if (t !== void 0) {
+      if (r ?? (r = this.constructor.getPropertyOptions(t)), !(r.hasChanged ?? Ct)(this[t], e)) return;
+      this.P(t, e, r);
+    }
+    this.isUpdatePending === !1 && (this._$ES = this._$ET());
+  }
+  P(t, e, r) {
+    this._$AL.has(t) || this._$AL.set(t, e), r.reflect === !0 && this._$Em !== t && (this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Set())).add(t);
+  }
+  async _$ET() {
+    this.isUpdatePending = !0;
+    try {
+      await this._$ES;
+    } catch (e) {
+      Promise.reject(e);
+    }
+    const t = this.scheduleUpdate();
+    return t != null && await t, !this.isUpdatePending;
+  }
+  scheduleUpdate() {
+    return this.performUpdate();
+  }
+  performUpdate() {
+    var r;
+    if (!this.isUpdatePending) return;
+    if (!this.hasUpdated) {
+      if (this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this._$Ep) {
+        for (const [i, n] of this._$Ep) this[i] = n;
+        this._$Ep = void 0;
+      }
+      const s = this.constructor.elementProperties;
+      if (s.size > 0) for (const [i, n] of s) n.wrapped !== !0 || this._$AL.has(i) || this[i] === void 0 || this.P(i, this[i], n);
+    }
+    let t = !1;
+    const e = this._$AL;
+    try {
+      t = this.shouldUpdate(e), t ? (this.willUpdate(e), (r = this._$EO) == null || r.forEach((s) => {
+        var i;
+        return (i = s.hostUpdate) == null ? void 0 : i.call(s);
+      }), this.update(e)) : this._$EU();
+    } catch (s) {
+      throw t = !1, this._$EU(), s;
+    }
+    t && this._$AE(e);
+  }
+  willUpdate(t) {
+  }
+  _$AE(t) {
+    var e;
+    (e = this._$EO) == null || e.forEach((r) => {
+      var s;
+      return (s = r.hostUpdated) == null ? void 0 : s.call(r);
+    }), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(t)), this.updated(t);
+  }
+  _$EU() {
+    this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1;
+  }
+  get updateComplete() {
+    return this.getUpdateComplete();
+  }
+  getUpdateComplete() {
+    return this._$ES;
+  }
+  shouldUpdate(t) {
+    return !0;
+  }
+  update(t) {
+    this._$Ej && (this._$Ej = this._$Ej.forEach((e) => this._$EC(e, this[e]))), this._$EU();
+  }
+  updated(t) {
+  }
+  firstUpdated(t) {
+  }
+}
+I.elementStyles = [], I.shadowRootOptions = { mode: "open" }, I[q("elementProperties")] = /* @__PURE__ */ new Map(), I[q("finalized")] = /* @__PURE__ */ new Map(), lt == null || lt({ ReactiveElement: I }), (A.reactiveElementVersions ?? (A.reactiveElementVersions = [])).push("2.0.4");
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const W = globalThis, st = W.trustedTypes, Vt = st ? st.createPolicy("lit-html", { createHTML: (o) => o }) : void 0, Gt = "$lit$", C = `lit$${Math.random().toFixed(9).slice(2)}$`, Qt = "?" + C, Ue = `<${Qt}>`, L = document, Z = () => L.createComment(""), Y = (o) => o === null || typeof o != "object" && typeof o != "function", At = Array.isArray, Le = (o) => At(o) || typeof (o == null ? void 0 : o[Symbol.iterator]) == "function", ut = `[ 	
+\f\r]`, N = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, Rt = /-->/g, Bt = />/g, P = RegExp(`>|${ut}(?:([^\\s"'>=/]+)(${ut}*=${ut}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g"), Mt = /'/g, Nt = /"/g, Xt = /^(?:script|style|textarea|title)$/i, Oe = (o) => (t, ...e) => ({ _$litType$: o, strings: t, values: e }), v = Oe(1), w = Symbol.for("lit-noChange"), g = Symbol.for("lit-nothing"), Dt = /* @__PURE__ */ new WeakMap(), U = L.createTreeWalker(L, 129);
+function te(o, t) {
+  if (!At(o) || !o.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return Vt !== void 0 ? Vt.createHTML(t) : t;
+}
+const Ie = (o, t) => {
+  const e = o.length - 1, r = [];
+  let s, i = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", n = N;
+  for (let d = 0; d < e; d++) {
+    const l = o[d];
+    let c, b, p = -1, _ = 0;
+    for (; _ < l.length && (n.lastIndex = _, b = n.exec(l), b !== null); ) _ = n.lastIndex, n === N ? b[1] === "!--" ? n = Rt : b[1] !== void 0 ? n = Bt : b[2] !== void 0 ? (Xt.test(b[2]) && (s = RegExp("</" + b[2], "g")), n = P) : b[3] !== void 0 && (n = P) : n === P ? b[0] === ">" ? (n = s ?? N, p = -1) : b[1] === void 0 ? p = -2 : (p = n.lastIndex - b[2].length, c = b[1], n = b[3] === void 0 ? P : b[3] === '"' ? Nt : Mt) : n === Nt || n === Mt ? n = P : n === Rt || n === Bt ? n = N : (n = P, s = void 0);
+    const y = n === P && o[d + 1].startsWith("/>") ? " " : "";
+    i += n === N ? l + Ue : p >= 0 ? (r.push(c), l.slice(0, p) + Gt + l.slice(p) + C + y) : l + C + (p === -2 ? d : y);
+  }
+  return [te(o, i + (o[e] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), r];
+};
+class J {
+  constructor({ strings: t, _$litType$: e }, r) {
+    let s;
+    this.parts = [];
+    let i = 0, n = 0;
+    const d = t.length - 1, l = this.parts, [c, b] = Ie(t, e);
+    if (this.el = J.createElement(c, r), U.currentNode = this.el.content, e === 2 || e === 3) {
+      const p = this.el.content.firstChild;
+      p.replaceWith(...p.childNodes);
+    }
+    for (; (s = U.nextNode()) !== null && l.length < d; ) {
+      if (s.nodeType === 1) {
+        if (s.hasAttributes()) for (const p of s.getAttributeNames()) if (p.endsWith(Gt)) {
+          const _ = b[n++], y = s.getAttribute(p).split(C), tt = /([.?@])?(.*)/.exec(_);
+          l.push({ type: 1, index: i, name: tt[2], strings: y, ctor: tt[1] === "." ? Re : tt[1] === "?" ? Be : tt[1] === "@" ? Me : nt }), s.removeAttribute(p);
+        } else p.startsWith(C) && (l.push({ type: 6, index: i }), s.removeAttribute(p));
+        if (Xt.test(s.tagName)) {
+          const p = s.textContent.split(C), _ = p.length - 1;
+          if (_ > 0) {
+            s.textContent = st ? st.emptyScript : "";
+            for (let y = 0; y < _; y++) s.append(p[y], Z()), U.nextNode(), l.push({ type: 2, index: ++i });
+            s.append(p[_], Z());
+          }
+        }
+      } else if (s.nodeType === 8) if (s.data === Qt) l.push({ type: 2, index: i });
+      else {
+        let p = -1;
+        for (; (p = s.data.indexOf(C, p + 1)) !== -1; ) l.push({ type: 7, index: i }), p += C.length - 1;
+      }
+      i++;
+    }
+  }
+  static createElement(t, e) {
+    const r = L.createElement("template");
+    return r.innerHTML = t, r;
+  }
+}
+function B(o, t, e = o, r) {
+  var n, d;
+  if (t === w) return t;
+  let s = r !== void 0 ? (n = e.o) == null ? void 0 : n[r] : e.l;
+  const i = Y(t) ? void 0 : t._$litDirective$;
+  return (s == null ? void 0 : s.constructor) !== i && ((d = s == null ? void 0 : s._$AO) == null || d.call(s, !1), i === void 0 ? s = void 0 : (s = new i(o), s._$AT(o, e, r)), r !== void 0 ? (e.o ?? (e.o = []))[r] = s : e.l = s), s !== void 0 && (t = B(o, s._$AS(o, t.values), s, r)), t;
+}
+class Ve {
+  constructor(t, e) {
+    this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = e;
+  }
+  get parentNode() {
+    return this._$AM.parentNode;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  u(t) {
+    const { el: { content: e }, parts: r } = this._$AD, s = ((t == null ? void 0 : t.creationScope) ?? L).importNode(e, !0);
+    U.currentNode = s;
+    let i = U.nextNode(), n = 0, d = 0, l = r[0];
+    for (; l !== void 0; ) {
+      if (n === l.index) {
+        let c;
+        l.type === 2 ? c = new G(i, i.nextSibling, this, t) : l.type === 1 ? c = new l.ctor(i, l.name, l.strings, this, t) : l.type === 6 && (c = new Ne(i, this, t)), this._$AV.push(c), l = r[++d];
+      }
+      n !== (l == null ? void 0 : l.index) && (i = U.nextNode(), n++);
+    }
+    return U.currentNode = L, s;
+  }
+  p(t) {
+    let e = 0;
+    for (const r of this._$AV) r !== void 0 && (r.strings !== void 0 ? (r._$AI(t, r, e), e += r.strings.length - 2) : r._$AI(t[e])), e++;
+  }
+}
+class G {
+  get _$AU() {
+    var t;
+    return ((t = this._$AM) == null ? void 0 : t._$AU) ?? this.v;
+  }
+  constructor(t, e, r, s) {
+    this.type = 2, this._$AH = g, this._$AN = void 0, this._$AA = t, this._$AB = e, this._$AM = r, this.options = s, this.v = (s == null ? void 0 : s.isConnected) ?? !0;
+  }
+  get parentNode() {
+    let t = this._$AA.parentNode;
+    const e = this._$AM;
+    return e !== void 0 && (t == null ? void 0 : t.nodeType) === 11 && (t = e.parentNode), t;
+  }
+  get startNode() {
+    return this._$AA;
+  }
+  get endNode() {
+    return this._$AB;
+  }
+  _$AI(t, e = this) {
+    t = B(this, t, e), Y(t) ? t === g || t == null || t === "" ? (this._$AH !== g && this._$AR(), this._$AH = g) : t !== this._$AH && t !== w && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : Le(t) ? this.k(t) : this._(t);
+  }
+  O(t) {
+    return this._$AA.parentNode.insertBefore(t, this._$AB);
+  }
+  T(t) {
+    this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
+  }
+  _(t) {
+    this._$AH !== g && Y(this._$AH) ? this._$AA.nextSibling.data = t : this.T(L.createTextNode(t)), this._$AH = t;
+  }
+  $(t) {
+    var i;
+    const { values: e, _$litType$: r } = t, s = typeof r == "number" ? this._$AC(t) : (r.el === void 0 && (r.el = J.createElement(te(r.h, r.h[0]), this.options)), r);
+    if (((i = this._$AH) == null ? void 0 : i._$AD) === s) this._$AH.p(e);
+    else {
+      const n = new Ve(s, this), d = n.u(this.options);
+      n.p(e), this.T(d), this._$AH = n;
+    }
+  }
+  _$AC(t) {
+    let e = Dt.get(t.strings);
+    return e === void 0 && Dt.set(t.strings, e = new J(t)), e;
+  }
+  k(t) {
+    At(this._$AH) || (this._$AH = [], this._$AR());
+    const e = this._$AH;
+    let r, s = 0;
+    for (const i of t) s === e.length ? e.push(r = new G(this.O(Z()), this.O(Z()), this, this.options)) : r = e[s], r._$AI(i), s++;
+    s < e.length && (this._$AR(r && r._$AB.nextSibling, s), e.length = s);
+  }
+  _$AR(t = this._$AA.nextSibling, e) {
+    var r;
+    for ((r = this._$AP) == null ? void 0 : r.call(this, !1, !0, e); t && t !== this._$AB; ) {
+      const s = t.nextSibling;
+      t.remove(), t = s;
+    }
+  }
+  setConnected(t) {
+    var e;
+    this._$AM === void 0 && (this.v = t, (e = this._$AP) == null || e.call(this, t));
+  }
+}
+class nt {
+  get tagName() {
+    return this.element.tagName;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  constructor(t, e, r, s, i) {
+    this.type = 1, this._$AH = g, this._$AN = void 0, this.element = t, this.name = e, this._$AM = s, this.options = i, r.length > 2 || r[0] !== "" || r[1] !== "" ? (this._$AH = Array(r.length - 1).fill(new String()), this.strings = r) : this._$AH = g;
+  }
+  _$AI(t, e = this, r, s) {
+    const i = this.strings;
+    let n = !1;
+    if (i === void 0) t = B(this, t, e, 0), n = !Y(t) || t !== this._$AH && t !== w, n && (this._$AH = t);
+    else {
+      const d = t;
+      let l, c;
+      for (t = i[0], l = 0; l < i.length - 1; l++) c = B(this, d[r + l], e, l), c === w && (c = this._$AH[l]), n || (n = !Y(c) || c !== this._$AH[l]), c === g ? t = g : t !== g && (t += (c ?? "") + i[l + 1]), this._$AH[l] = c;
+    }
+    n && !s && this.j(t);
+  }
+  j(t) {
+    t === g ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
+  }
+}
+class Re extends nt {
+  constructor() {
+    super(...arguments), this.type = 3;
+  }
+  j(t) {
+    this.element[this.name] = t === g ? void 0 : t;
+  }
+}
+class Be extends nt {
+  constructor() {
+    super(...arguments), this.type = 4;
+  }
+  j(t) {
+    this.element.toggleAttribute(this.name, !!t && t !== g);
+  }
+}
+class Me extends nt {
+  constructor(t, e, r, s, i) {
+    super(t, e, r, s, i), this.type = 5;
+  }
+  _$AI(t, e = this) {
+    if ((t = B(this, t, e, 0) ?? g) === w) return;
+    const r = this._$AH, s = t === g && r !== g || t.capture !== r.capture || t.once !== r.once || t.passive !== r.passive, i = t !== g && (r === g || s);
+    s && this.element.removeEventListener(this.name, this, r), i && this.element.addEventListener(this.name, this, t), this._$AH = t;
+  }
+  handleEvent(t) {
+    var e;
+    typeof this._$AH == "function" ? this._$AH.call(((e = this.options) == null ? void 0 : e.host) ?? this.element, t) : this._$AH.handleEvent(t);
+  }
+}
+class Ne {
+  constructor(t, e, r) {
+    this.element = t, this.type = 6, this._$AN = void 0, this._$AM = e, this.options = r;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AI(t) {
+    B(this, t);
+  }
+}
+const dt = W.litHtmlPolyfillSupport;
+dt == null || dt(J, G), (W.litHtmlVersions ?? (W.litHtmlVersions = [])).push("3.2.0");
+const De = (o, t, e) => {
+  const r = (e == null ? void 0 : e.renderBefore) ?? t;
+  let s = r._$litPart$;
+  if (s === void 0) {
+    const i = (e == null ? void 0 : e.renderBefore) ?? null;
+    r._$litPart$ = s = new G(t.insertBefore(Z(), i), i, void 0, e ?? {});
+  }
+  return s._$AI(o), s;
+};
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+class S extends I {
+  constructor() {
+    super(...arguments), this.renderOptions = { host: this }, this.o = void 0;
+  }
+  createRenderRoot() {
+    var e;
+    const t = super.createRenderRoot();
+    return (e = this.renderOptions).renderBefore ?? (e.renderBefore = t.firstChild), t;
+  }
+  update(t) {
+    const e = this.render();
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this.o = De(e, this.renderRoot, this.renderOptions);
+  }
+  connectedCallback() {
+    var t;
+    super.connectedCallback(), (t = this.o) == null || t.setConnected(!0);
+  }
+  disconnectedCallback() {
+    var t;
+    super.disconnectedCallback(), (t = this.o) == null || t.setConnected(!1);
+  }
+  render() {
+    return w;
+  }
+}
+var Yt;
+S._$litElement$ = !0, S.finalized = !0, (Yt = globalThis.litElementHydrateSupport) == null || Yt.call(globalThis, { LitElement: S });
+const ct = globalThis.litElementPolyfillSupport;
+ct == null || ct({ LitElement: S });
+(globalThis.litElementVersions ?? (globalThis.litElementVersions = [])).push("4.1.0");
+var Fe = $`
+  :host {
+    --border-color: var(--sl-color-neutral-200);
+    --border-radius: var(--sl-border-radius-medium);
+    --border-width: 1px;
+    --padding: var(--sl-spacing-large);
+
+    display: inline-block;
+  }
+
+  .card {
+    display: flex;
+    flex-direction: column;
+    background-color: var(--sl-panel-background-color);
+    box-shadow: var(--sl-shadow-x-small);
+    border: solid var(--border-width) var(--border-color);
+    border-radius: var(--border-radius);
+  }
+
+  .card__image {
+    display: flex;
+    border-top-left-radius: var(--border-radius);
+    border-top-right-radius: var(--border-radius);
+    margin: calc(-1 * var(--border-width));
+    overflow: hidden;
+  }
+
+  .card__image::slotted(img) {
+    display: block;
+    width: 100%;
+  }
+
+  .card:not(.card--has-image) .card__image {
+    display: none;
+  }
+
+  .card__header {
+    display: block;
+    border-bottom: solid var(--border-width) var(--border-color);
+    padding: calc(var(--padding) / 2) var(--padding);
+  }
+
+  .card:not(.card--has-header) .card__header {
+    display: none;
+  }
+
+  .card:not(.card--has-image) .card__header {
+    border-top-left-radius: var(--border-radius);
+    border-top-right-radius: var(--border-radius);
+  }
+
+  .card__body {
+    display: block;
+    padding: var(--padding);
+  }
+
+  .card--has-footer .card__footer {
+    display: block;
+    border-top: solid var(--border-width) var(--border-color);
+    padding: var(--padding);
+  }
+
+  .card:not(.card--has-footer) .card__footer {
+    display: none;
+  }
+`, St = class {
+  constructor(o, ...t) {
+    this.slotNames = [], this.handleSlotChange = (e) => {
+      const r = e.target;
+      (this.slotNames.includes("[default]") && !r.name || r.name && this.slotNames.includes(r.name)) && this.host.requestUpdate();
+    }, (this.host = o).addController(this), this.slotNames = t;
+  }
+  hasDefaultSlot() {
+    return [...this.host.childNodes].some((o) => {
+      if (o.nodeType === o.TEXT_NODE && o.textContent.trim() !== "")
+        return !0;
+      if (o.nodeType === o.ELEMENT_NODE) {
+        const t = o;
+        if (t.tagName.toLowerCase() === "sl-visually-hidden")
+          return !1;
+        if (!t.hasAttribute("slot"))
+          return !0;
+      }
+      return !1;
+    });
+  }
+  hasNamedSlot(o) {
+    return this.host.querySelector(`:scope > [slot="${o}"]`) !== null;
+  }
+  test(o) {
+    return o === "[default]" ? this.hasDefaultSlot() : this.hasNamedSlot(o);
+  }
+  hostConnected() {
+    this.host.shadowRoot.addEventListener("slotchange", this.handleSlotChange);
+  }
+  hostDisconnected() {
+    this.host.shadowRoot.removeEventListener("slotchange", this.handleSlotChange);
+  }
+}, Q = $`
+  :host {
+    box-sizing: border-box;
+  }
+
+  :host *,
+  :host *::before,
+  :host *::after {
+    box-sizing: inherit;
+  }
+
+  [hidden] {
+    display: none !important;
+  }
+`, ee = Object.defineProperty, He = Object.defineProperties, je = Object.getOwnPropertyDescriptor, qe = Object.getOwnPropertyDescriptors, Ft = Object.getOwnPropertySymbols, We = Object.prototype.hasOwnProperty, Ke = Object.prototype.propertyIsEnumerable, Ht = (o, t, e) => t in o ? ee(o, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[t] = e, X = (o, t) => {
+  for (var e in t || (t = {}))
+    We.call(t, e) && Ht(o, e, t[e]);
+  if (Ft)
+    for (var e of Ft(t))
+      Ke.call(t, e) && Ht(o, e, t[e]);
+  return o;
+}, oe = (o, t) => He(o, qe(t)), a = (o, t, e, r) => {
+  for (var s = r > 1 ? void 0 : r ? je(t, e) : t, i = o.length - 1, n; i >= 0; i--)
+    (n = o[i]) && (s = (r ? n(t, e, s) : n(s)) || s);
+  return r && s && ee(t, e, s), s;
+};
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const Ze = { attribute: !0, type: String, converter: R, reflect: !1, hasChanged: Ct }, Ye = (o = Ze, t, e) => {
+  const { kind: r, metadata: s } = e;
+  let i = globalThis.litPropertyMetadata.get(s);
+  if (i === void 0 && globalThis.litPropertyMetadata.set(s, i = /* @__PURE__ */ new Map()), i.set(e.name, o), r === "accessor") {
+    const { name: n } = e;
+    return { set(d) {
+      const l = t.get.call(this);
+      t.set.call(this, d), this.requestUpdate(n, l, o);
+    }, init(d) {
+      return d !== void 0 && this.P(n, void 0, o), d;
+    } };
+  }
+  if (r === "setter") {
+    const { name: n } = e;
+    return function(d) {
+      const l = this[n];
+      t.call(this, d), this.requestUpdate(n, l, o);
+    };
+  }
+  throw Error("Unsupported decorator location: " + r);
+};
+function u(o) {
+  return (t, e) => typeof e == "object" ? Ye(o, t, e) : ((r, s, i) => {
+    const n = s.hasOwnProperty(i);
+    return s.constructor.createProperty(i, n ? { ...r, wrapped: !0 } : r), n ? Object.getOwnPropertyDescriptor(s, i) : void 0;
+  })(o, t, e);
+}
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+function at(o) {
+  return u({ ...o, state: !0, attribute: !1 });
+}
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const Je = (o, t, e) => (e.configurable = !0, e.enumerable = !0, Reflect.decorate && typeof t != "object" && Object.defineProperty(o, t, e), e);
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+function re(o, t) {
+  return (e, r, s) => {
+    const i = (n) => {
+      var d;
+      return ((d = n.renderRoot) == null ? void 0 : d.querySelector(o)) ?? null;
+    };
+    return Je(e, r, { get() {
+      return i(this);
+    } });
+  };
+}
+var k = class extends S {
+  constructor() {
+    super(), Object.entries(this.constructor.dependencies).forEach(([o, t]) => {
+      this.constructor.define(o, t);
+    });
+  }
+  emit(o, t) {
+    const e = new CustomEvent(o, X({
+      bubbles: !0,
+      cancelable: !1,
+      composed: !0,
+      detail: {}
+    }, t));
+    return this.dispatchEvent(e), e;
+  }
+  /* eslint-enable */
+  static define(o, t = this, e = {}) {
+    const r = customElements.get(o);
+    if (!r) {
+      try {
+        customElements.define(o, t, e);
+      } catch {
+        customElements.define(o, class extends t {
+        }, e);
+      }
+      return;
+    }
+    let s = " (unknown version)", i = s;
+    "version" in t && t.version && (s = " v" + t.version), "version" in r && r.version && (i = " v" + r.version), !(s && i && s === i) && console.warn(
+      `Attempted to register <${o}>${s}, but <${o}>${i} has already been registered.`
+    );
+  }
+};
+k.version = "2.16.0";
+k.dependencies = {};
+a([
+  u()
+], k.prototype, "dir", 2);
+a([
+  u()
+], k.prototype, "lang", 2);
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const T = { ATTRIBUTE: 1, CHILD: 2, PROPERTY: 3, BOOLEAN_ATTRIBUTE: 4, EVENT: 5, ELEMENT: 6 }, se = (o) => (...t) => ({ _$litDirective$: o, values: t });
+class ie {
+  constructor(t) {
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AT(t, e, r) {
+    this.t = t, this._$AM = e, this.i = r;
+  }
+  _$AS(t, e) {
+    return this.update(t, e);
+  }
+  update(t, e) {
+    return this.render(...e);
+  }
+}
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const it = se(class extends ie {
+  constructor(o) {
+    var t;
+    if (super(o), o.type !== T.ATTRIBUTE || o.name !== "class" || ((t = o.strings) == null ? void 0 : t.length) > 2) throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.");
+  }
+  render(o) {
+    return " " + Object.keys(o).filter((t) => o[t]).join(" ") + " ";
+  }
+  update(o, [t]) {
+    var r, s;
+    if (this.st === void 0) {
+      this.st = /* @__PURE__ */ new Set(), o.strings !== void 0 && (this.nt = new Set(o.strings.join(" ").split(/\s/).filter((i) => i !== "")));
+      for (const i in t) t[i] && !((r = this.nt) != null && r.has(i)) && this.st.add(i);
+      return this.render(t);
+    }
+    const e = o.element.classList;
+    for (const i of this.st) i in t || (e.remove(i), this.st.delete(i));
+    for (const i in t) {
+      const n = !!t[i];
+      n === this.st.has(i) || (s = this.nt) != null && s.has(i) || (n ? (e.add(i), this.st.add(i)) : (e.remove(i), this.st.delete(i)));
+    }
+    return w;
+  }
+});
+var ne = class extends k {
+  constructor() {
+    super(...arguments), this.hasSlotController = new St(this, "footer", "header", "image");
+  }
+  render() {
+    return v`
+      <div
+        part="base"
+        class=${it({
+      card: !0,
+      "card--has-footer": this.hasSlotController.test("footer"),
+      "card--has-image": this.hasSlotController.test("image"),
+      "card--has-header": this.hasSlotController.test("header")
+    })}
+      >
+        <slot name="image" part="image" class="card__image"></slot>
+        <slot name="header" part="header" class="card__header"></slot>
+        <slot part="body" class="card__body"></slot>
+        <slot name="footer" part="footer" class="card__footer"></slot>
+      </div>
+    `;
+  }
+};
+ne.styles = [Q, Fe];
+ne.define("sl-card");
+var Ge = $`
+  :host {
+    display: block;
+  }
+
+  .input {
+    flex: 1 1 auto;
+    display: inline-flex;
+    align-items: stretch;
+    justify-content: start;
+    position: relative;
+    width: 100%;
+    font-family: var(--sl-input-font-family);
+    font-weight: var(--sl-input-font-weight);
+    letter-spacing: var(--sl-input-letter-spacing);
+    vertical-align: middle;
+    overflow: hidden;
+    cursor: text;
+    transition:
+      var(--sl-transition-fast) color,
+      var(--sl-transition-fast) border,
+      var(--sl-transition-fast) box-shadow,
+      var(--sl-transition-fast) background-color;
+  }
+
+  /* Standard inputs */
+  .input--standard {
+    background-color: var(--sl-input-background-color);
+    border: solid var(--sl-input-border-width) var(--sl-input-border-color);
+  }
+
+  .input--standard:hover:not(.input--disabled) {
+    background-color: var(--sl-input-background-color-hover);
+    border-color: var(--sl-input-border-color-hover);
+  }
+
+  .input--standard.input--focused:not(.input--disabled) {
+    background-color: var(--sl-input-background-color-focus);
+    border-color: var(--sl-input-border-color-focus);
+    box-shadow: 0 0 0 var(--sl-focus-ring-width) var(--sl-input-focus-ring-color);
+  }
+
+  .input--standard.input--focused:not(.input--disabled) .input__control {
+    color: var(--sl-input-color-focus);
+  }
+
+  .input--standard.input--disabled {
+    background-color: var(--sl-input-background-color-disabled);
+    border-color: var(--sl-input-border-color-disabled);
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .input--standard.input--disabled .input__control {
+    color: var(--sl-input-color-disabled);
+  }
+
+  .input--standard.input--disabled .input__control::placeholder {
+    color: var(--sl-input-placeholder-color-disabled);
+  }
+
+  /* Filled inputs */
+  .input--filled {
+    border: none;
+    background-color: var(--sl-input-filled-background-color);
+    color: var(--sl-input-color);
+  }
+
+  .input--filled:hover:not(.input--disabled) {
+    background-color: var(--sl-input-filled-background-color-hover);
+  }
+
+  .input--filled.input--focused:not(.input--disabled) {
+    background-color: var(--sl-input-filled-background-color-focus);
+    outline: var(--sl-focus-ring);
+    outline-offset: var(--sl-focus-ring-offset);
+  }
+
+  .input--filled.input--disabled {
+    background-color: var(--sl-input-filled-background-color-disabled);
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .input__control {
+    flex: 1 1 auto;
+    font-family: inherit;
+    font-size: inherit;
+    font-weight: inherit;
+    min-width: 0;
+    height: 100%;
+    color: var(--sl-input-color);
+    border: none;
+    background: inherit;
+    box-shadow: none;
+    padding: 0;
+    margin: 0;
+    cursor: inherit;
+    -webkit-appearance: none;
+  }
+
+  .input__control::-webkit-search-decoration,
+  .input__control::-webkit-search-cancel-button,
+  .input__control::-webkit-search-results-button,
+  .input__control::-webkit-search-results-decoration {
+    -webkit-appearance: none;
+  }
+
+  .input__control:-webkit-autofill,
+  .input__control:-webkit-autofill:hover,
+  .input__control:-webkit-autofill:focus,
+  .input__control:-webkit-autofill:active {
+    box-shadow: 0 0 0 var(--sl-input-height-large) var(--sl-input-background-color-hover) inset !important;
+    -webkit-text-fill-color: var(--sl-color-primary-500);
+    caret-color: var(--sl-input-color);
+  }
+
+  .input--filled .input__control:-webkit-autofill,
+  .input--filled .input__control:-webkit-autofill:hover,
+  .input--filled .input__control:-webkit-autofill:focus,
+  .input--filled .input__control:-webkit-autofill:active {
+    box-shadow: 0 0 0 var(--sl-input-height-large) var(--sl-input-filled-background-color) inset !important;
+  }
+
+  .input__control::placeholder {
+    color: var(--sl-input-placeholder-color);
+    user-select: none;
+    -webkit-user-select: none;
+  }
+
+  .input:hover:not(.input--disabled) .input__control {
+    color: var(--sl-input-color-hover);
+  }
+
+  .input__control:focus {
+    outline: none;
+  }
+
+  .input__prefix,
+  .input__suffix {
+    display: inline-flex;
+    flex: 0 0 auto;
+    align-items: center;
+    cursor: default;
+  }
+
+  .input__prefix ::slotted(sl-icon),
+  .input__suffix ::slotted(sl-icon) {
+    color: var(--sl-input-icon-color);
+  }
+
+  /*
+   * Size modifiers
+   */
+
+  .input--small {
+    border-radius: var(--sl-input-border-radius-small);
+    font-size: var(--sl-input-font-size-small);
+    height: var(--sl-input-height-small);
+  }
+
+  .input--small .input__control {
+    height: calc(var(--sl-input-height-small) - var(--sl-input-border-width) * 2);
+    padding: 0 var(--sl-input-spacing-small);
+  }
+
+  .input--small .input__clear,
+  .input--small .input__password-toggle {
+    width: calc(1em + var(--sl-input-spacing-small) * 2);
+  }
+
+  .input--small .input__prefix ::slotted(*) {
+    margin-inline-start: var(--sl-input-spacing-small);
+  }
+
+  .input--small .input__suffix ::slotted(*) {
+    margin-inline-end: var(--sl-input-spacing-small);
+  }
+
+  .input--medium {
+    border-radius: var(--sl-input-border-radius-medium);
+    font-size: var(--sl-input-font-size-medium);
+    height: var(--sl-input-height-medium);
+  }
+
+  .input--medium .input__control {
+    height: calc(var(--sl-input-height-medium) - var(--sl-input-border-width) * 2);
+    padding: 0 var(--sl-input-spacing-medium);
+  }
+
+  .input--medium .input__clear,
+  .input--medium .input__password-toggle {
+    width: calc(1em + var(--sl-input-spacing-medium) * 2);
+  }
+
+  .input--medium .input__prefix ::slotted(*) {
+    margin-inline-start: var(--sl-input-spacing-medium);
+  }
+
+  .input--medium .input__suffix ::slotted(*) {
+    margin-inline-end: var(--sl-input-spacing-medium);
+  }
+
+  .input--large {
+    border-radius: var(--sl-input-border-radius-large);
+    font-size: var(--sl-input-font-size-large);
+    height: var(--sl-input-height-large);
+  }
+
+  .input--large .input__control {
+    height: calc(var(--sl-input-height-large) - var(--sl-input-border-width) * 2);
+    padding: 0 var(--sl-input-spacing-large);
+  }
+
+  .input--large .input__clear,
+  .input--large .input__password-toggle {
+    width: calc(1em + var(--sl-input-spacing-large) * 2);
+  }
+
+  .input--large .input__prefix ::slotted(*) {
+    margin-inline-start: var(--sl-input-spacing-large);
+  }
+
+  .input--large .input__suffix ::slotted(*) {
+    margin-inline-end: var(--sl-input-spacing-large);
+  }
+
+  /*
+   * Pill modifier
+   */
+
+  .input--pill.input--small {
+    border-radius: var(--sl-input-height-small);
+  }
+
+  .input--pill.input--medium {
+    border-radius: var(--sl-input-height-medium);
+  }
+
+  .input--pill.input--large {
+    border-radius: var(--sl-input-height-large);
+  }
+
+  /*
+   * Clearable + Password Toggle
+   */
+
+  .input__clear,
+  .input__password-toggle {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    font-size: inherit;
+    color: var(--sl-input-icon-color);
+    border: none;
+    background: none;
+    padding: 0;
+    transition: var(--sl-transition-fast) color;
+    cursor: pointer;
+  }
+
+  .input__clear:hover,
+  .input__password-toggle:hover {
+    color: var(--sl-input-icon-color-hover);
+  }
+
+  .input__clear:focus,
+  .input__password-toggle:focus {
+    outline: none;
+  }
+
+  /* Don't show the browser's password toggle in Edge */
+  ::-ms-reveal {
+    display: none;
+  }
+
+  /* Hide the built-in number spinner */
+  .input--no-spin-buttons input[type='number']::-webkit-outer-spin-button,
+  .input--no-spin-buttons input[type='number']::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    display: none;
+  }
+
+  .input--no-spin-buttons input[type='number'] {
+    -moz-appearance: textfield;
+  }
+`, Qe = (o = "value") => (t, e) => {
+  const r = t.constructor, s = r.prototype.attributeChangedCallback;
+  r.prototype.attributeChangedCallback = function(i, n, d) {
+    var l;
+    const c = r.getPropertyOptions(o), b = typeof c.attribute == "string" ? c.attribute : o;
+    if (i === b) {
+      const p = c.converter || R, y = (typeof p == "function" ? p : (l = p == null ? void 0 : p.fromAttribute) != null ? l : R.fromAttribute)(d, c.type);
+      this[o] !== y && (this[e] = y);
+    }
+    s.call(this, i, n, d);
+  };
+}, Xe = $`
+  .form-control .form-control__label {
+    display: none;
+  }
+
+  .form-control .form-control__help-text {
+    display: none;
+  }
+
+  /* Label */
+  .form-control--has-label .form-control__label {
+    display: inline-block;
+    color: var(--sl-input-label-color);
+    margin-bottom: var(--sl-spacing-3x-small);
+  }
+
+  .form-control--has-label.form-control--small .form-control__label {
+    font-size: var(--sl-input-label-font-size-small);
+  }
+
+  .form-control--has-label.form-control--medium .form-control__label {
+    font-size: var(--sl-input-label-font-size-medium);
+  }
+
+  .form-control--has-label.form-control--large .form-control__label {
+    font-size: var(--sl-input-label-font-size-large);
+  }
+
+  :host([required]) .form-control--has-label .form-control__label::after {
+    content: var(--sl-input-required-content);
+    margin-inline-start: var(--sl-input-required-content-offset);
+    color: var(--sl-input-required-content-color);
+  }
+
+  /* Help text */
+  .form-control--has-help-text .form-control__help-text {
+    display: block;
+    color: var(--sl-input-help-text-color);
+    margin-top: var(--sl-spacing-3x-small);
+  }
+
+  .form-control--has-help-text.form-control--small .form-control__help-text {
+    font-size: var(--sl-input-help-text-font-size-small);
+  }
+
+  .form-control--has-help-text.form-control--medium .form-control__help-text {
+    font-size: var(--sl-input-help-text-font-size-medium);
+  }
+
+  .form-control--has-help-text.form-control--large .form-control__help-text {
+    font-size: var(--sl-input-help-text-font-size-large);
+  }
+
+  .form-control--has-help-text.form-control--radio-group .form-control__help-text {
+    margin-top: var(--sl-spacing-2x-small);
+  }
+`, D = /* @__PURE__ */ new WeakMap(), F = /* @__PURE__ */ new WeakMap(), H = /* @__PURE__ */ new WeakMap(), ht = /* @__PURE__ */ new WeakSet(), et = /* @__PURE__ */ new WeakMap(), ae = class {
+  constructor(o, t) {
+    this.handleFormData = (e) => {
+      const r = this.options.disabled(this.host), s = this.options.name(this.host), i = this.options.value(this.host), n = this.host.tagName.toLowerCase() === "sl-button";
+      this.host.isConnected && !r && !n && typeof s == "string" && s.length > 0 && typeof i < "u" && (Array.isArray(i) ? i.forEach((d) => {
+        e.formData.append(s, d.toString());
+      }) : e.formData.append(s, i.toString()));
+    }, this.handleFormSubmit = (e) => {
+      var r;
+      const s = this.options.disabled(this.host), i = this.options.reportValidity;
+      this.form && !this.form.noValidate && ((r = D.get(this.form)) == null || r.forEach((n) => {
+        this.setUserInteracted(n, !0);
+      })), this.form && !this.form.noValidate && !s && !i(this.host) && (e.preventDefault(), e.stopImmediatePropagation());
+    }, this.handleFormReset = () => {
+      this.options.setValue(this.host, this.options.defaultValue(this.host)), this.setUserInteracted(this.host, !1), et.set(this.host, []);
+    }, this.handleInteraction = (e) => {
+      const r = et.get(this.host);
+      r.includes(e.type) || r.push(e.type), r.length === this.options.assumeInteractionOn.length && this.setUserInteracted(this.host, !0);
+    }, this.checkFormValidity = () => {
+      if (this.form && !this.form.noValidate) {
+        const e = this.form.querySelectorAll("*");
+        for (const r of e)
+          if (typeof r.checkValidity == "function" && !r.checkValidity())
+            return !1;
+      }
+      return !0;
+    }, this.reportFormValidity = () => {
+      if (this.form && !this.form.noValidate) {
+        const e = this.form.querySelectorAll("*");
+        for (const r of e)
+          if (typeof r.reportValidity == "function" && !r.reportValidity())
+            return !1;
+      }
+      return !0;
+    }, (this.host = o).addController(this), this.options = X({
+      form: (e) => {
+        const r = e.form;
+        if (r) {
+          const i = e.getRootNode().querySelector(`#${r}`);
+          if (i)
+            return i;
+        }
+        return e.closest("form");
+      },
+      name: (e) => e.name,
+      value: (e) => e.value,
+      defaultValue: (e) => e.defaultValue,
+      disabled: (e) => {
+        var r;
+        return (r = e.disabled) != null ? r : !1;
+      },
+      reportValidity: (e) => typeof e.reportValidity == "function" ? e.reportValidity() : !0,
+      checkValidity: (e) => typeof e.checkValidity == "function" ? e.checkValidity() : !0,
+      setValue: (e, r) => e.value = r,
+      assumeInteractionOn: ["sl-input"]
+    }, t);
+  }
+  hostConnected() {
+    const o = this.options.form(this.host);
+    o && this.attachForm(o), et.set(this.host, []), this.options.assumeInteractionOn.forEach((t) => {
+      this.host.addEventListener(t, this.handleInteraction);
+    });
+  }
+  hostDisconnected() {
+    this.detachForm(), et.delete(this.host), this.options.assumeInteractionOn.forEach((o) => {
+      this.host.removeEventListener(o, this.handleInteraction);
+    });
+  }
+  hostUpdated() {
+    const o = this.options.form(this.host);
+    o || this.detachForm(), o && this.form !== o && (this.detachForm(), this.attachForm(o)), this.host.hasUpdated && this.setValidity(this.host.validity.valid);
+  }
+  attachForm(o) {
+    o ? (this.form = o, D.has(this.form) ? D.get(this.form).add(this.host) : D.set(this.form, /* @__PURE__ */ new Set([this.host])), this.form.addEventListener("formdata", this.handleFormData), this.form.addEventListener("submit", this.handleFormSubmit), this.form.addEventListener("reset", this.handleFormReset), F.has(this.form) || (F.set(this.form, this.form.reportValidity), this.form.reportValidity = () => this.reportFormValidity()), H.has(this.form) || (H.set(this.form, this.form.checkValidity), this.form.checkValidity = () => this.checkFormValidity())) : this.form = void 0;
+  }
+  detachForm() {
+    if (!this.form)
+      return;
+    const o = D.get(this.form);
+    o && (o.delete(this.host), o.size <= 0 && (this.form.removeEventListener("formdata", this.handleFormData), this.form.removeEventListener("submit", this.handleFormSubmit), this.form.removeEventListener("reset", this.handleFormReset), F.has(this.form) && (this.form.reportValidity = F.get(this.form), F.delete(this.form)), H.has(this.form) && (this.form.checkValidity = H.get(this.form), H.delete(this.form)), this.form = void 0));
+  }
+  setUserInteracted(o, t) {
+    t ? ht.add(o) : ht.delete(o), o.requestUpdate();
+  }
+  doAction(o, t) {
+    if (this.form) {
+      const e = document.createElement("button");
+      e.type = o, e.style.position = "absolute", e.style.width = "0", e.style.height = "0", e.style.clipPath = "inset(50%)", e.style.overflow = "hidden", e.style.whiteSpace = "nowrap", t && (e.name = t.name, e.value = t.value, ["formaction", "formenctype", "formmethod", "formnovalidate", "formtarget"].forEach((r) => {
+        t.hasAttribute(r) && e.setAttribute(r, t.getAttribute(r));
+      })), this.form.append(e), e.click(), e.remove();
+    }
+  }
+  /** Returns the associated `<form>` element, if one exists. */
+  getForm() {
+    var o;
+    return (o = this.form) != null ? o : null;
+  }
+  /** Resets the form, restoring all the control to their default value */
+  reset(o) {
+    this.doAction("reset", o);
+  }
+  /** Submits the form, triggering validation and form data injection. */
+  submit(o) {
+    this.doAction("submit", o);
+  }
+  /**
+   * Synchronously sets the form control's validity. Call this when you know the future validity but need to update
+   * the host element immediately, i.e. before Lit updates the component in the next update.
+   */
+  setValidity(o) {
+    const t = this.host, e = !!ht.has(t), r = !!t.required;
+    t.toggleAttribute("data-required", r), t.toggleAttribute("data-optional", !r), t.toggleAttribute("data-invalid", !o), t.toggleAttribute("data-valid", o), t.toggleAttribute("data-user-invalid", !o && e), t.toggleAttribute("data-user-valid", o && e);
+  }
+  /**
+   * Updates the form control's validity based on the current value of `host.validity.valid`. Call this when anything
+   * that affects constraint validation changes so the component receives the correct validity states.
+   */
+  updateValidity() {
+    const o = this.host;
+    this.setValidity(o.validity.valid);
+  }
+  /**
+   * Dispatches a non-bubbling, cancelable custom event of type `sl-invalid`.
+   * If the `sl-invalid` event will be cancelled then the original `invalid`
+   * event (which may have been passed as argument) will also be cancelled.
+   * If no original `invalid` event has been passed then the `sl-invalid`
+   * event will be cancelled before being dispatched.
+   */
+  emitInvalidEvent(o) {
+    const t = new CustomEvent("sl-invalid", {
+      bubbles: !1,
+      composed: !1,
+      cancelable: !0,
+      detail: {}
+    });
+    o || t.preventDefault(), this.host.dispatchEvent(t) || o == null || o.preventDefault();
+  }
+}, Et = Object.freeze({
+  badInput: !1,
+  customError: !1,
+  patternMismatch: !1,
+  rangeOverflow: !1,
+  rangeUnderflow: !1,
+  stepMismatch: !1,
+  tooLong: !1,
+  tooShort: !1,
+  typeMismatch: !1,
+  valid: !0,
+  valueMissing: !1
+});
+Object.freeze(oe(X({}, Et), {
+  valid: !1,
+  valueMissing: !0
+}));
+Object.freeze(oe(X({}, Et), {
+  valid: !1,
+  customError: !0
+}));
+const gt = /* @__PURE__ */ new Set(), V = /* @__PURE__ */ new Map();
+let z, Pt = "ltr", Tt = "en";
+const le = typeof MutationObserver < "u" && typeof document < "u" && typeof document.documentElement < "u";
+if (le) {
+  const o = new MutationObserver(de);
+  Pt = document.documentElement.dir || "ltr", Tt = document.documentElement.lang || navigator.language, o.observe(document.documentElement, {
+    attributes: !0,
+    attributeFilter: ["dir", "lang"]
+  });
+}
+function ue(...o) {
+  o.map((t) => {
+    const e = t.$code.toLowerCase();
+    V.has(e) ? V.set(e, Object.assign(Object.assign({}, V.get(e)), t)) : V.set(e, t), z || (z = t);
+  }), de();
+}
+function de() {
+  le && (Pt = document.documentElement.dir || "ltr", Tt = document.documentElement.lang || navigator.language), [...gt.keys()].map((o) => {
+    typeof o.requestUpdate == "function" && o.requestUpdate();
+  });
+}
+let to = class {
+  constructor(t) {
+    this.host = t, this.host.addController(this);
+  }
+  hostConnected() {
+    gt.add(this.host);
+  }
+  hostDisconnected() {
+    gt.delete(this.host);
+  }
+  dir() {
+    return `${this.host.dir || Pt}`.toLowerCase();
+  }
+  lang() {
+    return `${this.host.lang || Tt}`.toLowerCase();
+  }
+  getTranslationData(t) {
+    var e, r;
+    const s = new Intl.Locale(t.replace(/_/g, "-")), i = s == null ? void 0 : s.language.toLowerCase(), n = (r = (e = s == null ? void 0 : s.region) === null || e === void 0 ? void 0 : e.toLowerCase()) !== null && r !== void 0 ? r : "", d = V.get(`${i}-${n}`), l = V.get(i);
+    return { locale: s, language: i, region: n, primary: d, secondary: l };
+  }
+  exists(t, e) {
+    var r;
+    const { primary: s, secondary: i } = this.getTranslationData((r = e.lang) !== null && r !== void 0 ? r : this.lang());
+    return e = Object.assign({ includeFallback: !1 }, e), !!(s && s[t] || i && i[t] || e.includeFallback && z && z[t]);
+  }
+  term(t, ...e) {
+    const { primary: r, secondary: s } = this.getTranslationData(this.lang());
+    let i;
+    if (r && r[t])
+      i = r[t];
+    else if (s && s[t])
+      i = s[t];
+    else if (z && z[t])
+      i = z[t];
+    else
+      return console.error(`No translation found for: ${String(t)}`), String(t);
+    return typeof i == "function" ? i(...e) : i;
+  }
+  date(t, e) {
+    return t = new Date(t), new Intl.DateTimeFormat(this.lang(), e).format(t);
+  }
+  number(t, e) {
+    return t = Number(t), isNaN(t) ? "" : new Intl.NumberFormat(this.lang(), e).format(t);
+  }
+  relativeTime(t, e, r) {
+    return new Intl.RelativeTimeFormat(this.lang(), r).format(t, e);
+  }
+};
+var ce = {
+  $code: "en",
+  $name: "English",
+  $dir: "ltr",
+  carousel: "Carousel",
+  clearEntry: "Clear entry",
+  close: "Close",
+  copied: "Copied",
+  copy: "Copy",
+  currentValue: "Current value",
+  error: "Error",
+  goToSlide: (o, t) => `Go to slide ${o} of ${t}`,
+  hidePassword: "Hide password",
+  loading: "Loading",
+  nextSlide: "Next slide",
+  numOptionsSelected: (o) => o === 0 ? "No options selected" : o === 1 ? "1 option selected" : `${o} options selected`,
+  previousSlide: "Previous slide",
+  progress: "Progress",
+  remove: "Remove",
+  resize: "Resize",
+  scrollToEnd: "Scroll to end",
+  scrollToStart: "Scroll to start",
+  selectAColorFromTheScreen: "Select a color from the screen",
+  showPassword: "Show password",
+  slideNum: (o) => `Slide ${o}`,
+  toggleColorFormat: "Toggle color format"
+};
+ue(ce);
+var eo = ce, zt = class extends to {
+};
+ue(eo);
+var vt = "";
+function jt(o) {
+  vt = o;
+}
+function oo(o = "") {
+  if (!vt) {
+    const t = [...document.getElementsByTagName("script")], e = t.find((r) => r.hasAttribute("data-shoelace"));
+    if (e)
+      jt(e.getAttribute("data-shoelace"));
+    else {
+      const r = t.find((i) => /shoelace(\.min)?\.js($|\?)/.test(i.src) || /shoelace-autoloader(\.min)?\.js($|\?)/.test(i.src));
+      let s = "";
+      r && (s = r.getAttribute("src")), jt(s.split("/").slice(0, -1).join("/"));
+    }
+  }
+  return vt.replace(/\/$/, "") + (o ? `/${o.replace(/^\//, "")}` : "");
+}
+var ro = {
+  name: "default",
+  resolver: (o) => oo(`assets/icons/${o}.svg`)
+}, so = ro, qt = {
+  caret: `
+    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+      <polyline points="6 9 12 15 18 9"></polyline>
+    </svg>
+  `,
+  check: `
+    <svg part="checked-icon" class="checkbox__icon" viewBox="0 0 16 16">
+      <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <g stroke="currentColor">
+          <g transform="translate(3.428571, 3.428571)">
+            <path d="M0,5.71428571 L3.42857143,9.14285714"></path>
+            <path d="M9.14285714,0 L3.42857143,9.14285714"></path>
+          </g>
+        </g>
+      </g>
+    </svg>
+  `,
+  "chevron-down": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-down" viewBox="0 0 16 16">
+      <path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/>
+    </svg>
+  `,
+  "chevron-left": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-left" viewBox="0 0 16 16">
+      <path fill-rule="evenodd" d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"/>
+    </svg>
+  `,
+  "chevron-right": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-right" viewBox="0 0 16 16">
+      <path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/>
+    </svg>
+  `,
+  copy: `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-copy" viewBox="0 0 16 16">
+      <path fill-rule="evenodd" d="M4 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V2Zm2-1a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H6ZM2 5a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1v-1h1v1a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h1v1H2Z"/>
+    </svg>
+  `,
+  eye: `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye" viewBox="0 0 16 16">
+      <path d="M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8zM1.173 8a13.133 13.133 0 0 1 1.66-2.043C4.12 4.668 5.88 3.5 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.133 13.133 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755C11.879 11.332 10.119 12.5 8 12.5c-2.12 0-3.879-1.168-5.168-2.457A13.134 13.134 0 0 1 1.172 8z"/>
+      <path d="M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zM4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z"/>
+    </svg>
+  `,
+  "eye-slash": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
+      <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
+      <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
+      <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
+    </svg>
+  `,
+  eyedropper: `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eyedropper" viewBox="0 0 16 16">
+      <path d="M13.354.646a1.207 1.207 0 0 0-1.708 0L8.5 3.793l-.646-.647a.5.5 0 1 0-.708.708L8.293 5l-7.147 7.146A.5.5 0 0 0 1 12.5v1.793l-.854.853a.5.5 0 1 0 .708.707L1.707 15H3.5a.5.5 0 0 0 .354-.146L11 7.707l1.146 1.147a.5.5 0 0 0 .708-.708l-.647-.646 3.147-3.146a1.207 1.207 0 0 0 0-1.708l-2-2zM2 12.707l7-7L10.293 7l-7 7H2v-1.293z"></path>
+    </svg>
+  `,
+  "grip-vertical": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-grip-vertical" viewBox="0 0 16 16">
+      <path d="M7 2a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zM7 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zM7 8a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-3 3a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-3 3a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"></path>
+    </svg>
+  `,
+  indeterminate: `
+    <svg part="indeterminate-icon" class="checkbox__icon" viewBox="0 0 16 16">
+      <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <g stroke="currentColor" stroke-width="2">
+          <g transform="translate(2.285714, 6.857143)">
+            <path d="M10.2857143,1.14285714 L1.14285714,1.14285714"></path>
+          </g>
+        </g>
+      </g>
+    </svg>
+  `,
+  "person-fill": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-fill" viewBox="0 0 16 16">
+      <path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
+    </svg>
+  `,
+  "play-fill": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-play-fill" viewBox="0 0 16 16">
+      <path d="m11.596 8.697-6.363 3.692c-.54.313-1.233-.066-1.233-.697V4.308c0-.63.692-1.01 1.233-.696l6.363 3.692a.802.802 0 0 1 0 1.393z"></path>
+    </svg>
+  `,
+  "pause-fill": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-pause-fill" viewBox="0 0 16 16">
+      <path d="M5.5 3.5A1.5 1.5 0 0 1 7 5v6a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 1.5-1.5zm5 0A1.5 1.5 0 0 1 12 5v6a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 1.5-1.5z"></path>
+    </svg>
+  `,
+  radio: `
+    <svg part="checked-icon" class="radio__icon" viewBox="0 0 16 16">
+      <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g fill="currentColor">
+          <circle cx="8" cy="8" r="3.42857143"></circle>
+        </g>
+      </g>
+    </svg>
+  `,
+  "star-fill": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-star-fill" viewBox="0 0 16 16">
+      <path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
+    </svg>
+  `,
+  "x-lg": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x-lg" viewBox="0 0 16 16">
+      <path d="M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z"/>
+    </svg>
+  `,
+  "x-circle-fill": `
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x-circle-fill" viewBox="0 0 16 16">
+      <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"></path>
+    </svg>
+  `
+}, io = {
+  name: "system",
+  resolver: (o) => o in qt ? `data:image/svg+xml,${encodeURIComponent(qt[o])}` : ""
+}, no = io, ao = [so, no], yt = [];
+function lo(o) {
+  yt.push(o);
+}
+function uo(o) {
+  yt = yt.filter((t) => t !== o);
+}
+function Wt(o) {
+  return ao.find((t) => t.name === o);
+}
+var co = $`
+  :host {
+    display: inline-block;
+    width: 1em;
+    height: 1em;
+    box-sizing: content-box !important;
+  }
+
+  svg {
+    display: block;
+    height: 100%;
+    width: 100%;
+  }
+`;
+function M(o, t) {
+  const e = X({
+    waitUntilFirstUpdate: !1
+  }, t);
+  return (r, s) => {
+    const { update: i } = r, n = Array.isArray(o) ? o : [o];
+    r.update = function(d) {
+      n.forEach((l) => {
+        const c = l;
+        if (d.has(c)) {
+          const b = d.get(c), p = this[c];
+          b !== p && (!e.waitUntilFirstUpdate || this.hasUpdated) && this[s](b, p);
+        }
+      }), i.call(this, d);
+    };
+  };
+}
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const ho = (o, t) => (o == null ? void 0 : o._$litType$) !== void 0, po = (o) => o.strings === void 0, bo = {}, fo = (o, t = bo) => o._$AH = t;
+var j = Symbol(), ot = Symbol(), pt, bt = /* @__PURE__ */ new Map(), x = class extends k {
+  constructor() {
+    super(...arguments), this.initialRender = !1, this.svg = null, this.label = "", this.library = "default";
+  }
+  /** Given a URL, this function returns the resulting SVG element or an appropriate error symbol. */
+  async resolveIcon(o, t) {
+    var e;
+    let r;
+    if (t != null && t.spriteSheet) {
+      this.svg = v`<svg part="svg">
+        <use part="use" href="${o}"></use>
+      </svg>`, await this.updateComplete;
+      const s = this.shadowRoot.querySelector("[part='svg']");
+      return typeof t.mutator == "function" && t.mutator(s), this.svg;
+    }
+    try {
+      if (r = await fetch(o, { mode: "cors" }), !r.ok)
+        return r.status === 410 ? j : ot;
+    } catch {
+      return ot;
+    }
+    try {
+      const s = document.createElement("div");
+      s.innerHTML = await r.text();
+      const i = s.firstElementChild;
+      if (((e = i == null ? void 0 : i.tagName) == null ? void 0 : e.toLowerCase()) !== "svg")
+        return j;
+      pt || (pt = new DOMParser());
+      const d = pt.parseFromString(i.outerHTML, "text/html").body.querySelector("svg");
+      return d ? (d.part.add("svg"), document.adoptNode(d)) : j;
+    } catch {
+      return j;
+    }
+  }
+  connectedCallback() {
+    super.connectedCallback(), lo(this);
+  }
+  firstUpdated() {
+    this.initialRender = !0, this.setIcon();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), uo(this);
+  }
+  getIconSource() {
+    const o = Wt(this.library);
+    return this.name && o ? {
+      url: o.resolver(this.name),
+      fromLibrary: !0
+    } : {
+      url: this.src,
+      fromLibrary: !1
+    };
+  }
+  handleLabelChange() {
+    typeof this.label == "string" && this.label.length > 0 ? (this.setAttribute("role", "img"), this.setAttribute("aria-label", this.label), this.removeAttribute("aria-hidden")) : (this.removeAttribute("role"), this.removeAttribute("aria-label"), this.setAttribute("aria-hidden", "true"));
+  }
+  async setIcon() {
+    var o;
+    const { url: t, fromLibrary: e } = this.getIconSource(), r = e ? Wt(this.library) : void 0;
+    if (!t) {
+      this.svg = null;
+      return;
+    }
+    let s = bt.get(t);
+    if (s || (s = this.resolveIcon(t, r), bt.set(t, s)), !this.initialRender)
+      return;
+    const i = await s;
+    if (i === ot && bt.delete(t), t === this.getIconSource().url) {
+      if (ho(i)) {
+        this.svg = i;
+        return;
+      }
+      switch (i) {
+        case ot:
+        case j:
+          this.svg = null, this.emit("sl-error");
+          break;
+        default:
+          this.svg = i.cloneNode(!0), (o = r == null ? void 0 : r.mutator) == null || o.call(r, this.svg), this.emit("sl-load");
+      }
+    }
+  }
+  render() {
+    return this.svg;
+  }
+};
+x.styles = [Q, co];
+a([
+  at()
+], x.prototype, "svg", 2);
+a([
+  u({ reflect: !0 })
+], x.prototype, "name", 2);
+a([
+  u()
+], x.prototype, "src", 2);
+a([
+  u()
+], x.prototype, "label", 2);
+a([
+  u({ reflect: !0 })
+], x.prototype, "library", 2);
+a([
+  M("label")
+], x.prototype, "handleLabelChange", 1);
+a([
+  M(["name", "src", "library"])
+], x.prototype, "setIcon", 1);
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const m = (o) => o ?? g;
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const mo = se(class extends ie {
+  constructor(o) {
+    if (super(o), o.type !== T.PROPERTY && o.type !== T.ATTRIBUTE && o.type !== T.BOOLEAN_ATTRIBUTE) throw Error("The `live` directive is not allowed on child or event bindings");
+    if (!po(o)) throw Error("`live` bindings can only contain a single expression");
+  }
+  render(o) {
+    return o;
+  }
+  update(o, [t]) {
+    if (t === w || t === g) return t;
+    const e = o.element, r = o.name;
+    if (o.type === T.PROPERTY) {
+      if (t === e[r]) return w;
+    } else if (o.type === T.BOOLEAN_ATTRIBUTE) {
+      if (!!t === e.hasAttribute(r)) return w;
+    } else if (o.type === T.ATTRIBUTE && e.getAttribute(r) === t + "") return w;
+    return fo(o), t;
+  }
+});
+var h = class extends k {
+  constructor() {
+    super(...arguments), this.formControlController = new ae(this, {
+      assumeInteractionOn: ["sl-blur", "sl-input"]
+    }), this.hasSlotController = new St(this, "help-text", "label"), this.localize = new zt(this), this.hasFocus = !1, this.title = "", this.__numberInput = Object.assign(document.createElement("input"), { type: "number" }), this.__dateInput = Object.assign(document.createElement("input"), { type: "date" }), this.type = "text", this.name = "", this.value = "", this.defaultValue = "", this.size = "medium", this.filled = !1, this.pill = !1, this.label = "", this.helpText = "", this.clearable = !1, this.disabled = !1, this.placeholder = "", this.readonly = !1, this.passwordToggle = !1, this.passwordVisible = !1, this.noSpinButtons = !1, this.form = "", this.required = !1, this.spellcheck = !0;
+  }
+  //
+  // NOTE: We use an in-memory input for these getters/setters instead of the one in the template because the properties
+  // can be set before the component is rendered.
+  //
+  /**
+   * Gets or sets the current value as a `Date` object. Returns `null` if the value can't be converted. This will use the native `<input type="{{type}}">` implementation and may result in an error.
+   */
+  get valueAsDate() {
+    var o;
+    return this.__dateInput.type = this.type, this.__dateInput.value = this.value, ((o = this.input) == null ? void 0 : o.valueAsDate) || this.__dateInput.valueAsDate;
+  }
+  set valueAsDate(o) {
+    this.__dateInput.type = this.type, this.__dateInput.valueAsDate = o, this.value = this.__dateInput.value;
+  }
+  /** Gets or sets the current value as a number. Returns `NaN` if the value can't be converted. */
+  get valueAsNumber() {
+    var o;
+    return this.__numberInput.value = this.value, ((o = this.input) == null ? void 0 : o.valueAsNumber) || this.__numberInput.valueAsNumber;
+  }
+  set valueAsNumber(o) {
+    this.__numberInput.valueAsNumber = o, this.value = this.__numberInput.value;
+  }
+  /** Gets the validity state object */
+  get validity() {
+    return this.input.validity;
+  }
+  /** Gets the validation message */
+  get validationMessage() {
+    return this.input.validationMessage;
+  }
+  firstUpdated() {
+    this.formControlController.updateValidity();
+  }
+  handleBlur() {
+    this.hasFocus = !1, this.emit("sl-blur");
+  }
+  handleChange() {
+    this.value = this.input.value, this.emit("sl-change");
+  }
+  handleClearClick(o) {
+    o.preventDefault(), this.value !== "" && (this.value = "", this.emit("sl-clear"), this.emit("sl-input"), this.emit("sl-change")), this.input.focus();
+  }
+  handleFocus() {
+    this.hasFocus = !0, this.emit("sl-focus");
+  }
+  handleInput() {
+    this.value = this.input.value, this.formControlController.updateValidity(), this.emit("sl-input");
+  }
+  handleInvalid(o) {
+    this.formControlController.setValidity(!1), this.formControlController.emitInvalidEvent(o);
+  }
+  handleKeyDown(o) {
+    const t = o.metaKey || o.ctrlKey || o.shiftKey || o.altKey;
+    o.key === "Enter" && !t && setTimeout(() => {
+      !o.defaultPrevented && !o.isComposing && this.formControlController.submit();
+    });
+  }
+  handlePasswordToggle() {
+    this.passwordVisible = !this.passwordVisible;
+  }
+  handleDisabledChange() {
+    this.formControlController.setValidity(this.disabled);
+  }
+  handleStepChange() {
+    this.input.step = String(this.step), this.formControlController.updateValidity();
+  }
+  async handleValueChange() {
+    await this.updateComplete, this.formControlController.updateValidity();
+  }
+  /** Sets focus on the input. */
+  focus(o) {
+    this.input.focus(o);
+  }
+  /** Removes focus from the input. */
+  blur() {
+    this.input.blur();
+  }
+  /** Selects all the text in the input. */
+  select() {
+    this.input.select();
+  }
+  /** Sets the start and end positions of the text selection (0-based). */
+  setSelectionRange(o, t, e = "none") {
+    this.input.setSelectionRange(o, t, e);
+  }
+  /** Replaces a range of text with a new string. */
+  setRangeText(o, t, e, r = "preserve") {
+    const s = t ?? this.input.selectionStart, i = e ?? this.input.selectionEnd;
+    this.input.setRangeText(o, s, i, r), this.value !== this.input.value && (this.value = this.input.value);
+  }
+  /** Displays the browser picker for an input element (only works if the browser supports it for the input type). */
+  showPicker() {
+    "showPicker" in HTMLInputElement.prototype && this.input.showPicker();
+  }
+  /** Increments the value of a numeric input type by the value of the step attribute. */
+  stepUp() {
+    this.input.stepUp(), this.value !== this.input.value && (this.value = this.input.value);
+  }
+  /** Decrements the value of a numeric input type by the value of the step attribute. */
+  stepDown() {
+    this.input.stepDown(), this.value !== this.input.value && (this.value = this.input.value);
+  }
+  /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
+  checkValidity() {
+    return this.input.checkValidity();
+  }
+  /** Gets the associated form, if one exists. */
+  getForm() {
+    return this.formControlController.getForm();
+  }
+  /** Checks for validity and shows the browser's validation message if the control is invalid. */
+  reportValidity() {
+    return this.input.reportValidity();
+  }
+  /** Sets a custom validation message. Pass an empty string to restore validity. */
+  setCustomValidity(o) {
+    this.input.setCustomValidity(o), this.formControlController.updateValidity();
+  }
+  render() {
+    const o = this.hasSlotController.test("label"), t = this.hasSlotController.test("help-text"), e = this.label ? !0 : !!o, r = this.helpText ? !0 : !!t, i = this.clearable && !this.disabled && !this.readonly && (typeof this.value == "number" || this.value.length > 0);
+    return v`
+      <div
+        part="form-control"
+        class=${it({
+      "form-control": !0,
+      "form-control--small": this.size === "small",
+      "form-control--medium": this.size === "medium",
+      "form-control--large": this.size === "large",
+      "form-control--has-label": e,
+      "form-control--has-help-text": r
+    })}
+      >
+        <label
+          part="form-control-label"
+          class="form-control__label"
+          for="input"
+          aria-hidden=${e ? "false" : "true"}
+        >
+          <slot name="label">${this.label}</slot>
+        </label>
+
+        <div part="form-control-input" class="form-control-input">
+          <div
+            part="base"
+            class=${it({
+      input: !0,
+      // Sizes
+      "input--small": this.size === "small",
+      "input--medium": this.size === "medium",
+      "input--large": this.size === "large",
+      // States
+      "input--pill": this.pill,
+      "input--standard": !this.filled,
+      "input--filled": this.filled,
+      "input--disabled": this.disabled,
+      "input--focused": this.hasFocus,
+      "input--empty": !this.value,
+      "input--no-spin-buttons": this.noSpinButtons
+    })}
+          >
+            <span part="prefix" class="input__prefix">
+              <slot name="prefix"></slot>
+            </span>
+
+            <input
+              part="input"
+              id="input"
+              class="input__control"
+              type=${this.type === "password" && this.passwordVisible ? "text" : this.type}
+              title=${this.title}
+              name=${m(this.name)}
+              ?disabled=${this.disabled}
+              ?readonly=${this.readonly}
+              ?required=${this.required}
+              placeholder=${m(this.placeholder)}
+              minlength=${m(this.minlength)}
+              maxlength=${m(this.maxlength)}
+              min=${m(this.min)}
+              max=${m(this.max)}
+              step=${m(this.step)}
+              .value=${mo(this.value)}
+              autocapitalize=${m(this.autocapitalize)}
+              autocomplete=${m(this.autocomplete)}
+              autocorrect=${m(this.autocorrect)}
+              ?autofocus=${this.autofocus}
+              spellcheck=${this.spellcheck}
+              pattern=${m(this.pattern)}
+              enterkeyhint=${m(this.enterkeyhint)}
+              inputmode=${m(this.inputmode)}
+              aria-describedby="help-text"
+              @change=${this.handleChange}
+              @input=${this.handleInput}
+              @invalid=${this.handleInvalid}
+              @keydown=${this.handleKeyDown}
+              @focus=${this.handleFocus}
+              @blur=${this.handleBlur}
+            />
+
+            ${i ? v`
+                  <button
+                    part="clear-button"
+                    class="input__clear"
+                    type="button"
+                    aria-label=${this.localize.term("clearEntry")}
+                    @click=${this.handleClearClick}
+                    tabindex="-1"
+                  >
+                    <slot name="clear-icon">
+                      <sl-icon name="x-circle-fill" library="system"></sl-icon>
+                    </slot>
+                  </button>
+                ` : ""}
+            ${this.passwordToggle && !this.disabled ? v`
+                  <button
+                    part="password-toggle-button"
+                    class="input__password-toggle"
+                    type="button"
+                    aria-label=${this.localize.term(this.passwordVisible ? "hidePassword" : "showPassword")}
+                    @click=${this.handlePasswordToggle}
+                    tabindex="-1"
+                  >
+                    ${this.passwordVisible ? v`
+                          <slot name="show-password-icon">
+                            <sl-icon name="eye-slash" library="system"></sl-icon>
+                          </slot>
+                        ` : v`
+                          <slot name="hide-password-icon">
+                            <sl-icon name="eye" library="system"></sl-icon>
+                          </slot>
+                        `}
+                  </button>
+                ` : ""}
+
+            <span part="suffix" class="input__suffix">
+              <slot name="suffix"></slot>
+            </span>
+          </div>
+        </div>
+
+        <div
+          part="form-control-help-text"
+          id="help-text"
+          class="form-control__help-text"
+          aria-hidden=${r ? "false" : "true"}
+        >
+          <slot name="help-text">${this.helpText}</slot>
+        </div>
+      </div>
+    `;
+  }
+};
+h.styles = [Q, Xe, Ge];
+h.dependencies = { "sl-icon": x };
+a([
+  re(".input__control")
+], h.prototype, "input", 2);
+a([
+  at()
+], h.prototype, "hasFocus", 2);
+a([
+  u()
+], h.prototype, "title", 2);
+a([
+  u({ reflect: !0 })
+], h.prototype, "type", 2);
+a([
+  u()
+], h.prototype, "name", 2);
+a([
+  u()
+], h.prototype, "value", 2);
+a([
+  Qe()
+], h.prototype, "defaultValue", 2);
+a([
+  u({ reflect: !0 })
+], h.prototype, "size", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], h.prototype, "filled", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], h.prototype, "pill", 2);
+a([
+  u()
+], h.prototype, "label", 2);
+a([
+  u({ attribute: "help-text" })
+], h.prototype, "helpText", 2);
+a([
+  u({ type: Boolean })
+], h.prototype, "clearable", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], h.prototype, "disabled", 2);
+a([
+  u()
+], h.prototype, "placeholder", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], h.prototype, "readonly", 2);
+a([
+  u({ attribute: "password-toggle", type: Boolean })
+], h.prototype, "passwordToggle", 2);
+a([
+  u({ attribute: "password-visible", type: Boolean })
+], h.prototype, "passwordVisible", 2);
+a([
+  u({ attribute: "no-spin-buttons", type: Boolean })
+], h.prototype, "noSpinButtons", 2);
+a([
+  u({ reflect: !0 })
+], h.prototype, "form", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], h.prototype, "required", 2);
+a([
+  u()
+], h.prototype, "pattern", 2);
+a([
+  u({ type: Number })
+], h.prototype, "minlength", 2);
+a([
+  u({ type: Number })
+], h.prototype, "maxlength", 2);
+a([
+  u()
+], h.prototype, "min", 2);
+a([
+  u()
+], h.prototype, "max", 2);
+a([
+  u()
+], h.prototype, "step", 2);
+a([
+  u()
+], h.prototype, "autocapitalize", 2);
+a([
+  u()
+], h.prototype, "autocorrect", 2);
+a([
+  u()
+], h.prototype, "autocomplete", 2);
+a([
+  u({ type: Boolean })
+], h.prototype, "autofocus", 2);
+a([
+  u()
+], h.prototype, "enterkeyhint", 2);
+a([
+  u({
+    type: Boolean,
+    converter: {
+      // Allow "true|false" attribute values but keep the property boolean
+      fromAttribute: (o) => !(!o || o === "false"),
+      toAttribute: (o) => o ? "true" : "false"
+    }
+  })
+], h.prototype, "spellcheck", 2);
+a([
+  u()
+], h.prototype, "inputmode", 2);
+a([
+  M("disabled", { waitUntilFirstUpdate: !0 })
+], h.prototype, "handleDisabledChange", 1);
+a([
+  M("step", { waitUntilFirstUpdate: !0 })
+], h.prototype, "handleStepChange", 1);
+a([
+  M("value", { waitUntilFirstUpdate: !0 })
+], h.prototype, "handleValueChange", 1);
+h.define("sl-input");
+var go = $`
+  :host {
+    --track-width: 2px;
+    --track-color: rgb(128 128 128 / 25%);
+    --indicator-color: var(--sl-color-primary-600);
+    --speed: 2s;
+
+    display: inline-flex;
+    width: 1em;
+    height: 1em;
+    flex: none;
+  }
+
+  .spinner {
+    flex: 1 1 auto;
+    height: 100%;
+    width: 100%;
+  }
+
+  .spinner__track,
+  .spinner__indicator {
+    fill: none;
+    stroke-width: var(--track-width);
+    r: calc(0.5em - var(--track-width) / 2);
+    cx: 0.5em;
+    cy: 0.5em;
+    transform-origin: 50% 50%;
+  }
+
+  .spinner__track {
+    stroke: var(--track-color);
+    transform-origin: 0% 0%;
+  }
+
+  .spinner__indicator {
+    stroke: var(--indicator-color);
+    stroke-linecap: round;
+    stroke-dasharray: 150% 75%;
+    animation: spin var(--speed) linear infinite;
+  }
+
+  @keyframes spin {
+    0% {
+      transform: rotate(0deg);
+      stroke-dasharray: 0.05em, 3em;
+    }
+
+    50% {
+      transform: rotate(450deg);
+      stroke-dasharray: 1.375em, 1.375em;
+    }
+
+    100% {
+      transform: rotate(1080deg);
+      stroke-dasharray: 0.05em, 3em;
+    }
+  }
+`, he = class extends k {
+  constructor() {
+    super(...arguments), this.localize = new zt(this);
+  }
+  render() {
+    return v`
+      <svg part="base" class="spinner" role="progressbar" aria-label=${this.localize.term("loading")}>
+        <circle class="spinner__track"></circle>
+        <circle class="spinner__indicator"></circle>
+      </svg>
+    `;
+  }
+};
+he.styles = [Q, go];
+var vo = $`
+  :host {
+    display: inline-block;
+    position: relative;
+    width: auto;
+    cursor: pointer;
+  }
+
+  .button {
+    display: inline-flex;
+    align-items: stretch;
+    justify-content: center;
+    width: 100%;
+    border-style: solid;
+    border-width: var(--sl-input-border-width);
+    font-family: var(--sl-input-font-family);
+    font-weight: var(--sl-font-weight-semibold);
+    text-decoration: none;
+    user-select: none;
+    -webkit-user-select: none;
+    white-space: nowrap;
+    vertical-align: middle;
+    padding: 0;
+    transition:
+      var(--sl-transition-x-fast) background-color,
+      var(--sl-transition-x-fast) color,
+      var(--sl-transition-x-fast) border,
+      var(--sl-transition-x-fast) box-shadow;
+    cursor: inherit;
+  }
+
+  .button::-moz-focus-inner {
+    border: 0;
+  }
+
+  .button:focus {
+    outline: none;
+  }
+
+  .button:focus-visible {
+    outline: var(--sl-focus-ring);
+    outline-offset: var(--sl-focus-ring-offset);
+  }
+
+  .button--disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  /* When disabled, prevent mouse events from bubbling up from children */
+  .button--disabled * {
+    pointer-events: none;
+  }
+
+  .button__prefix,
+  .button__suffix {
+    flex: 0 0 auto;
+    display: flex;
+    align-items: center;
+    pointer-events: none;
+  }
+
+  .button__label {
+    display: inline-block;
+  }
+
+  .button__label::slotted(sl-icon) {
+    vertical-align: -2px;
+  }
+
+  /*
+   * Standard buttons
+   */
+
+  /* Default */
+  .button--standard.button--default {
+    background-color: var(--sl-color-neutral-0);
+    border-color: var(--sl-input-border-color);
+    color: var(--sl-color-neutral-700);
+  }
+
+  .button--standard.button--default:hover:not(.button--disabled) {
+    background-color: var(--sl-color-primary-50);
+    border-color: var(--sl-color-primary-300);
+    color: var(--sl-color-primary-700);
+  }
+
+  .button--standard.button--default:active:not(.button--disabled) {
+    background-color: var(--sl-color-primary-100);
+    border-color: var(--sl-color-primary-400);
+    color: var(--sl-color-primary-700);
+  }
+
+  /* Primary */
+  .button--standard.button--primary {
+    background-color: var(--sl-color-primary-600);
+    border-color: var(--sl-color-primary-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--standard.button--primary:hover:not(.button--disabled) {
+    background-color: var(--sl-color-primary-500);
+    border-color: var(--sl-color-primary-500);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--standard.button--primary:active:not(.button--disabled) {
+    background-color: var(--sl-color-primary-600);
+    border-color: var(--sl-color-primary-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /* Success */
+  .button--standard.button--success {
+    background-color: var(--sl-color-success-600);
+    border-color: var(--sl-color-success-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--standard.button--success:hover:not(.button--disabled) {
+    background-color: var(--sl-color-success-500);
+    border-color: var(--sl-color-success-500);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--standard.button--success:active:not(.button--disabled) {
+    background-color: var(--sl-color-success-600);
+    border-color: var(--sl-color-success-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /* Neutral */
+  .button--standard.button--neutral {
+    background-color: var(--sl-color-neutral-600);
+    border-color: var(--sl-color-neutral-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--standard.button--neutral:hover:not(.button--disabled) {
+    background-color: var(--sl-color-neutral-500);
+    border-color: var(--sl-color-neutral-500);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--standard.button--neutral:active:not(.button--disabled) {
+    background-color: var(--sl-color-neutral-600);
+    border-color: var(--sl-color-neutral-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /* Warning */
+  .button--standard.button--warning {
+    background-color: var(--sl-color-warning-600);
+    border-color: var(--sl-color-warning-600);
+    color: var(--sl-color-neutral-0);
+  }
+  .button--standard.button--warning:hover:not(.button--disabled) {
+    background-color: var(--sl-color-warning-500);
+    border-color: var(--sl-color-warning-500);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--standard.button--warning:active:not(.button--disabled) {
+    background-color: var(--sl-color-warning-600);
+    border-color: var(--sl-color-warning-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /* Danger */
+  .button--standard.button--danger {
+    background-color: var(--sl-color-danger-600);
+    border-color: var(--sl-color-danger-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--standard.button--danger:hover:not(.button--disabled) {
+    background-color: var(--sl-color-danger-500);
+    border-color: var(--sl-color-danger-500);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--standard.button--danger:active:not(.button--disabled) {
+    background-color: var(--sl-color-danger-600);
+    border-color: var(--sl-color-danger-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /*
+   * Outline buttons
+   */
+
+  .button--outline {
+    background: none;
+    border: solid 1px;
+  }
+
+  /* Default */
+  .button--outline.button--default {
+    border-color: var(--sl-input-border-color);
+    color: var(--sl-color-neutral-700);
+  }
+
+  .button--outline.button--default:hover:not(.button--disabled),
+  .button--outline.button--default.button--checked:not(.button--disabled) {
+    border-color: var(--sl-color-primary-600);
+    background-color: var(--sl-color-primary-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--outline.button--default:active:not(.button--disabled) {
+    border-color: var(--sl-color-primary-700);
+    background-color: var(--sl-color-primary-700);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /* Primary */
+  .button--outline.button--primary {
+    border-color: var(--sl-color-primary-600);
+    color: var(--sl-color-primary-600);
+  }
+
+  .button--outline.button--primary:hover:not(.button--disabled),
+  .button--outline.button--primary.button--checked:not(.button--disabled) {
+    background-color: var(--sl-color-primary-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--outline.button--primary:active:not(.button--disabled) {
+    border-color: var(--sl-color-primary-700);
+    background-color: var(--sl-color-primary-700);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /* Success */
+  .button--outline.button--success {
+    border-color: var(--sl-color-success-600);
+    color: var(--sl-color-success-600);
+  }
+
+  .button--outline.button--success:hover:not(.button--disabled),
+  .button--outline.button--success.button--checked:not(.button--disabled) {
+    background-color: var(--sl-color-success-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--outline.button--success:active:not(.button--disabled) {
+    border-color: var(--sl-color-success-700);
+    background-color: var(--sl-color-success-700);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /* Neutral */
+  .button--outline.button--neutral {
+    border-color: var(--sl-color-neutral-600);
+    color: var(--sl-color-neutral-600);
+  }
+
+  .button--outline.button--neutral:hover:not(.button--disabled),
+  .button--outline.button--neutral.button--checked:not(.button--disabled) {
+    background-color: var(--sl-color-neutral-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--outline.button--neutral:active:not(.button--disabled) {
+    border-color: var(--sl-color-neutral-700);
+    background-color: var(--sl-color-neutral-700);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /* Warning */
+  .button--outline.button--warning {
+    border-color: var(--sl-color-warning-600);
+    color: var(--sl-color-warning-600);
+  }
+
+  .button--outline.button--warning:hover:not(.button--disabled),
+  .button--outline.button--warning.button--checked:not(.button--disabled) {
+    background-color: var(--sl-color-warning-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--outline.button--warning:active:not(.button--disabled) {
+    border-color: var(--sl-color-warning-700);
+    background-color: var(--sl-color-warning-700);
+    color: var(--sl-color-neutral-0);
+  }
+
+  /* Danger */
+  .button--outline.button--danger {
+    border-color: var(--sl-color-danger-600);
+    color: var(--sl-color-danger-600);
+  }
+
+  .button--outline.button--danger:hover:not(.button--disabled),
+  .button--outline.button--danger.button--checked:not(.button--disabled) {
+    background-color: var(--sl-color-danger-600);
+    color: var(--sl-color-neutral-0);
+  }
+
+  .button--outline.button--danger:active:not(.button--disabled) {
+    border-color: var(--sl-color-danger-700);
+    background-color: var(--sl-color-danger-700);
+    color: var(--sl-color-neutral-0);
+  }
+
+  @media (forced-colors: active) {
+    .button.button--outline.button--checked:not(.button--disabled) {
+      outline: solid 2px transparent;
+    }
+  }
+
+  /*
+   * Text buttons
+   */
+
+  .button--text {
+    background-color: transparent;
+    border-color: transparent;
+    color: var(--sl-color-primary-600);
+  }
+
+  .button--text:hover:not(.button--disabled) {
+    background-color: transparent;
+    border-color: transparent;
+    color: var(--sl-color-primary-500);
+  }
+
+  .button--text:focus-visible:not(.button--disabled) {
+    background-color: transparent;
+    border-color: transparent;
+    color: var(--sl-color-primary-500);
+  }
+
+  .button--text:active:not(.button--disabled) {
+    background-color: transparent;
+    border-color: transparent;
+    color: var(--sl-color-primary-700);
+  }
+
+  /*
+   * Size modifiers
+   */
+
+  .button--small {
+    height: auto;
+    min-height: var(--sl-input-height-small);
+    font-size: var(--sl-button-font-size-small);
+    line-height: calc(var(--sl-input-height-small) - var(--sl-input-border-width) * 2);
+    border-radius: var(--sl-input-border-radius-small);
+  }
+
+  .button--medium {
+    height: auto;
+    min-height: var(--sl-input-height-medium);
+    font-size: var(--sl-button-font-size-medium);
+    line-height: calc(var(--sl-input-height-medium) - var(--sl-input-border-width) * 2);
+    border-radius: var(--sl-input-border-radius-medium);
+  }
+
+  .button--large {
+    height: auto;
+    min-height: var(--sl-input-height-large);
+    font-size: var(--sl-button-font-size-large);
+    line-height: calc(var(--sl-input-height-large) - var(--sl-input-border-width) * 2);
+    border-radius: var(--sl-input-border-radius-large);
+  }
+
+  /*
+   * Pill modifier
+   */
+
+  .button--pill.button--small {
+    border-radius: var(--sl-input-height-small);
+  }
+
+  .button--pill.button--medium {
+    border-radius: var(--sl-input-height-medium);
+  }
+
+  .button--pill.button--large {
+    border-radius: var(--sl-input-height-large);
+  }
+
+  /*
+   * Circle modifier
+   */
+
+  .button--circle {
+    padding-left: 0;
+    padding-right: 0;
+  }
+
+  .button--circle.button--small {
+    width: var(--sl-input-height-small);
+    border-radius: 50%;
+  }
+
+  .button--circle.button--medium {
+    width: var(--sl-input-height-medium);
+    border-radius: 50%;
+  }
+
+  .button--circle.button--large {
+    width: var(--sl-input-height-large);
+    border-radius: 50%;
+  }
+
+  .button--circle .button__prefix,
+  .button--circle .button__suffix,
+  .button--circle .button__caret {
+    display: none;
+  }
+
+  /*
+   * Caret modifier
+   */
+
+  .button--caret .button__suffix {
+    display: none;
+  }
+
+  .button--caret .button__caret {
+    height: auto;
+  }
+
+  /*
+   * Loading modifier
+   */
+
+  .button--loading {
+    position: relative;
+    cursor: wait;
+  }
+
+  .button--loading .button__prefix,
+  .button--loading .button__label,
+  .button--loading .button__suffix,
+  .button--loading .button__caret {
+    visibility: hidden;
+  }
+
+  .button--loading sl-spinner {
+    --indicator-color: currentColor;
+    position: absolute;
+    font-size: 1em;
+    height: 1em;
+    width: 1em;
+    top: calc(50% - 0.5em);
+    left: calc(50% - 0.5em);
+  }
+
+  /*
+   * Badges
+   */
+
+  .button ::slotted(sl-badge) {
+    position: absolute;
+    top: 0;
+    right: 0;
+    translate: 50% -50%;
+    pointer-events: none;
+  }
+
+  .button--rtl ::slotted(sl-badge) {
+    right: auto;
+    left: 0;
+    translate: -50% -50%;
+  }
+
+  /*
+   * Button spacing
+   */
+
+  .button--has-label.button--small .button__label {
+    padding: 0 var(--sl-spacing-small);
+  }
+
+  .button--has-label.button--medium .button__label {
+    padding: 0 var(--sl-spacing-medium);
+  }
+
+  .button--has-label.button--large .button__label {
+    padding: 0 var(--sl-spacing-large);
+  }
+
+  .button--has-prefix.button--small {
+    padding-inline-start: var(--sl-spacing-x-small);
+  }
+
+  .button--has-prefix.button--small .button__label {
+    padding-inline-start: var(--sl-spacing-x-small);
+  }
+
+  .button--has-prefix.button--medium {
+    padding-inline-start: var(--sl-spacing-small);
+  }
+
+  .button--has-prefix.button--medium .button__label {
+    padding-inline-start: var(--sl-spacing-small);
+  }
+
+  .button--has-prefix.button--large {
+    padding-inline-start: var(--sl-spacing-small);
+  }
+
+  .button--has-prefix.button--large .button__label {
+    padding-inline-start: var(--sl-spacing-small);
+  }
+
+  .button--has-suffix.button--small,
+  .button--caret.button--small {
+    padding-inline-end: var(--sl-spacing-x-small);
+  }
+
+  .button--has-suffix.button--small .button__label,
+  .button--caret.button--small .button__label {
+    padding-inline-end: var(--sl-spacing-x-small);
+  }
+
+  .button--has-suffix.button--medium,
+  .button--caret.button--medium {
+    padding-inline-end: var(--sl-spacing-small);
+  }
+
+  .button--has-suffix.button--medium .button__label,
+  .button--caret.button--medium .button__label {
+    padding-inline-end: var(--sl-spacing-small);
+  }
+
+  .button--has-suffix.button--large,
+  .button--caret.button--large {
+    padding-inline-end: var(--sl-spacing-small);
+  }
+
+  .button--has-suffix.button--large .button__label,
+  .button--caret.button--large .button__label {
+    padding-inline-end: var(--sl-spacing-small);
+  }
+
+  /*
+   * Button groups support a variety of button types (e.g. buttons with tooltips, buttons as dropdown triggers, etc.).
+   * This means buttons aren't always direct descendants of the button group, thus we can't target them with the
+   * ::slotted selector. To work around this, the button group component does some magic to add these special classes to
+   * buttons and we style them here instead.
+   */
+
+  :host([data-sl-button-group__button--first]:not([data-sl-button-group__button--last])) .button {
+    border-start-end-radius: 0;
+    border-end-end-radius: 0;
+  }
+
+  :host([data-sl-button-group__button--inner]) .button {
+    border-radius: 0;
+  }
+
+  :host([data-sl-button-group__button--last]:not([data-sl-button-group__button--first])) .button {
+    border-start-start-radius: 0;
+    border-end-start-radius: 0;
+  }
+
+  /* All except the first */
+  :host([data-sl-button-group__button]:not([data-sl-button-group__button--first])) {
+    margin-inline-start: calc(-1 * var(--sl-input-border-width));
+  }
+
+  /* Add a visual separator between solid buttons */
+  :host(
+      [data-sl-button-group__button]:not(
+          [data-sl-button-group__button--first],
+          [data-sl-button-group__button--radio],
+          [variant='default']
+        ):not(:hover)
+    )
+    .button:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    inset-inline-start: 0;
+    bottom: 0;
+    border-left: solid 1px rgb(128 128 128 / 33%);
+    mix-blend-mode: multiply;
+  }
+
+  /* Bump hovered, focused, and checked buttons up so their focus ring isn't clipped */
+  :host([data-sl-button-group__button--hover]) {
+    z-index: 1;
+  }
+
+  /* Focus and checked are always on top */
+  :host([data-sl-button-group__button--focus]),
+  :host([data-sl-button-group__button][checked]) {
+    z-index: 2;
+  }
+`;
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const pe = Symbol.for(""), yo = (o) => {
+  if ((o == null ? void 0 : o.r) === pe) return o == null ? void 0 : o._$litStatic$;
+}, Kt = (o, ...t) => ({ _$litStatic$: t.reduce((e, r, s) => e + ((i) => {
+  if (i._$litStatic$ !== void 0) return i._$litStatic$;
+  throw Error(`Value passed to 'literal' function must be a 'literal' result: ${i}. Use 'unsafeStatic' to pass non-literal values, but
+            take care to ensure page security.`);
+})(r) + o[s + 1], o[0]), r: pe }), Zt = /* @__PURE__ */ new Map(), wo = (o) => (t, ...e) => {
+  const r = e.length;
+  let s, i;
+  const n = [], d = [];
+  let l, c = 0, b = !1;
+  for (; c < r; ) {
+    for (l = t[c]; c < r && (i = e[c], (s = yo(i)) !== void 0); ) l += s + t[++c], b = !0;
+    c !== r && d.push(i), n.push(l), c++;
+  }
+  if (c === r && n.push(t[r]), b) {
+    const p = n.join("$$lit$$");
+    (t = Zt.get(p)) === void 0 && (n.raw = n, Zt.set(p, t = n)), e = d;
+  }
+  return o(t, ...e);
+}, ft = wo(v);
+var f = class extends k {
+  constructor() {
+    super(...arguments), this.formControlController = new ae(this, {
+      assumeInteractionOn: ["click"]
+    }), this.hasSlotController = new St(this, "[default]", "prefix", "suffix"), this.localize = new zt(this), this.hasFocus = !1, this.invalid = !1, this.title = "", this.variant = "default", this.size = "medium", this.caret = !1, this.disabled = !1, this.loading = !1, this.outline = !1, this.pill = !1, this.circle = !1, this.type = "button", this.name = "", this.value = "", this.href = "", this.rel = "noreferrer noopener";
+  }
+  /** Gets the validity state object */
+  get validity() {
+    return this.isButton() ? this.button.validity : Et;
+  }
+  /** Gets the validation message */
+  get validationMessage() {
+    return this.isButton() ? this.button.validationMessage : "";
+  }
+  firstUpdated() {
+    this.isButton() && this.formControlController.updateValidity();
+  }
+  handleBlur() {
+    this.hasFocus = !1, this.emit("sl-blur");
+  }
+  handleFocus() {
+    this.hasFocus = !0, this.emit("sl-focus");
+  }
+  handleClick() {
+    this.type === "submit" && this.formControlController.submit(this), this.type === "reset" && this.formControlController.reset(this);
+  }
+  handleInvalid(o) {
+    this.formControlController.setValidity(!1), this.formControlController.emitInvalidEvent(o);
+  }
+  isButton() {
+    return !this.href;
+  }
+  isLink() {
+    return !!this.href;
+  }
+  handleDisabledChange() {
+    this.isButton() && this.formControlController.setValidity(this.disabled);
+  }
+  /** Simulates a click on the button. */
+  click() {
+    this.button.click();
+  }
+  /** Sets focus on the button. */
+  focus(o) {
+    this.button.focus(o);
+  }
+  /** Removes focus from the button. */
+  blur() {
+    this.button.blur();
+  }
+  /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
+  checkValidity() {
+    return this.isButton() ? this.button.checkValidity() : !0;
+  }
+  /** Gets the associated form, if one exists. */
+  getForm() {
+    return this.formControlController.getForm();
+  }
+  /** Checks for validity and shows the browser's validation message if the control is invalid. */
+  reportValidity() {
+    return this.isButton() ? this.button.reportValidity() : !0;
+  }
+  /** Sets a custom validation message. Pass an empty string to restore validity. */
+  setCustomValidity(o) {
+    this.isButton() && (this.button.setCustomValidity(o), this.formControlController.updateValidity());
+  }
+  render() {
+    const o = this.isLink(), t = o ? Kt`a` : Kt`button`;
+    return ft`
+      <${t}
+        part="base"
+        class=${it({
+      button: !0,
+      "button--default": this.variant === "default",
+      "button--primary": this.variant === "primary",
+      "button--success": this.variant === "success",
+      "button--neutral": this.variant === "neutral",
+      "button--warning": this.variant === "warning",
+      "button--danger": this.variant === "danger",
+      "button--text": this.variant === "text",
+      "button--small": this.size === "small",
+      "button--medium": this.size === "medium",
+      "button--large": this.size === "large",
+      "button--caret": this.caret,
+      "button--circle": this.circle,
+      "button--disabled": this.disabled,
+      "button--focused": this.hasFocus,
+      "button--loading": this.loading,
+      "button--standard": !this.outline,
+      "button--outline": this.outline,
+      "button--pill": this.pill,
+      "button--rtl": this.localize.dir() === "rtl",
+      "button--has-label": this.hasSlotController.test("[default]"),
+      "button--has-prefix": this.hasSlotController.test("prefix"),
+      "button--has-suffix": this.hasSlotController.test("suffix")
+    })}
+        ?disabled=${m(o ? void 0 : this.disabled)}
+        type=${m(o ? void 0 : this.type)}
+        title=${this.title}
+        name=${m(o ? void 0 : this.name)}
+        value=${m(o ? void 0 : this.value)}
+        href=${m(o ? this.href : void 0)}
+        target=${m(o ? this.target : void 0)}
+        download=${m(o ? this.download : void 0)}
+        rel=${m(o ? this.rel : void 0)}
+        role=${m(o ? void 0 : "button")}
+        aria-disabled=${this.disabled ? "true" : "false"}
+        tabindex=${this.disabled ? "-1" : "0"}
+        @blur=${this.handleBlur}
+        @focus=${this.handleFocus}
+        @invalid=${this.isButton() ? this.handleInvalid : null}
+        @click=${this.handleClick}
+      >
+        <slot name="prefix" part="prefix" class="button__prefix"></slot>
+        <slot part="label" class="button__label"></slot>
+        <slot name="suffix" part="suffix" class="button__suffix"></slot>
+        ${this.caret ? ft` <sl-icon part="caret" class="button__caret" library="system" name="caret"></sl-icon> ` : ""}
+        ${this.loading ? ft`<sl-spinner part="spinner"></sl-spinner>` : ""}
+      </${t}>
+    `;
+  }
+};
+f.styles = [Q, vo];
+f.dependencies = {
+  "sl-icon": x,
+  "sl-spinner": he
+};
+a([
+  re(".button")
+], f.prototype, "button", 2);
+a([
+  at()
+], f.prototype, "hasFocus", 2);
+a([
+  at()
+], f.prototype, "invalid", 2);
+a([
+  u()
+], f.prototype, "title", 2);
+a([
+  u({ reflect: !0 })
+], f.prototype, "variant", 2);
+a([
+  u({ reflect: !0 })
+], f.prototype, "size", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], f.prototype, "caret", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], f.prototype, "disabled", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], f.prototype, "loading", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], f.prototype, "outline", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], f.prototype, "pill", 2);
+a([
+  u({ type: Boolean, reflect: !0 })
+], f.prototype, "circle", 2);
+a([
+  u()
+], f.prototype, "type", 2);
+a([
+  u()
+], f.prototype, "name", 2);
+a([
+  u()
+], f.prototype, "value", 2);
+a([
+  u()
+], f.prototype, "href", 2);
+a([
+  u()
+], f.prototype, "target", 2);
+a([
+  u()
+], f.prototype, "rel", 2);
+a([
+  u()
+], f.prototype, "download", 2);
+a([
+  u()
+], f.prototype, "form", 2);
+a([
+  u({ attribute: "formaction" })
+], f.prototype, "formAction", 2);
+a([
+  u({ attribute: "formenctype" })
+], f.prototype, "formEnctype", 2);
+a([
+  u({ attribute: "formmethod" })
+], f.prototype, "formMethod", 2);
+a([
+  u({ attribute: "formnovalidate", type: Boolean })
+], f.prototype, "formNoValidate", 2);
+a([
+  u({ attribute: "formtarget" })
+], f.prototype, "formTarget", 2);
+a([
+  M("disabled", { waitUntilFirstUpdate: !0 })
+], f.prototype, "handleDisabledChange", 1);
+f.define("sl-button");
+class wt extends S {
+  constructor() {
+    super(), this.username = "", this.password = "", this.disabled = !1;
+  }
+  handleSubmit(t) {
+    t.preventDefault(), this.dispatchEvent(
+      new CustomEvent("login-attempt", {
+        detail: {
+          username: this.username,
+          password: this.password
+        },
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  handleInputChange(t) {
+    const { name: e, value: r } = t.target;
+    this[e] = r;
+  }
+  render() {
+    return v`
+      <sl-card>
+        <form @submit="${this.handleSubmit}">
+          <sl-input 
+            name="username"
+            placeholder="Username or Email" 
+            .value="${this.username}" 
+            autocomplete="username"
+            @sl-change="${this.handleInputChange}">
+          </sl-input>
+          <sl-input 
+            type="password" 
+            name="password"
+            placeholder="Password"
+            .value="${this.password}"
+            autocomplete="current-password"
+            @sl-change="${this.handleInputChange}">
+          </sl-input>
+          <sl-button type="submit" ?disabled="${this.disabled}">Login</sl-button>
+        </form>
+      </sl-card>
+    `;
+  }
+}
+E(wt, "styles", $`
+    :host {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: 100vh;
+      box-sizing: border-box;
+    }
+    sl-card {
+      width: 300px;
+      --padding: var(--sl-card-padding);
+      --background-color: var(--sl-card-background-color);
+      --border-radius: var(--sl-card-border-radius);
+      --box-shadow: var(--sl-card-shadow);
+    }
+    sl-input, sl-button {
+      width: 100%;
+      margin-bottom: 10px;
+    }
+  `), E(wt, "properties", {
+  username: { type: String },
+  password: { type: String },
+  disabled: { type: Boolean, reflect: !0 }
+});
+customElements.define("studio-login", wt);
+class _t extends S {
+  constructor() {
+    super(), this.currentPassword = "", this.newPassword = "", this.confirmPassword = "";
+  }
+  render() {
+    return v`
+      <form @submit="${this.handleSubmit}">
+        <input type="password" name="currentPassword" 
+          autocomplete="current-password"
+          placeholder="Current Password"
+          .value="${this.currentPassword}"
+          @input="${this.updateProperty("currentPassword")}"
+        >
+        <input type="password" name="newPassword"
+          placeholder="New Password"
+          .value="${this.newPassword}"
+          @input="${this.updateProperty("newPassword")}"
+        >
+        <input type="password" name="confirmPassword"
+          placeholder="Confirm New Password"
+          .value="${this.confirmPassword}"
+          @input="${this.updateProperty("confirmPassword")}"
+        >
+        <button type="submit">Change Password</button>
+      </form>
+    `;
+  }
+  updateProperty(t) {
+    return (e) => {
+      this[t] = e.target.value;
+    };
+  }
+  handleSubmit(t) {
+    t.preventDefault(), this.newPassword === this.confirmPassword ? this.dispatchEvent(new CustomEvent("change-password", {
+      detail: {
+        currentPassword: this.currentPassword,
+        newPassword: this.newPassword
+      }
+    })) : alert("The new passwords do not match.");
+  }
+}
+E(_t, "styles", $`
+    :host {
+      display: block;
+      box-sizing: border-box;
+    }
+    input, button {
+      width: 100%;
+      margin-bottom: 10px;
+      padding: 8px;
+      box-sizing: border-box;
+    }
+  `), E(_t, "properties", {
+  currentPassword: { type: String },
+  newPassword: { type: String },
+  confirmPassword: { type: String }
+});
+customElements.define("studio-change-password", _t);
+class $t extends S {
+  constructor() {
+    super(), this.apibaseurl = "", this.error = "", this.isAwaiting = !1, this.lastResult = void 0, this.forceChangePassword = !1, this.handleLogin = this.handleLogin.bind(this), this.handleLoginResult = this.handleLoginResult.bind(this), this.handleLoginError = this.handleLoginError.bind(this), this.renderPasswordChangeForm = this.renderPasswordChangeForm.bind(this);
+  }
+  handleLogin(t) {
+    this.isAwaiting = !0;
+    const { username: e, password: r } = t.detail, s = mt({ baseUrl: this.apibaseurl });
+    this.requestUpdate(), s.mintToken({ username: e, password: r }).then(this.handleLoginResult).catch(this.handleLoginError);
+  }
+  handleLoginResult(t) {
+    var e;
+    this.error = "", this.isAwaiting = !1, this.lastResult = t, ((e = t.challenge) == null ? void 0 : e.name) === "NEW_PASSWORD_REQUIRED" ? (this.forceChangePassword = !0, this.error = "You must set a new password to continue.") : this.dispatchEvent(new CustomEvent("login-success", { detail: t })), this.requestUpdate();
+  }
+  handleLoginError(t) {
+    var e, r;
+    console.error("Error logging in:", t), this.error = ((r = (e = t == null ? void 0 : t.body) == null ? void 0 : e.error) == null ? void 0 : r.message) || "Invalid username or password", this.isAwaiting = !1, this.requestUpdate();
+  }
+  handleChangePassword(t) {
+    const { currentPassword: e, newPassword: r } = t.detail, { token: s } = this.lastResult, i = mt({ baseUrl: this.apibaseurl });
+    this.requestUpdate(), i.updatePassword({ token: s, currentPassword: e, newPassword: r }).then(() => {
+      this.forceChangePassword = !1, this.error = "Login with your new password.", this.isAwaiting = !1, this.requestUpdate();
+    }).catch((n) => {
+      var d, l;
+      this.error = ((l = (d = n == null ? void 0 : n.body) == null ? void 0 : d.error) == null ? void 0 : l.message) || n.message, this.isAwaiting = !1, this.requestUpdate();
+    });
+  }
+  renderPasswordChangeForm() {
+    return v`
+      <div>
+      ${this.error ? v`<div class="error">${this.error}</div>` : null}
+      <studio-change-password @change-password=${this.handleChangePassword}>
+      </studio-change-password>
+      </div>
+    `;
+  }
+  renderLoginForm() {
+    return v`
+        ${this.error ? v`<div class="error">${this.error}</div>` : null}
+        <studio-login
+          @login-attempt=${this.handleLogin}
+          ?disabled=${this.isAwaiting}
+        ></studio-login>
+    `;
+  }
+  render() {
+    return this.forceChangePassword ? this.renderPasswordChangeForm() : this.renderLoginForm();
+  }
+}
+E($t, "properties", {
+  apibaseurl: { type: String },
+  error: { type: String }
+}), E($t, "styles", $`
+    :host {
+      display: block;
+      max-width: 400px;
+      margin: 0 auto;
+    }
+  `);
+window.customElements.define("mod-auth-login-form", $t);
+function be({ studio: o, config: t }) {
+  return new Promise((e, r) => {
+    let s = window.sessionStorage.getItem(K());
+    if (s) {
+      ko(s) ? _o({ studio: o, config: t, token: s }).then(e).catch((l) => {
+        console.error("Failed to refresh token:", l), window.sessionStorage.removeItem(K()), be({ studio: o, config: t }).then(e).catch(r);
+      }) : e(s);
+      return;
+    }
+    const i = (l) => (window.sessionStorage.setItem(K(), l), l);
+    let n;
+    const d = (l) => {
+      const { token: c } = l.detail;
+      i(c), e(c), o.pub("system::workspace", "dismiss", n);
+    };
+    n = v`<mod-auth-login-form
+      id="login"
+      apibaseurl=${t.apibaseurl}
+      @login-success=${d}></mod-auth-login-form>`, o.pub("system::workspace", "present", n);
+  });
+}
+async function _o({ studio: o, config: t, token: e }) {
+  const r = t.apibaseurl, s = mt({ baseUrl: r }), { token: i } = await s.refreshToken({ token: e });
+  return window.sessionStorage.setItem(K(), i), i;
+}
+function $o({ studio: o }) {
+  window.sessionStorage.removeItem(K());
+}
+function xo(o) {
+  return JSON.parse(window.atob(o.split(".")[1].replace(/-/g, "+").replace(/_/g, "/")));
+}
+function ko(o, t = 300, e = Date.now()) {
+  return xo(o).exp * 1e3 - t < e;
+}
+function K() {
+  return "studio.wral::auth_token";
+}
+function Eo(o, t) {
+  o.sub("studio.wral::mod-auth", "token-request", ({ state: e }) => {
+    const { callback: r } = e.value;
+    r ? be({ studio: o, config: t }).then((s) => r(s)).catch((s) => r(null, s)) : console.warn("No token callback defined");
+  }), o.sub("studio.wral::mod-auth", "logout", () => {
+    $o({ studio: o });
+  });
+}
+export {
+  Eo as init
+};