@cal.macconnachie/web-components 0.0.1

package/dist/index

@@ -0,0 +1,2437 @@
+import { css as kt, LitElement as Ct, nothing as $, html as m } from "lit";
+const xt = (e) => (t, s) => {
+  s !== void 0 ? s.addInitializer((() => {
+    customElements.define(e, t);
+  })) : customElements.define(e, t);
+};
+const z = globalThis, Z = z.ShadowRoot && (z.ShadyCSS === void 0 || z.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, yt = Symbol(), it = /* @__PURE__ */ new WeakMap();
+let Et = class {
+  constructor(t, s, i) {
+    if (this._$cssResult$ = !0, i !== yt) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    this.cssText = t, this.t = s;
+  }
+  get styleSheet() {
+    let t = this.o;
+    const s = this.t;
+    if (Z && t === void 0) {
+      const i = s !== void 0 && s.length === 1;
+      i && (t = it.get(s)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), i && it.set(s, t));
+    }
+    return t;
+  }
+  toString() {
+    return this.cssText;
+  }
+};
+const Tt = (e) => new Et(typeof e == "string" ? e : e + "", void 0, yt), Pt = (e, t) => {
+  if (Z) e.adoptedStyleSheets = t.map(((s) => s instanceof CSSStyleSheet ? s : s.styleSheet));
+  else for (const s of t) {
+    const i = document.createElement("style"), r = z.litNonce;
+    r !== void 0 && i.setAttribute("nonce", r), i.textContent = s.cssText, e.appendChild(i);
+  }
+}, rt = Z ? (e) => e : (e) => e instanceof CSSStyleSheet ? ((t) => {
+  let s = "";
+  for (const i of t.cssRules) s += i.cssText;
+  return Tt(s);
+})(e) : e;
+const { is: Ot, defineProperty: Dt, getOwnPropertyDescriptor: Ut, getOwnPropertyNames: Rt, getOwnPropertySymbols: It, getPrototypeOf: Nt } = Object, F = globalThis, ot = F.trustedTypes, Lt = ot ? ot.emptyScript : "", Mt = F.reactiveElementPolyfillSupport, M = (e, t) => e, B = { toAttribute(e, t) {
+  switch (t) {
+    case Boolean:
+      e = e ? Lt : null;
+      break;
+    case Object:
+    case Array:
+      e = e == null ? e : JSON.stringify(e);
+  }
+  return e;
+}, fromAttribute(e, t) {
+  let s = e;
+  switch (t) {
+    case Boolean:
+      s = e !== null;
+      break;
+    case Number:
+      s = e === null ? null : Number(e);
+      break;
+    case Object:
+    case Array:
+      try {
+        s = JSON.parse(e);
+      } catch {
+        s = null;
+      }
+  }
+  return s;
+} }, Q = (e, t) => !Ot(e, t), at = { attribute: !0, type: String, converter: B, reflect: !1, useDefault: !1, hasChanged: Q };
+Symbol.metadata ??= Symbol("metadata"), F.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
+class I extends HTMLElement {
+  static addInitializer(t) {
+    this._$Ei(), (this.l ??= []).push(t);
+  }
+  static get observedAttributes() {
+    return this.finalize(), this._$Eh && [...this._$Eh.keys()];
+  }
+  static createProperty(t, s = at) {
+    if (s.state && (s.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(t) && ((s = Object.create(s)).wrapped = !0), this.elementProperties.set(t, s), !s.noAccessor) {
+      const i = Symbol(), r = this.getPropertyDescriptor(t, i, s);
+      r !== void 0 && Dt(this.prototype, t, r);
+    }
+  }
+  static getPropertyDescriptor(t, s, i) {
+    const { get: r, set: o } = Ut(this.prototype, t) ?? { get() {
+      return this[s];
+    }, set(a) {
+      this[s] = a;
+    } };
+    return { get: r, set(a) {
+      const h = r?.call(this);
+      o?.call(this, a), this.requestUpdate(t, h, i);
+    }, configurable: !0, enumerable: !0 };
+  }
+  static getPropertyOptions(t) {
+    return this.elementProperties.get(t) ?? at;
+  }
+  static _$Ei() {
+    if (this.hasOwnProperty(M("elementProperties"))) return;
+    const t = Nt(this);
+    t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
+  }
+  static finalize() {
+    if (this.hasOwnProperty(M("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(M("properties"))) {
+      const s = this.properties, i = [...Rt(s), ...It(s)];
+      for (const r of i) this.createProperty(r, s[r]);
+    }
+    const t = this[Symbol.metadata];
+    if (t !== null) {
+      const s = litPropertyMetadata.get(t);
+      if (s !== void 0) for (const [i, r] of s) this.elementProperties.set(i, r);
+    }
+    this._$Eh = /* @__PURE__ */ new Map();
+    for (const [s, i] of this.elementProperties) {
+      const r = this._$Eu(s, i);
+      r !== void 0 && this._$Eh.set(r, s);
+    }
+    this.elementStyles = this.finalizeStyles(this.styles);
+  }
+  static finalizeStyles(t) {
+    const s = [];
+    if (Array.isArray(t)) {
+      const i = new Set(t.flat(1 / 0).reverse());
+      for (const r of i) s.unshift(rt(r));
+    } else t !== void 0 && s.push(rt(t));
+    return s;
+  }
+  static _$Eu(t, s) {
+    const i = s.attribute;
+    return i === !1 ? void 0 : typeof i == "string" ? i : 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() {
+    this._$ES = new Promise(((t) => this.enableUpdating = t)), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), this.constructor.l?.forEach(((t) => t(this)));
+  }
+  addController(t) {
+    (this._$EO ??= /* @__PURE__ */ new Set()).add(t), this.renderRoot !== void 0 && this.isConnected && t.hostConnected?.();
+  }
+  removeController(t) {
+    this._$EO?.delete(t);
+  }
+  _$E_() {
+    const t = /* @__PURE__ */ new Map(), s = this.constructor.elementProperties;
+    for (const i of s.keys()) this.hasOwnProperty(i) && (t.set(i, this[i]), delete this[i]);
+    t.size > 0 && (this._$Ep = t);
+  }
+  createRenderRoot() {
+    const t = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
+    return Pt(t, this.constructor.elementStyles), t;
+  }
+  connectedCallback() {
+    this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$EO?.forEach(((t) => t.hostConnected?.()));
+  }
+  enableUpdating(t) {
+  }
+  disconnectedCallback() {
+    this._$EO?.forEach(((t) => t.hostDisconnected?.()));
+  }
+  attributeChangedCallback(t, s, i) {
+    this._$AK(t, i);
+  }
+  _$ET(t, s) {
+    const i = this.constructor.elementProperties.get(t), r = this.constructor._$Eu(t, i);
+    if (r !== void 0 && i.reflect === !0) {
+      const o = (i.converter?.toAttribute !== void 0 ? i.converter : B).toAttribute(s, i.type);
+      this._$Em = t, o == null ? this.removeAttribute(r) : this.setAttribute(r, o), this._$Em = null;
+    }
+  }
+  _$AK(t, s) {
+    const i = this.constructor, r = i._$Eh.get(t);
+    if (r !== void 0 && this._$Em !== r) {
+      const o = i.getPropertyOptions(r), a = typeof o.converter == "function" ? { fromAttribute: o.converter } : o.converter?.fromAttribute !== void 0 ? o.converter : B;
+      this._$Em = r;
+      const h = a.fromAttribute(s, o.type);
+      this[r] = h ?? this._$Ej?.get(r) ?? h, this._$Em = null;
+    }
+  }
+  requestUpdate(t, s, i) {
+    if (t !== void 0) {
+      const r = this.constructor, o = this[t];
+      if (i ??= r.getPropertyOptions(t), !((i.hasChanged ?? Q)(o, s) || i.useDefault && i.reflect && o === this._$Ej?.get(t) && !this.hasAttribute(r._$Eu(t, i)))) return;
+      this.C(t, s, i);
+    }
+    this.isUpdatePending === !1 && (this._$ES = this._$EP());
+  }
+  C(t, s, { useDefault: i, reflect: r, wrapped: o }, a) {
+    i && !(this._$Ej ??= /* @__PURE__ */ new Map()).has(t) && (this._$Ej.set(t, a ?? s ?? this[t]), o !== !0 || a !== void 0) || (this._$AL.has(t) || (this.hasUpdated || i || (s = void 0), this._$AL.set(t, s)), r === !0 && this._$Em !== t && (this._$Eq ??= /* @__PURE__ */ new Set()).add(t));
+  }
+  async _$EP() {
+    this.isUpdatePending = !0;
+    try {
+      await this._$ES;
+    } catch (s) {
+      Promise.reject(s);
+    }
+    const t = this.scheduleUpdate();
+    return t != null && await t, !this.isUpdatePending;
+  }
+  scheduleUpdate() {
+    return this.performUpdate();
+  }
+  performUpdate() {
+    if (!this.isUpdatePending) return;
+    if (!this.hasUpdated) {
+      if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) {
+        for (const [r, o] of this._$Ep) this[r] = o;
+        this._$Ep = void 0;
+      }
+      const i = this.constructor.elementProperties;
+      if (i.size > 0) for (const [r, o] of i) {
+        const { wrapped: a } = o, h = this[r];
+        a !== !0 || this._$AL.has(r) || h === void 0 || this.C(r, void 0, o, h);
+      }
+    }
+    let t = !1;
+    const s = this._$AL;
+    try {
+      t = this.shouldUpdate(s), t ? (this.willUpdate(s), this._$EO?.forEach(((i) => i.hostUpdate?.())), this.update(s)) : this._$EM();
+    } catch (i) {
+      throw t = !1, this._$EM(), i;
+    }
+    t && this._$AE(s);
+  }
+  willUpdate(t) {
+  }
+  _$AE(t) {
+    this._$EO?.forEach(((s) => s.hostUpdated?.())), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(t)), this.updated(t);
+  }
+  _$EM() {
+    this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1;
+  }
+  get updateComplete() {
+    return this.getUpdateComplete();
+  }
+  getUpdateComplete() {
+    return this._$ES;
+  }
+  shouldUpdate(t) {
+    return !0;
+  }
+  update(t) {
+    this._$Eq &&= this._$Eq.forEach(((s) => this._$ET(s, this[s]))), this._$EM();
+  }
+  updated(t) {
+  }
+  firstUpdated(t) {
+  }
+}
+I.elementStyles = [], I.shadowRootOptions = { mode: "open" }, I[M("elementProperties")] = /* @__PURE__ */ new Map(), I[M("finalized")] = /* @__PURE__ */ new Map(), Mt?.({ ReactiveElement: I }), (F.reactiveElementVersions ??= []).push("2.1.1");
+const Ht = { attribute: !0, type: String, converter: B, reflect: !1, hasChanged: Q }, jt = (e = Ht, t, s) => {
+  const { kind: i, metadata: r } = s;
+  let o = globalThis.litPropertyMetadata.get(r);
+  if (o === void 0 && globalThis.litPropertyMetadata.set(r, o = /* @__PURE__ */ new Map()), i === "setter" && ((e = Object.create(e)).wrapped = !0), o.set(s.name, e), i === "accessor") {
+    const { name: a } = s;
+    return { set(h) {
+      const n = t.get.call(this);
+      t.set.call(this, h), this.requestUpdate(a, n, e);
+    }, init(h) {
+      return h !== void 0 && this.C(a, void 0, e, h), h;
+    } };
+  }
+  if (i === "setter") {
+    const { name: a } = s;
+    return function(h) {
+      const n = this[a];
+      t.call(this, h), this.requestUpdate(a, n, e);
+    };
+  }
+  throw Error("Unsupported decorator location: " + i);
+};
+function k(e) {
+  return (t, s) => typeof s == "object" ? jt(e, t, s) : ((i, r, o) => {
+    const a = r.hasOwnProperty(o);
+    return r.constructor.createProperty(o, i), a ? Object.getOwnPropertyDescriptor(r, o) : void 0;
+  })(e, t, s);
+}
+function b(e) {
+  return k({ ...e, state: !0, attribute: !1 });
+}
+const qt = (e, t, s) => (s.configurable = !0, s.enumerable = !0, Reflect.decorate && typeof t != "object" && Object.defineProperty(e, t, s), s);
+function X(e, t) {
+  return (s, i, r) => {
+    const o = (a) => a.renderRoot?.querySelector(e) ?? null;
+    return qt(s, i, { get() {
+      return o(this);
+    } });
+  };
+}
+const tt = globalThis, Y = tt.trustedTypes, nt = Y ? Y.createPolicy("lit-html", { createHTML: (e) => e }) : void 0, wt = "$lit$", x = `lit$${Math.random().toFixed(9).slice(2)}$`, $t = "?" + x, zt = `<${$t}>`, D = document, K = () => D.createComment(""), H = (e) => e === null || typeof e != "object" && typeof e != "function", et = Array.isArray, Bt = (e) => et(e) || typeof e?.[Symbol.iterator] == "function", W = `[ 	
+\f\r]`, N = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, lt = /-->/g, ht = />/g, T = RegExp(`>|${W}(?:([^\\s"'>=/]+)(${W}*=${W}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g"), ct = /'/g, dt = /"/g, bt = /^(?:script|style|textarea|title)$/i, U = Symbol.for("lit-noChange"), A = Symbol.for("lit-nothing"), pt = /* @__PURE__ */ new WeakMap(), O = D.createTreeWalker(D, 129);
+function vt(e, t) {
+  if (!et(e) || !e.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return nt !== void 0 ? nt.createHTML(t) : t;
+}
+const Yt = (e, t) => {
+  const s = e.length - 1, i = [];
+  let r, o = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", a = N;
+  for (let h = 0; h < s; h++) {
+    const n = e[h];
+    let c, p, l = -1, d = 0;
+    for (; d < n.length && (a.lastIndex = d, p = a.exec(n), p !== null); ) d = a.lastIndex, a === N ? p[1] === "!--" ? a = lt : p[1] !== void 0 ? a = ht : p[2] !== void 0 ? (bt.test(p[2]) && (r = RegExp("</" + p[2], "g")), a = T) : p[3] !== void 0 && (a = T) : a === T ? p[0] === ">" ? (a = r ?? N, l = -1) : p[1] === void 0 ? l = -2 : (l = a.lastIndex - p[2].length, c = p[1], a = p[3] === void 0 ? T : p[3] === '"' ? dt : ct) : a === dt || a === ct ? a = T : a === lt || a === ht ? a = N : (a = T, r = void 0);
+    const u = a === T && e[h + 1].startsWith("/>") ? " " : "";
+    o += a === N ? n + zt : l >= 0 ? (i.push(c), n.slice(0, l) + wt + n.slice(l) + x + u) : n + x + (l === -2 ? h : u);
+  }
+  return [vt(e, o + (e[s] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), i];
+};
+class j {
+  constructor({ strings: t, _$litType$: s }, i) {
+    let r;
+    this.parts = [];
+    let o = 0, a = 0;
+    const h = t.length - 1, n = this.parts, [c, p] = Yt(t, s);
+    if (this.el = j.createElement(c, i), O.currentNode = this.el.content, s === 2 || s === 3) {
+      const l = this.el.content.firstChild;
+      l.replaceWith(...l.childNodes);
+    }
+    for (; (r = O.nextNode()) !== null && n.length < h; ) {
+      if (r.nodeType === 1) {
+        if (r.hasAttributes()) for (const l of r.getAttributeNames()) if (l.endsWith(wt)) {
+          const d = p[a++], u = r.getAttribute(l).split(x), y = /([.?@])?(.*)/.exec(d);
+          n.push({ type: 1, index: o, name: y[2], strings: u, ctor: y[1] === "." ? Ft : y[1] === "?" ? Vt : y[1] === "@" ? Wt : V }), r.removeAttribute(l);
+        } else l.startsWith(x) && (n.push({ type: 6, index: o }), r.removeAttribute(l));
+        if (bt.test(r.tagName)) {
+          const l = r.textContent.split(x), d = l.length - 1;
+          if (d > 0) {
+            r.textContent = Y ? Y.emptyScript : "";
+            for (let u = 0; u < d; u++) r.append(l[u], K()), O.nextNode(), n.push({ type: 2, index: ++o });
+            r.append(l[d], K());
+          }
+        }
+      } else if (r.nodeType === 8) if (r.data === $t) n.push({ type: 2, index: o });
+      else {
+        let l = -1;
+        for (; (l = r.data.indexOf(x, l + 1)) !== -1; ) n.push({ type: 7, index: o }), l += x.length - 1;
+      }
+      o++;
+    }
+  }
+  static createElement(t, s) {
+    const i = D.createElement("template");
+    return i.innerHTML = t, i;
+  }
+}
+function R(e, t, s = e, i) {
+  if (t === U) return t;
+  let r = i !== void 0 ? s._$Co?.[i] : s._$Cl;
+  const o = H(t) ? void 0 : t._$litDirective$;
+  return r?.constructor !== o && (r?._$AO?.(!1), o === void 0 ? r = void 0 : (r = new o(e), r._$AT(e, s, i)), i !== void 0 ? (s._$Co ??= [])[i] = r : s._$Cl = r), r !== void 0 && (t = R(e, r._$AS(e, t.values), r, i)), t;
+}
+let Kt = class {
+  constructor(t, s) {
+    this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = s;
+  }
+  get parentNode() {
+    return this._$AM.parentNode;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  u(t) {
+    const { el: { content: s }, parts: i } = this._$AD, r = (t?.creationScope ?? D).importNode(s, !0);
+    O.currentNode = r;
+    let o = O.nextNode(), a = 0, h = 0, n = i[0];
+    for (; n !== void 0; ) {
+      if (a === n.index) {
+        let c;
+        n.type === 2 ? c = new q(o, o.nextSibling, this, t) : n.type === 1 ? c = new n.ctor(o, n.name, n.strings, this, t) : n.type === 6 && (c = new Gt(o, this, t)), this._$AV.push(c), n = i[++h];
+      }
+      a !== n?.index && (o = O.nextNode(), a++);
+    }
+    return O.currentNode = D, r;
+  }
+  p(t) {
+    let s = 0;
+    for (const i of this._$AV) i !== void 0 && (i.strings !== void 0 ? (i._$AI(t, i, s), s += i.strings.length - 2) : i._$AI(t[s])), s++;
+  }
+};
+class q {
+  get _$AU() {
+    return this._$AM?._$AU ?? this._$Cv;
+  }
+  constructor(t, s, i, r) {
+    this.type = 2, this._$AH = A, this._$AN = void 0, this._$AA = t, this._$AB = s, this._$AM = i, this.options = r, this._$Cv = r?.isConnected ?? !0;
+  }
+  get parentNode() {
+    let t = this._$AA.parentNode;
+    const s = this._$AM;
+    return s !== void 0 && t?.nodeType === 11 && (t = s.parentNode), t;
+  }
+  get startNode() {
+    return this._$AA;
+  }
+  get endNode() {
+    return this._$AB;
+  }
+  _$AI(t, s = this) {
+    t = R(this, t, s), H(t) ? t === A || t == null || t === "" ? (this._$AH !== A && this._$AR(), this._$AH = A) : t !== this._$AH && t !== U && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : Bt(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 !== A && H(this._$AH) ? this._$AA.nextSibling.data = t : this.T(D.createTextNode(t)), this._$AH = t;
+  }
+  $(t) {
+    const { values: s, _$litType$: i } = t, r = typeof i == "number" ? this._$AC(t) : (i.el === void 0 && (i.el = j.createElement(vt(i.h, i.h[0]), this.options)), i);
+    if (this._$AH?._$AD === r) this._$AH.p(s);
+    else {
+      const o = new Kt(r, this), a = o.u(this.options);
+      o.p(s), this.T(a), this._$AH = o;
+    }
+  }
+  _$AC(t) {
+    let s = pt.get(t.strings);
+    return s === void 0 && pt.set(t.strings, s = new j(t)), s;
+  }
+  k(t) {
+    et(this._$AH) || (this._$AH = [], this._$AR());
+    const s = this._$AH;
+    let i, r = 0;
+    for (const o of t) r === s.length ? s.push(i = new q(this.O(K()), this.O(K()), this, this.options)) : i = s[r], i._$AI(o), r++;
+    r < s.length && (this._$AR(i && i._$AB.nextSibling, r), s.length = r);
+  }
+  _$AR(t = this._$AA.nextSibling, s) {
+    for (this._$AP?.(!1, !0, s); t !== this._$AB; ) {
+      const i = t.nextSibling;
+      t.remove(), t = i;
+    }
+  }
+  setConnected(t) {
+    this._$AM === void 0 && (this._$Cv = t, this._$AP?.(t));
+  }
+}
+class V {
+  get tagName() {
+    return this.element.tagName;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  constructor(t, s, i, r, o) {
+    this.type = 1, this._$AH = A, this._$AN = void 0, this.element = t, this.name = s, this._$AM = r, this.options = o, i.length > 2 || i[0] !== "" || i[1] !== "" ? (this._$AH = Array(i.length - 1).fill(new String()), this.strings = i) : this._$AH = A;
+  }
+  _$AI(t, s = this, i, r) {
+    const o = this.strings;
+    let a = !1;
+    if (o === void 0) t = R(this, t, s, 0), a = !H(t) || t !== this._$AH && t !== U, a && (this._$AH = t);
+    else {
+      const h = t;
+      let n, c;
+      for (t = o[0], n = 0; n < o.length - 1; n++) c = R(this, h[i + n], s, n), c === U && (c = this._$AH[n]), a ||= !H(c) || c !== this._$AH[n], c === A ? t = A : t !== A && (t += (c ?? "") + o[n + 1]), this._$AH[n] = c;
+    }
+    a && !r && this.j(t);
+  }
+  j(t) {
+    t === A ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
+  }
+}
+class Ft extends V {
+  constructor() {
+    super(...arguments), this.type = 3;
+  }
+  j(t) {
+    this.element[this.name] = t === A ? void 0 : t;
+  }
+}
+class Vt extends V {
+  constructor() {
+    super(...arguments), this.type = 4;
+  }
+  j(t) {
+    this.element.toggleAttribute(this.name, !!t && t !== A);
+  }
+}
+class Wt extends V {
+  constructor(t, s, i, r, o) {
+    super(t, s, i, r, o), this.type = 5;
+  }
+  _$AI(t, s = this) {
+    if ((t = R(this, t, s, 0) ?? A) === U) return;
+    const i = this._$AH, r = t === A && i !== A || t.capture !== i.capture || t.once !== i.once || t.passive !== i.passive, o = t !== A && (i === A || r);
+    r && this.element.removeEventListener(this.name, this, i), o && this.element.addEventListener(this.name, this, t), this._$AH = t;
+  }
+  handleEvent(t) {
+    typeof this._$AH == "function" ? this._$AH.call(this.options?.host ?? this.element, t) : this._$AH.handleEvent(t);
+  }
+}
+class Gt {
+  constructor(t, s, i) {
+    this.element = t, this.type = 6, this._$AN = void 0, this._$AM = s, this.options = i;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AI(t) {
+    R(this, t);
+  }
+}
+const Jt = { I: q }, Zt = tt.litHtmlPolyfillSupport;
+Zt?.(j, q), (tt.litHtmlVersions ??= []).push("3.3.1");
+const At = { ATTRIBUTE: 1, CHILD: 2 }, _t = (e) => (...t) => ({ _$litDirective$: e, values: t });
+class St {
+  constructor(t) {
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AT(t, s, i) {
+    this._$Ct = t, this._$AM = s, this._$Ci = i;
+  }
+  _$AS(t, s) {
+    return this.update(t, s);
+  }
+  update(t, s) {
+    return this.render(...s);
+  }
+}
+const ut = _t(class extends St {
+  constructor(e) {
+    if (super(e), e.type !== At.ATTRIBUTE || e.name !== "class" || e.strings?.length > 2) throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.");
+  }
+  render(e) {
+    return " " + Object.keys(e).filter(((t) => e[t])).join(" ") + " ";
+  }
+  update(e, [t]) {
+    if (this.st === void 0) {
+      this.st = /* @__PURE__ */ new Set(), e.strings !== void 0 && (this.nt = new Set(e.strings.join(" ").split(/\s/).filter(((i) => i !== ""))));
+      for (const i in t) t[i] && !this.nt?.has(i) && this.st.add(i);
+      return this.render(t);
+    }
+    const s = e.element.classList;
+    for (const i of this.st) i in t || (s.remove(i), this.st.delete(i));
+    for (const i in t) {
+      const r = !!t[i];
+      r === this.st.has(i) || this.nt?.has(i) || (r ? (s.add(i), this.st.add(i)) : (s.remove(i), this.st.delete(i)));
+    }
+    return U;
+  }
+});
+const { I: Qt } = Jt, gt = () => document.createComment(""), L = (e, t, s) => {
+  const i = e._$AA.parentNode, r = t === void 0 ? e._$AB : t._$AA;
+  if (s === void 0) {
+    const o = i.insertBefore(gt(), r), a = i.insertBefore(gt(), r);
+    s = new Qt(o, a, e, e.options);
+  } else {
+    const o = s._$AB.nextSibling, a = s._$AM, h = a !== e;
+    if (h) {
+      let n;
+      s._$AQ?.(e), s._$AM = e, s._$AP !== void 0 && (n = e._$AU) !== a._$AU && s._$AP(n);
+    }
+    if (o !== r || h) {
+      let n = s._$AA;
+      for (; n !== o; ) {
+        const c = n.nextSibling;
+        i.insertBefore(n, r), n = c;
+      }
+    }
+  }
+  return s;
+}, P = (e, t, s = e) => (e._$AI(t, s), e), Xt = {}, te = (e, t = Xt) => e._$AH = t, ee = (e) => e._$AH, G = (e) => {
+  e._$AR(), e._$AA.remove();
+};
+const mt = (e, t, s) => {
+  const i = /* @__PURE__ */ new Map();
+  for (let r = t; r <= s; r++) i.set(e[r], r);
+  return i;
+}, ft = _t(class extends St {
+  constructor(e) {
+    if (super(e), e.type !== At.CHILD) throw Error("repeat() can only be used in text expressions");
+  }
+  dt(e, t, s) {
+    let i;
+    s === void 0 ? s = t : t !== void 0 && (i = t);
+    const r = [], o = [];
+    let a = 0;
+    for (const h of e) r[a] = i ? i(h, a) : a, o[a] = s(h, a), a++;
+    return { values: o, keys: r };
+  }
+  render(e, t, s) {
+    return this.dt(e, t, s).values;
+  }
+  update(e, [t, s, i]) {
+    const r = ee(e), { values: o, keys: a } = this.dt(t, s, i);
+    if (!Array.isArray(r)) return this.ut = a, o;
+    const h = this.ut ??= [], n = [];
+    let c, p, l = 0, d = r.length - 1, u = 0, y = o.length - 1;
+    for (; l <= d && u <= y; ) if (r[l] === null) l++;
+    else if (r[d] === null) d--;
+    else if (h[l] === a[u]) n[u] = P(r[l], o[u]), l++, u++;
+    else if (h[d] === a[y]) n[y] = P(r[d], o[y]), d--, y--;
+    else if (h[l] === a[y]) n[y] = P(r[l], o[y]), L(e, n[y + 1], r[l]), l++, y--;
+    else if (h[d] === a[u]) n[u] = P(r[d], o[u]), L(e, r[l], r[d]), d--, u++;
+    else if (c === void 0 && (c = mt(a, u, y), p = mt(h, l, d)), c.has(h[l])) if (c.has(h[d])) {
+      const v = p.get(a[u]), _ = v !== void 0 ? r[v] : null;
+      if (_ === null) {
+        const w = L(e, r[l]);
+        P(w, o[u]), n[u] = w;
+      } else n[u] = P(_, o[u]), L(e, r[l], _), r[v] = null;
+      u++;
+    } else G(r[d]), d--;
+    else G(r[l]), l++;
+    for (; u <= y; ) {
+      const v = L(e, n[y + 1]);
+      P(v, o[u]), n[u++] = v;
+    }
+    for (; l <= d; ) {
+      const v = r[l++];
+      v !== null && G(v);
+    }
+    return this.ut = a, te(e, n), U;
+  }
+}), se = ({
+  baseUrl: e
+}) => {
+  const t = {
+    login: "auth/login",
+    logout: "auth/logout",
+    refresh: "auth/refresh",
+    requestRegisterOtp: "auth/request-register-otp",
+    register: "auth/register",
+    requestResetPassword: "auth/request-reset-password",
+    resetPassword: "auth/reset-password"
+  };
+  return {
+    login: async ({
+      email: c,
+      password: p,
+      accessToken: l,
+      refreshToken: d,
+      idToken: u
+    }) => {
+      const y = await fetch(`${e}${t.login}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          email: c,
+          password: p,
+          accessToken: l,
+          refreshToken: d,
+          idToken: u
+        })
+      });
+      if (!y.ok) {
+        const v = await y.json();
+        throw new Error(v.message || v.error || "Login failed");
+      }
+      return y.json();
+    },
+    logout: async ({
+      accessToken: c,
+      refreshToken: p,
+      authToken: l
+    }) => {
+      const d = await fetch(`${e}${t.logout}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          Authorization: `Bearer ${l}`
+        },
+        body: JSON.stringify({
+          accessToken: c,
+          refreshToken: p
+        })
+      });
+      if (!d.ok) {
+        const u = await d.json();
+        throw new Error(u.message || u.error || "Logout failed");
+      }
+      return d.json();
+    },
+    refresh: async ({ refreshToken: c }) => {
+      const p = await fetch(`${e}${t.refresh}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          refreshToken: c
+        })
+      });
+      if (!p.ok) {
+        const l = await p.json();
+        throw new Error(l.message || l.error || "Failed to refresh token");
+      }
+      return p.json();
+    },
+    requestRegisterOtp: async ({ email: c }) => {
+      const p = await fetch(`${e}${t.requestRegisterOtp}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          email: c
+        })
+      });
+      if (!p.ok) {
+        const l = await p.json();
+        throw new Error(l.message || l.error || "Failed to request OTP");
+      }
+      return p.json();
+    },
+    register: async ({
+      email: c,
+      password: p,
+      phone_number: l,
+      family_name: d,
+      given_name: u,
+      code: y
+    }) => {
+      const v = await fetch(`${e}${t.register}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          email: c,
+          password: p,
+          phone_number: l,
+          family_name: d,
+          given_name: u,
+          code: y
+        })
+      });
+      if (!v.ok) {
+        const _ = await v.json();
+        throw new Error(_.message || _.error || "Registration failed");
+      }
+      return v.json();
+    },
+    requestResetPassword: async ({ email: c }) => {
+      const p = await fetch(`${e}${t.requestResetPassword}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          email: c
+        })
+      });
+      if (!p.ok) {
+        const l = await p.json();
+        throw new Error(l.message || l.error || "Failed to request password reset");
+      }
+      return p.json();
+    },
+    resetPassword: async ({
+      email: c,
+      otp: p,
+      newPassword: l
+    }) => {
+      const d = await fetch(`${e}${t.resetPassword}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          email: c,
+          otp: p,
+          newPassword: l
+        })
+      });
+      if (!d.ok) {
+        const u = await d.json();
+        throw new Error(u.message || u.error || "Failed to reset password");
+      }
+      return d.json();
+    }
+  };
+}, J = {
+  AUTH_TOKEN: "authToken",
+  ACCESS_TOKEN: "accessToken",
+  REFRESH_TOKEN: "refreshToken"
+}, ie = {
+  maxAge: 3600 * 24 * 7,
+  // 7 days
+  secure: !0,
+  sameSite: "lax",
+  path: "/"
+}, re = () => {
+  const e = (n, c, p = {}) => {
+    const {
+      maxAge: l,
+      path: d = "/",
+      secure: u = window.location.protocol === "https:",
+      sameSite: y = "lax",
+      domain: v
+    } = p;
+    let _ = `${encodeURIComponent(n)}=${encodeURIComponent(c)}`;
+    l !== void 0 && (_ += `; Max-Age=${l}`), _ += `; Path=${d}`, u && (_ += "; Secure"), _ += `; SameSite=${y}`, v && (_ += `; Domain=${v}`), document.cookie = _;
+  }, t = (n) => {
+    const c = encodeURIComponent(n) + "=", p = document.cookie.split(";");
+    for (let l = 0; l < p.length; l++) {
+      let d = p[l];
+      for (; d.charAt(0) === " "; )
+        d = d.substring(1);
+      if (d.indexOf(c) === 0)
+        return decodeURIComponent(d.substring(c.length));
+    }
+    return null;
+  }, s = (n, c = {}) => {
+    e(n, "", {
+      ...c,
+      maxAge: -1
+    });
+  }, i = (n) => t(n) !== null, r = (n, c) => {
+    e(J[n], c, ie);
+  }, o = (n) => t(J[n]), a = (n) => {
+    s(J[n]);
+  };
+  return {
+    setCookie: e,
+    getCookie: t,
+    removeCookie: s,
+    hasCookie: i,
+    setAuthToken: r,
+    getAuthToken: o,
+    removeAuthToken: a,
+    clearAllAuthTokens: () => {
+      a("AUTH_TOKEN"), a("ACCESS_TOKEN"), a("REFRESH_TOKEN");
+    }
+  };
+}, oe = ["code", "state", "error", "error_description"], ae = (e) => {
+  if (e) return e;
+  const t = new URL(window.location.href);
+  return oe.forEach((s) => t.searchParams.delete(s)), t.toString();
+}, ne = ({
+  domain: e,
+  cognitoRegion: t,
+  userPoolId: s,
+  clientId: i,
+  redirectUri: r
+}) => {
+  const o = {
+    domain: e,
+    clientId: i,
+    redirectUri: ae(r)
+  }, a = (w) => {
+    const S = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-._~", C = new Uint8Array(w);
+    return crypto.getRandomValues(C), Array.from(C).map((E) => S[E % S.length]).join("");
+  }, h = async (w) => {
+    const C = new TextEncoder().encode(w), E = await crypto.subtle.digest("SHA-256", C);
+    return btoa(String.fromCharCode(...new Uint8Array(E))).replace(/\+/g, "-").replace(/\//g, "_").replace(/=/g, "");
+  }, n = async () => {
+    const w = a(128), S = await h(w);
+    return sessionStorage.setItem("pkce_code_verifier", w), { codeVerifier: w, codeChallenge: S };
+  }, c = () => {
+    const w = a(32);
+    return sessionStorage.setItem("oauth_state", w), w;
+  }, p = async () => {
+    const { codeChallenge: w } = await n(), S = c(), C = new URLSearchParams({
+      response_type: "code",
+      client_id: o.clientId,
+      redirect_uri: o.redirectUri,
+      identity_provider: "Google",
+      scope: "openid email profile",
+      state: S,
+      code_challenge_method: "S256",
+      code_challenge: w,
+      prompt: "select_account"
+    });
+    return `${o.domain}/oauth2/authorize?${C.toString()}`;
+  }, l = async () => {
+    const w = await p();
+    window.location.href = w;
+  }, d = async () => {
+    const { codeChallenge: w } = await n(), S = c(), C = new URLSearchParams({
+      response_type: "code",
+      client_id: o.clientId,
+      redirect_uri: o.redirectUri,
+      identity_provider: "SignInWithApple",
+      scope: "openid email profile",
+      state: S,
+      code_challenge_method: "S256",
+      code_challenge: w
+    });
+    return `${o.domain}/oauth2/authorize?${C.toString()}`;
+  }, u = async () => {
+    const w = await d();
+    window.location.href = w;
+  }, y = (w) => {
+    const S = sessionStorage.getItem("oauth_state");
+    return sessionStorage.removeItem("oauth_state"), S === w;
+  }, v = () => {
+    const w = sessionStorage.getItem("pkce_code_verifier");
+    return sessionStorage.removeItem("pkce_code_verifier"), w;
+  };
+  return {
+    redirectToGoogleAuth: l,
+    redirectToAppleAuth: u,
+    validateState: y,
+    getCodeVerifier: v,
+    exchangeCodeForTokens: async (w) => {
+      const S = v();
+      if (!S)
+        throw new Error("PKCE code verifier not found. Please restart the authentication flow.");
+      const C = new URLSearchParams({
+        grant_type: "authorization_code",
+        client_id: o.clientId,
+        code: w,
+        redirect_uri: o.redirectUri,
+        code_verifier: S
+      }), E = await fetch(`${o.domain}/oauth2/token`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/x-www-form-urlencoded"
+        },
+        body: C.toString()
+      });
+      if (!E.ok) {
+        const st = await E.text();
+        throw new Error(`Token exchange failed: ${st}`);
+      }
+      return E.json();
+    }
+  };
+}, le = () => kt`
+    :host {
+      display: inline-block;
+      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+      box-sizing: border-box;
+      --color-primary: var(--cals-auth-color-primary, #2563eb);
+      --color-bg-primary: var(--cals-auth-color-bg-primary, #ffffff);
+      --color-bg-secondary: var(--cals-auth-color-bg-secondary, #f8fafc);
+      --color-text-primary: var(--cals-auth-color-text-primary, #0f172a);
+      --color-text-secondary: var(--cals-auth-color-text-secondary, #64748b);
+      --color-text-muted: var(--cals-auth-color-text-muted, #94a3b8);
+      --color-border: var(--cals-auth-color-border, #e2e8f0);
+      --color-error: var(--cals-auth-color-error, #dc2626);
+      --color-success: var(--cals-auth-color-success, #16a34a);
+      --transition-slow: var(--cals-auth-transition-slow, 300ms);
+      --radius-md: var(--cals-auth-radius-md, 0.5rem);
+      --radius-lg: var(--cals-auth-radius-lg, 0.75rem);
+      --radius-xl: var(--cals-auth-radius-xl, 1.25rem);
+      --space-2: var(--cals-auth-space-2, 0.5rem);
+      --space-3: var(--cals-auth-space-3, 0.75rem);
+      --space-4: var(--cals-auth-space-4, 1rem);
+      --space-5: var(--cals-auth-space-5, 1.25rem);
+      --space-6: var(--cals-auth-space-6, 1.5rem);
+    }
+
+    *,
+    *::before,
+    *::after {
+      box-sizing: border-box;
+    }
+
+    /* Body scroll lock */
+    :host(.modal-open) {
+      overflow: hidden;
+    }
+
+    .modal-overlay {
+      position: fixed;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      background: rgba(0, 0, 0, 0.5);
+      display: flex;
+      align-items: flex-end;
+      justify-content: center;
+      z-index: 1000;
+      backdrop-filter: none;
+      animation: fadeIn 0.2s ease-out;
+    }
+
+    .modal-overlay--closing {
+      animation: fadeOut var(--transition-slow) ease-out forwards;
+    }
+
+    .modal-container {
+      background: var(--color-bg-primary);
+      border-top-left-radius: var(--radius-xl);
+      border-top-right-radius: var(--radius-xl);
+      box-shadow: 0 -4px 6px -1px rgba(0, 0, 0, 0.1), 0 -2px 4px -1px rgba(0, 0, 0, 0.06);
+      width: 100vw;
+      max-width: 100vw;
+      height: 85dvh;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      animation: slideUp var(--transition-slow);
+      transform-origin: bottom center;
+      transition: height var(--transition-slow) cubic-bezier(0.4, 0, 0.2, 1);
+    }
+
+    .modal-container--closing {
+      animation: slideDown var(--transition-slow);
+    }
+
+    .modal-container--dragging {
+      user-select: none;
+      -webkit-user-select: none;
+      cursor: grabbing;
+    }
+
+    .drawer-handle {
+      display: flex;
+      justify-content: center;
+      padding-top: var(--space-3);
+      padding-bottom: var(--space-2);
+      flex-shrink: 0;
+      cursor: pointer;
+      user-select: none;
+      -webkit-tap-highlight-color: transparent;
+    }
+
+    .drawer-handle:hover .drawer-handle-bar {
+      opacity: 0.7;
+    }
+
+    .drawer-handle-bar {
+      width: 36px;
+      height: 5px;
+      background: var(--color-text-muted);
+      border-radius: 100px;
+      opacity: 0.5;
+      transition: opacity var(--transition-slow) ease;
+    }
+
+    .drawer-content {
+      width: 100%;
+      max-width: 100%;
+      margin: 0 auto;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      height: 100%;
+    }
+
+    .drawer-content--sm {
+      max-width: 400px;
+    }
+
+    .drawer-content--md {
+      max-width: 600px;
+    }
+
+    .drawer-content--lg {
+      max-width: 900px;
+    }
+
+    .modal-header {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      padding: var(--space-4) var(--space-6);
+      flex-shrink: 0;
+    }
+
+    .auth-logo {
+      display: block;
+    }
+    .auth-logo {
+      position: relative;
+      transition: all 0.3s ease;
+    }
+    .auth-logo[src] {
+      opacity: 1;
+      position: relative;
+      z-index: 1;
+    }
+    :host([data-theme='dark']) .auth-header {
+      filter: brightness(0) saturate(100%) invert(98%) sepia(4%) saturate(346%)
+              hue-rotate(183deg) brightness(106%) contrast(93%);
+    }
+
+    .modal-body {
+      padding: var(--space-4) var(--space-6);
+      overflow-y: auto;
+      flex: 1;
+      min-height: 0;
+    }
+
+    .auth-form {
+      display: flex;
+      flex-direction: column;
+      gap: var(--space-5);
+    }
+
+    .field {
+      display: flex;
+      flex-direction: column;
+      gap: var(--space-1);
+    }
+
+    .field-label {
+      font-weight: 500;
+      font-size: 0.875rem;
+      color: var(--color-text-primary);
+    }
+
+    .field-input {
+      width: 100%;
+      padding: 0.75rem 1rem;
+      border: 1px solid var(--color-border);
+      border-radius: var(--radius-md);
+      background: var(--color-bg-primary);
+      color: var(--color-text-primary);
+      font-size: 1rem;
+      transition: all 0.15s ease;
+    }
+
+    .field-input:focus {
+      outline: none;
+      border-color: var(--color-primary);
+      box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 25%, transparent);
+    }
+
+    .field-input:-webkit-autofill,
+    .field-input:-webkit-autofill:hover,
+    .field-input:-webkit-autofill:focus,
+    .field-input:-webkit-autofill:active {
+      -webkit-box-shadow: 0 0 0 1000px var(--color-bg-primary) inset !important;
+      -webkit-text-fill-color: var(--color-text-primary) !important;
+      transition: background-color 5000s ease-in-out 0s;
+    }
+
+    .field-input:-moz-autofill {
+      box-shadow: 0 0 0 1000px var(--color-bg-primary) inset !important;
+      color: var(--color-text-primary) !important;
+    }
+
+    .field-input--error {
+      border-color: var(--color-error);
+    }
+
+    .field-error {
+      color: var(--color-error);
+      font-size: 0.875rem;
+    }
+
+    .forgot-row {
+      display: flex;
+      justify-content: flex-end;
+      margin-top: calc(var(--space-2) * -1);
+    }
+
+    .text-btn {
+      background: none;
+      border: none;
+      color: var(--color-primary);
+      cursor: pointer;
+      font-weight: 600;
+      font-size: 0.875rem;
+      padding: 0;
+      text-decoration: none;
+    }
+
+    .text-btn:hover {
+      text-decoration: underline;
+    }
+
+    .form-actions {
+      display: flex;
+      flex-direction: column;
+      gap: var(--space-3);
+      margin-top: var(--space-2);
+    }
+
+    .cta {
+      width: 100%;
+      padding: 0.875rem 1rem;
+      border: none;
+      border-radius: var(--radius-md);
+      background: var(--color-primary);
+      color: white;
+      font-weight: 600;
+      font-size: 1rem;
+      cursor: pointer;
+      transition: all 0.15s ease;
+    }
+
+    .cta:hover:not(:disabled) {
+      background: color-mix(in srgb, var(--color-primary), black 10%);
+      transform: translateY(-1px);
+    }
+
+    .cta:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
+
+    .button-row {
+      display: flex;
+      gap: var(--space-3);
+      width: 100%;
+    }
+
+    .oauth-btn {
+      flex: 1;
+      padding: 0.875rem 1rem;
+      border: 1px solid var(--color-border);
+      border-radius: var(--radius-md);
+      background: var(--color-bg-primary);
+      cursor: pointer;
+      transition: all 0.15s ease;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .oauth-btn:hover:not(:disabled) {
+      background: var(--color-bg-secondary);
+      border-color: var(--color-text-muted);
+    }
+
+    .oauth-btn:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
+
+    .apple-icon path {
+      fill: #0b0b0a;
+    }
+
+    /* Dark theme */
+    :host([data-theme='dark']) {
+      --color-primary: #3b82f6;
+      --color-bg-primary: #1e293b;
+      --color-bg-secondary: #0f172a;
+      --color-text-primary: #f8fafc;
+      --color-text-secondary: #cbd5e1;
+      --color-text-muted: #94a3b8;
+      --color-border: #334155;
+      --color-error: #ef4444;
+      --color-success: #10b981;
+    }
+
+    :host([data-theme='dark']) .apple-icon path {
+      fill: #8e8e93;
+    }
+
+    @media (prefers-color-scheme: dark) {
+      .apple-icon path {
+        fill: #8e8e93;
+      }
+    }
+
+    .otp-section {
+      display: flex;
+      flex-direction: column;
+      gap: var(--space-2);
+    }
+
+    .otp-label {
+      display: block;
+      font-weight: 500;
+      font-size: 0.875rem;
+      color: var(--color-text-primary);
+    }
+
+    .otp-inputs {
+      display: flex;
+      gap: var(--space-2);
+      justify-content: center;
+    }
+
+    .otp-input {
+      width: 44px;
+      height: 52px;
+      text-align: center;
+      font-size: 1.25rem;
+      font-weight: 600;
+      border: 1px solid var(--color-border);
+      border-radius: var(--radius-md);
+      background: var(--color-bg-primary);
+      color: var(--color-text-primary);
+      transition: all 0.15s ease;
+    }
+
+    .otp-input:focus {
+      outline: none;
+      border-color: var(--color-primary);
+      box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 25%, transparent);
+    }
+
+    .otp-input--error {
+      border-color: var(--color-error);
+    }
+
+    .otp-error {
+      margin: 0;
+      color: var(--color-error);
+      font-size: 0.875rem;
+      text-align: center;
+    }
+
+    .new-password-fields {
+      display: flex;
+      flex-direction: column;
+      gap: var(--space-5);
+      animation: fadeSlide 0.2s ease;
+    }
+
+    .alert {
+      padding: var(--space-3) var(--space-4);
+      border-radius: var(--radius-md);
+      font-size: 0.875rem;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: var(--space-2);
+    }
+
+    .alert--success {
+      background: color-mix(in srgb, var(--color-success) 10%, transparent);
+      border: 1px solid color-mix(in srgb, var(--color-success) 30%, transparent);
+      color: var(--color-success);
+    }
+
+    .alert--error {
+      background: color-mix(in srgb, var(--color-error) 10%, transparent);
+      border: 1px solid color-mix(in srgb, var(--color-error) 30%, transparent);
+      color: var(--color-error);
+    }
+
+    .alert-close {
+      background: none;
+      border: none;
+      color: inherit;
+      cursor: pointer;
+      font-size: 1.5rem;
+      line-height: 1;
+      padding: 0;
+      opacity: 0.7;
+    }
+
+    .alert-close:hover {
+      opacity: 1;
+    }
+
+    .auth-footer {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: var(--space-2);
+      padding-top: var(--space-4);
+      text-align: center;
+    }
+
+    .toggle-text {
+      margin: 0;
+      font-size: 0.875rem;
+      color: var(--color-text-secondary);
+    }
+
+    .toggle-text a {
+      color: var(--color-primary);
+      text-decoration: none;
+    }
+
+    .toggle-text a:hover {
+      text-decoration: underline;
+    }
+
+    @keyframes fadeIn {
+      from {
+        opacity: 0;
+      }
+      to {
+        opacity: 1;
+      }
+    }
+
+    @keyframes fadeOut {
+      from {
+        opacity: 1;
+      }
+      to {
+        opacity: 0;
+      }
+    }
+
+    @keyframes slideUp {
+      from {
+        transform: translateY(100%);
+      }
+      to {
+        transform: translateY(0);
+      }
+    }
+
+    @keyframes slideDown {
+      from {
+        transform: translateY(0);
+      }
+      to {
+        transform: translateY(100%);
+      }
+    }
+
+    @keyframes fadeSlide {
+      from {
+        opacity: 0;
+        transform: translateY(6px);
+      }
+      to {
+        opacity: 1;
+        transform: translateY(0);
+      }
+    }
+
+    @media (max-width: 640px) {
+      .modal-container {
+        height: 80dvh;
+      }
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      * {
+        animation: none !important;
+        transition: none !important;
+      }
+    }`;
+var he = Object.defineProperty, ce = Object.getOwnPropertyDescriptor, f = (e, t, s, i) => {
+  for (var r = i > 1 ? void 0 : i ? ce(t, s) : t, o = e.length - 1, a; o >= 0; o--)
+    (a = e[o]) && (r = (i ? a(t, s, r) : a(r)) || r);
+  return i && r && he(t, s, r), r;
+};
+const de = ["code", "state", "error", "error_description"];
+let g = class extends Ct {
+  constructor() {
+    super(...arguments), this.open = !1, this.initialMode = "signin", this.logoUrl = "", this.baseUrl = "", this.oauthDomain = "", this.oauthRegion = "", this.oauthUserPoolId = "", this.oauthClientId = "", this.oauthRedirectUri = "", this.size = "sm", this.theme = "light", this.mode = "signin", this.resetStep = "none", this.signupStep = "form", this.isLoading = !1, this.isClosing = !1, this.isVisible = !1, this.isLoggedIn = !1, this.email = "", this.password = "", this.givenName = "", this.familyName = "", this.newPassword = "", this.confirmPassword = "", this.notice = "", this.error = "", this.errors = {}, this.otpDigits = ["", "", "", "", "", ""], this.signupOtpDigits = ["", "", "", "", "", ""], this.isDragging = !1, this.dragStartY = 0, this.dragCurrentY = 0, this.dragStartTime = 0, this.lastDragEndTime = 0, this.cookies = re(), this.scrollPosition = 0, this.transitionDuration = 300, this.hasHandledOAuthCallback = !1, this.boundKeyHandler = (e) => {
+      e.key === "Escape" && this.isVisible && this.handleClose();
+    }, this.baseUrlErrorMessage = "Authentication service is not configured correctly. Please add an API domain or contact support.", this.handleClose = () => {
+      this.isClosing || !this.isVisible || (this.cleanupInlineStyles(), this.isDragging = !1, this.dragStartY = 0, this.dragCurrentY = 0, this.dragStartTime = 0, this.isClosing = !0, setTimeout(() => {
+        this.isClosing = !1, this.isVisible = !1, this.open = !1;
+      }, this.transitionDuration));
+    }, this.handleOverlayClick = () => {
+      this.handleClose();
+    }, this.handleDragStart = (e) => {
+      if (!this.modalContainer || this.modalBody && this.modalBody.scrollTop > 0)
+        return;
+      const t = e.target;
+      !(t.classList.contains("drawer-handle") || t.classList.contains("drawer-handle-bar") || t.closest(".drawer-handle")) && this.modalBody && this.modalBody.scrollTop > 0 || (this.modalContainer.style.transition = "", this.modalContainer.style.transform = "", this.isDragging = !0, this.dragStartTime = Date.now(), e instanceof TouchEvent ? (this.dragStartY = e.touches[0].clientY, this.dragCurrentY = e.touches[0].clientY) : (this.dragStartY = e.clientY, this.dragCurrentY = e.clientY));
+    }, this.handleDragMove = (e) => {
+      if (!this.isDragging || !this.modalContainer) return;
+      e instanceof TouchEvent ? this.dragCurrentY = e.touches[0].clientY : this.dragCurrentY = e.clientY;
+      const t = this.dragCurrentY - this.dragStartY;
+      t > 0 && (e.preventDefault(), this.modalContainer.style.transform = `translateY(${t}px)`, this.modalContainer.style.transition = "none");
+    }, this.handleDragEnd = () => {
+      if (!this.isDragging || !this.modalContainer) return;
+      const e = Math.max(0, this.dragCurrentY - this.dragStartY);
+      e > 5 && (this.lastDragEndTime = Date.now());
+      const t = Date.now() - this.dragStartTime, s = e / t, i = this.modalContainer.offsetHeight, r = Math.max(150, i * 0.3), a = e > r || s > 0.5;
+      this.isDragging = !1;
+      const h = this.modalContainer, n = a ? i + i * 0.1 : 0;
+      h.style.transition = "none", h.style.transform = `translateY(${e}px)`, requestAnimationFrame(() => {
+        h.style.transition = `transform ${this.transitionDuration}ms cubic-bezier(0.4, 0, 0.2, 1)`, h.style.transform = `translateY(${n}px)`;
+      }), setTimeout(() => {
+        this.dragStartY = 0, this.dragCurrentY = 0, this.dragStartTime = 0, a ? (this.isVisible = !1, this.open = !1) : this.modalContainer && (this.modalContainer.style.transition = "", this.modalContainer.style.transform = "");
+      }, this.transitionDuration);
+    }, this.handleHandleClick = (e) => {
+      if (Date.now() - this.lastDragEndTime < 200) {
+        e.preventDefault(), e.stopPropagation();
+        return;
+      }
+      this.handleClose();
+    };
+  }
+  hasApiBaseUrl() {
+    return this.baseUrl.trim().length > 0;
+  }
+  getNormalizedBaseUrl() {
+    const e = this.baseUrl.trim();
+    if (!e) return "";
+    const t = e.endsWith("/") ? e : `${e}/`;
+    return t.startsWith("http://") || t.startsWith("https://") ? t : `https://${t}`;
+  }
+  getApiService() {
+    if (!this.hasApiBaseUrl())
+      throw new Error("API domain is not set");
+    return this.apiService || (this.apiService = se({
+      baseUrl: this.getNormalizedBaseUrl()
+    })), this.apiService;
+  }
+  connectedCallback() {
+    super.connectedCallback(), window.addEventListener("keyup", this.boundKeyHandler);
+    const e = this.cookies.getAuthToken("AUTH_TOKEN"), t = this.cookies.getAuthToken("REFRESH_TOKEN");
+    this.isLoggedIn = !!(e && t), this.mode = this.initialMode, this.hasApiBaseUrl() || (this.error = this.baseUrlErrorMessage), this.handleOAuthCallbackIfPresent();
+  }
+  disconnectedCallback() {
+    window.removeEventListener("keyup", this.boundKeyHandler), this.unlockBodyScroll(), super.disconnectedCallback();
+  }
+  firstUpdated() {
+    this.open && (this.isVisible = !0);
+  }
+  updated(e) {
+    e.has("baseUrl") && (this.apiService = void 0, this.hasApiBaseUrl() ? (this.error === this.baseUrlErrorMessage && (this.error = ""), this.hasHandledOAuthCallback || this.handleOAuthCallbackIfPresent()) : this.error = this.baseUrlErrorMessage), (e.has("oauthDomain") || e.has("oauthRegion") || e.has("oauthUserPoolId") || e.has("oauthClientId") || e.has("oauthRedirectUri")) && (this.oauthService = void 0, this.handleOAuthCallbackIfPresent()), e.has("open") && (this.open ? (this.isVisible = !0, this.lockBodyScroll(), setTimeout(() => {
+      this.emailInput?.focus();
+    }, 100)) : this.isVisible && this.handleClose()), e.has("isVisible") && (this.isVisible ? (this.lockBodyScroll(), this.cleanupInlineStyles()) : (this.unlockBodyScroll(), this.resetState()));
+  }
+  lockBodyScroll() {
+    this.scrollPosition = window.scrollY, document.body.classList.add("modal-open"), document.body.style.top = `-${this.scrollPosition}px`;
+  }
+  unlockBodyScroll() {
+    document.body.classList.remove("modal-open"), document.body.style.top = "", window.scrollTo(0, this.scrollPosition);
+  }
+  cleanupInlineStyles() {
+    setTimeout(() => {
+      this.modalContainer && (this.modalContainer.style.transition = "", this.modalContainer.style.transform = "");
+    }, 0);
+  }
+  resetState() {
+    this.isDragging = !1, this.lastDragEndTime = 0, this.dragStartY = 0, this.dragCurrentY = 0, this.dragStartTime = 0, this.error = "", this.notice = "", this.errors = {}, this.email = "", this.password = "", this.givenName = "", this.familyName = "", this.newPassword = "", this.confirmPassword = "", this.otpDigits = ["", "", "", "", "", ""], this.signupOtpDigits = ["", "", "", "", "", ""], this.resetStep = "none", this.signupStep = "form", this.mode = this.initialMode;
+  }
+  toggleMode() {
+    this.resetStep === "none" && (this.mode = this.mode === "signin" ? "signup" : "signin", this.signupStep = "form", this.error = "", this.notice = "", this.errors = {}, this.confirmPassword = "", this.mode === "signin" && (this.givenName = "", this.familyName = "", this.signupOtpDigits = ["", "", "", "", "", ""]));
+  }
+  startReset() {
+    this.mode = "signin", this.resetStep = "request", this.error = "", this.notice = "", this.errors = {}, this.password = "", this.newPassword = "", this.confirmPassword = "";
+  }
+  cancelReset() {
+    this.resetStep = "none", this.error = "", this.notice = "", this.otpDigits = ["", "", "", "", "", ""], this.errors = {}, this.newPassword = "", this.confirmPassword = "";
+  }
+  backToRequest() {
+    this.resetStep = "request", this.error = "", this.notice = "", this.otpDigits = ["", "", "", "", "", ""], this.errors = {}, this.newPassword = "", this.confirmPassword = "";
+  }
+  backToSignupForm() {
+    this.signupStep = "form", this.error = "", this.notice = "", this.signupOtpDigits = ["", "", "", "", "", ""], this.errors = {};
+  }
+  // Validation
+  validate() {
+    const e = {};
+    if (this.email.trim() ? /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(this.email) || (e.email = "Enter a valid email") : e.email = "Email is required", this.resetStep === "none" && this.signupStep === "form") {
+      if (!this.password)
+        e.password = "Password is required";
+      else if (this.password.length < 8)
+        e.password = "Password must be at least 8 characters";
+      else if (this.mode === "signup") {
+        const t = /[A-Z]/.test(this.password), s = /[a-z]/.test(this.password), i = /[0-9]/.test(this.password);
+        (!t || !s || !i) && (e.password = "Password must contain uppercase, lowercase, and number");
+      }
+    }
+    if (this.mode === "signup" && this.resetStep === "none" && this.signupStep === "form" && (this.givenName.trim() ? /^[a-zA-Z\s-']+$/.test(this.givenName.trim()) || (e.givenName = "Invalid first name") : e.givenName = "First name is required", this.familyName.trim() ? /^[a-zA-Z\s-']+$/.test(this.familyName.trim()) || (e.familyName = "Invalid last name") : e.familyName = "Last name is required", this.confirmPassword ? this.password !== this.confirmPassword && (e.confirm_password = "Passwords must match") : e.confirm_password = "Please confirm your password"), this.signupStep === "otp") {
+      const t = this.signupOtpDigits.join("");
+      (t.length !== 6 || !/^\d{6}$/.test(t)) && (e.signup_otp = "Enter the 6-digit code");
+    }
+    if (this.resetStep === "confirm") {
+      const t = this.otpDigits.join("");
+      if ((t.length !== 6 || !/^\d{6}$/.test(t)) && (e.otp = "Enter the 6-digit code"), t.length === 6) {
+        if (!this.newPassword)
+          e.new_password = "New password is required";
+        else if (this.newPassword.length < 8)
+          e.new_password = "Password must be at least 8 characters";
+        else {
+          const s = /[A-Z]/.test(this.newPassword), i = /[a-z]/.test(this.newPassword), r = /[0-9]/.test(this.newPassword);
+          (!s || !i || !r) && (e.new_password = "Password must contain uppercase, lowercase, and number");
+        }
+        this.confirmPassword ? this.newPassword !== this.confirmPassword && (e.confirm_password = "Passwords must match") : e.confirm_password = "Please confirm your password";
+      }
+    }
+    return this.errors = e, Object.keys(e).length === 0;
+  }
+  // Form submission
+  async handleSubmit(e) {
+    if (e.preventDefault(), this.notice = "", this.error = "", !this.hasApiBaseUrl()) {
+      this.error = this.baseUrlErrorMessage;
+      return;
+    }
+    if (this.validate()) {
+      this.isLoading = !0;
+      try {
+        switch (`${this.resetStep}-${this.mode}-${this.signupStep}`) {
+          case "request-signin-form":
+            try {
+              await this.handleRequestReset();
+            } catch {
+              this.error = "Reset request failed. Please check your details and try again.";
+            }
+            break;
+          case "confirm-signin-form":
+            try {
+              await this.handleConfirmReset();
+            } catch {
+              this.error = "Reset confirmation failed. Please check your details and try again.";
+            }
+            break;
+          case "none-signup-form":
+            try {
+              await this.handleRequestSignupOtp();
+            } catch {
+              this.error = "Signup failed. Please check your details and try again.";
+            }
+            break;
+          case "none-signup-otp":
+            try {
+              await this.handleSignupWithOtp();
+            } catch {
+              this.error = "Signup failed. Please check your details and try again.";
+            }
+            break;
+          default:
+            try {
+              await this.handleSignIn();
+            } catch {
+              this.error = "Login failed. Please check your credentials and try again.";
+            }
+            break;
+        }
+      } finally {
+        this.isLoading = !1;
+      }
+    }
+  }
+  setAuthTokens(e, t, s) {
+    this.cookies.setAuthToken("ACCESS_TOKEN", e), this.cookies.setAuthToken("AUTH_TOKEN", t), this.cookies.setAuthToken("REFRESH_TOKEN", s), this.isLoggedIn = !0;
+  }
+  async handleSignIn() {
+    const e = {
+      email: this.email.trim(),
+      password: this.password
+    }, { accessToken: t, idToken: s, refreshToken: i } = await this.getApiService().login(e);
+    this.setAuthTokens(t, s, i), this.handleClose();
+  }
+  isOAuthConfigured() {
+    return [this.oauthDomain, this.oauthRegion, this.oauthUserPoolId, this.oauthClientId].every(
+      (e) => !!e?.trim()
+    );
+  }
+  getOAuthService() {
+    if (!this.isOAuthConfigured())
+      return null;
+    if (!this.oauthService) {
+      const e = this.oauthRedirectUri?.trim() ? this.oauthRedirectUri.trim() : void 0;
+      this.oauthService = ne({
+        domain: this.oauthDomain.trim(),
+        cognitoRegion: this.oauthRegion.trim(),
+        userPoolId: this.oauthUserPoolId.trim(),
+        clientId: this.oauthClientId.trim(),
+        redirectUri: e
+      });
+    }
+    return this.oauthService;
+  }
+  stripOAuthParamsFromUrl() {
+    const e = new URL(window.location.href);
+    let t = !1;
+    for (const s of de)
+      e.searchParams.has(s) && (e.searchParams.delete(s), t = !0);
+    if (t) {
+      const s = e.searchParams.toString(), i = `${e.pathname}${s ? `?${s}` : ""}${e.hash}`;
+      window.history.replaceState({}, document.title, i);
+    }
+  }
+  async handleOAuthCallbackIfPresent() {
+    const e = new URLSearchParams(window.location.search), t = e.get("code"), s = e.get("state"), i = e.get("error"), r = e.get("error_description");
+    if (!(!t && !i) && !this.hasHandledOAuthCallback && this.isOAuthConfigured()) {
+      if (!this.hasApiBaseUrl()) {
+        this.error = this.baseUrlErrorMessage;
+        return;
+      }
+      this.hasHandledOAuthCallback = !0, this.isLoading = !0, this.error = "";
+      try {
+        if (i)
+          throw new Error(r || `OAuth error: ${i}`);
+        if (!t || !s)
+          throw new Error("Missing authorization code or state parameter");
+        const o = this.getOAuthService();
+        if (!o)
+          throw new Error("OAuth is not configured correctly. Please try again later.");
+        if (!o.validateState(s))
+          throw new Error("Invalid state parameter. Please try signing in again.");
+        const a = await o.exchangeCodeForTokens(t), { accessToken: h, idToken: n, refreshToken: c } = await this.getApiService().login({
+          accessToken: a.access_token,
+          refreshToken: a.refresh_token,
+          idToken: a.id_token
+        });
+        this.setAuthTokens(h, n, c ?? a.refresh_token);
+      } catch (o) {
+        this.error = o.message || "An unexpected error occurred during authentication";
+      } finally {
+        this.stripOAuthParamsFromUrl(), this.isLoading = !1;
+      }
+    }
+  }
+  async handleRequestSignupOtp() {
+    this.signupStep = "otp", this.notice = "A 6-digit code has been sent to your email", this.signupOtpDigits = ["", "", "", "", "", ""], await this.getApiService().requestRegisterOtp({ email: this.email.trim() }), setTimeout(() => {
+      this.shadowRoot?.querySelector(".signup-otp-input")?.focus();
+    }, 200);
+  }
+  async handleSignupWithOtp() {
+    const e = {
+      email: this.email.trim(),
+      password: this.password,
+      givenName: this.givenName.trim(),
+      familyName: this.familyName.trim(),
+      code: this.signupOtpDigits.join("")
+    };
+    await this.getApiService().register({
+      email: e.email,
+      password: e.password,
+      given_name: e.givenName,
+      family_name: e.familyName,
+      code: e.code
+    }), await this.handleSignIn();
+  }
+  async handleRequestReset() {
+    const e = {
+      email: this.email.trim()
+    };
+    this.resetStep = "confirm", this.notice = "If an account exists, a 6-digit code has been sent", this.otpDigits = ["", "", "", "", "", ""], await this.getApiService().requestResetPassword(e), setTimeout(() => {
+      this.shadowRoot?.querySelector(".reset-otp-input")?.focus();
+    }, 100);
+  }
+  async handleConfirmReset() {
+    const e = {
+      email: this.email.trim(),
+      newPassword: this.newPassword,
+      otp: this.otpDigits.join("")
+    };
+    await this.getApiService().resetPassword({
+      email: e.email,
+      newPassword: e.newPassword,
+      otp: e.otp
+    }), await this.handleSignIn();
+  }
+  async logout() {
+    const e = this.cookies.getAuthToken("ACCESS_TOKEN"), t = this.cookies.getAuthToken("AUTH_TOKEN"), s = this.cookies.getAuthToken("REFRESH_TOKEN");
+    if (e == null || s == null || t == null) {
+      this.cookies.clearAllAuthTokens(), this.isLoggedIn = !1;
+      return;
+    }
+    if (!this.hasApiBaseUrl()) {
+      this.error = this.baseUrlErrorMessage;
+      return;
+    }
+    const i = this.getApiService(), {
+      redirectUrl: r,
+      requiresRedirect: o
+    } = await i.logout({
+      accessToken: e,
+      refreshToken: s,
+      authToken: t
+    });
+    if (this.cookies.clearAllAuthTokens(), this.isLoggedIn = !1, o && r) {
+      const a = window.location.host;
+      new URL(r).host !== a ? window.open(r, "newWindow", "width=400,height=400,resizable=yes,scrollbars=yes,status=yes") : window.location.href = r;
+    }
+  }
+  // OAuth handlers
+  handleGoogleSignIn() {
+    this.getOAuthService()?.redirectToGoogleAuth();
+  }
+  handleAppleSignIn() {
+    this.getOAuthService()?.redirectToAppleAuth();
+  }
+  // OTP input handlers
+  handleOtpInput(e, t, s) {
+    const i = t.target, r = i.value.replace(/\D/g, "");
+    if (!r) {
+      s ? (this.signupOtpDigits[e] = "", this.signupOtpDigits = [...this.signupOtpDigits]) : (this.otpDigits[e] = "", this.otpDigits = [...this.otpDigits]);
+      return;
+    }
+    const o = r[r.length - 1];
+    if (s ? (this.signupOtpDigits[e] = o, this.signupOtpDigits = [...this.signupOtpDigits]) : (this.otpDigits[e] = o, this.otpDigits = [...this.otpDigits]), e < 5) {
+      const a = this.shadowRoot?.querySelector(
+        `${s ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${e + 1}"]`
+      );
+      a?.focus(), a?.select();
+    } else
+      i.blur();
+  }
+  handleOtpKeydown(e, t, s) {
+    const i = s ? this.signupOtpDigits : this.otpDigits;
+    if (t.key === "Backspace") {
+      if (i[e]) {
+        s ? (this.signupOtpDigits[e] = "", this.signupOtpDigits = [...this.signupOtpDigits]) : (this.otpDigits[e] = "", this.otpDigits = [...this.otpDigits]);
+        return;
+      }
+      if (e > 0) {
+        const r = this.shadowRoot?.querySelector(
+          `${s ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${e - 1}"]`
+        );
+        r?.focus(), r?.select(), s ? (this.signupOtpDigits[e - 1] = "", this.signupOtpDigits = [...this.signupOtpDigits]) : (this.otpDigits[e - 1] = "", this.otpDigits = [...this.otpDigits]);
+      }
+    }
+    if (t.key === "ArrowLeft" && e > 0) {
+      const r = this.shadowRoot?.querySelector(
+        `${s ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${e - 1}"]`
+      );
+      r?.focus(), r?.select(), t.preventDefault();
+    }
+    if (t.key === "ArrowRight" && e < 5) {
+      const r = this.shadowRoot?.querySelector(
+        `${s ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${e + 1}"]`
+      );
+      r?.focus(), r?.select(), t.preventDefault();
+    }
+    t.key.length === 1 && /\D/.test(t.key) && t.preventDefault();
+  }
+  handleOtpPaste(e, t) {
+    const i = (e.clipboardData?.getData("text") || "").replace(/\D/g, "").slice(0, 6).split("");
+    if (i.length === 0) return;
+    e.preventDefault();
+    for (let o = 0; o < 6; o++)
+      t ? this.signupOtpDigits[o] = i[o] || "" : this.otpDigits[o] = i[o] || "";
+    t ? this.signupOtpDigits = [...this.signupOtpDigits] : this.otpDigits = [...this.otpDigits];
+    const r = (t ? this.signupOtpDigits : this.otpDigits).findIndex((o) => !o);
+    if (r === -1)
+      this.shadowRoot?.querySelector(
+        `${t ? ".signup-otp-input" : ".reset-otp-input"}[data-index="5"]`
+      )?.blur();
+    else {
+      const o = this.shadowRoot?.querySelector(
+        `${t ? ".signup-otp-input" : ".reset-otp-input"}[data-index="${r}"]`
+      );
+      o?.focus(), o?.select();
+    }
+  }
+  render() {
+    if (!this.isVisible)
+      return $;
+    const e = {
+      "modal-overlay": !0,
+      "modal-overlay--closing": this.isClosing
+    }, t = {
+      "modal-container": !0,
+      "modal-container--drawer": !0,
+      "modal-container--closing": this.isClosing,
+      "modal-container--dragging": this.isDragging,
+      [`modal-container--${this.size}`]: !0
+    };
+    return m`
+      <!-- Modal/Drawer -->
+      <div
+        class=${ut(e)}
+        @click=${this.handleOverlayClick}
+        @touchstart=${this.handleDragStart}
+        @touchmove=${this.handleDragMove}
+        @touchend=${this.handleDragEnd}
+        @mousedown=${this.handleDragStart}
+      >
+        <div
+          class=${ut(t)}
+          @click=${(s) => s.stopPropagation()}
+          role="dialog"
+          aria-modal="true"
+          @mousemove=${this.handleDragMove}
+          @mouseup=${this.handleDragEnd}
+        >
+          <!-- Drawer Handle -->
+          <div
+            class="drawer-handle"
+            @click=${this.handleHandleClick}
+            role="button"
+            tabindex="0"
+            aria-label="Close drawer"
+          >
+            <div class="drawer-handle-bar"></div>
+          </div>
+
+          <!-- Drawer Content Wrapper -->
+          <div class="drawer-content drawer-content--${this.size}">
+            ${this.renderContent()}
+          </div>
+        </div>
+      </div>
+    `;
+  }
+  renderContent() {
+    if (!this.hasApiBaseUrl()) {
+      const e = this.baseUrlErrorMessage;
+      return m`
+        ${this.logoUrl.length > 0 ? m`
+              <header class="modal-header">
+                <div class="auth-header">
+                <img
+                  src="${this.logoUrl}"
+                  width="48"
+                  height="48"
+                  alt="Logo"
+                  class="auth-logo"
+                />
+                </div>
+              </header>
+            ` : $}
+
+        <div class="modal-body">
+          <div class="auth-form">
+            <div class="alert alert--error">
+              ${e}
+            </div>
+          </div>
+        </div>
+      `;
+    }
+    return this.isLoggedIn ? m`
+        <!-- Header -->
+        ${this.logoUrl.length > 0 ? m`
+              <header class="modal-header">
+                <div class="auth-header">
+                <img
+                  src="${this.logoUrl}"
+                  width="48"
+                  height="48"
+                  alt="Logo"
+                  class="auth-logo"
+                />
+                </div>
+              </header>
+            ` : $}
+
+        <!-- Body -->
+        <div class="modal-body">
+          <div class="auth-form">
+            <div class="form-actions">
+              <button type="button" class="cta" @click=${this.logout}>Logout</button>
+            </div>
+            ${this.renderAlerts()}
+          </div>
+        </div>
+      ` : m`
+      <!-- Header -->
+      ${(!this.mode || this.resetStep === "none") && this.logoUrl.length > 0 && this.mode === "signin" ? m`
+            <header class="modal-header">
+
+                <div class="auth-header">
+              <img
+                src="${this.logoUrl}"
+                width="48"
+                height="48"
+                alt="Logo"
+                class="auth-logo"
+              />
+                </div>
+            </header>
+          ` : $}
+
+      <!-- Body -->
+      <div class="modal-body">
+        <form @submit=${this.handleSubmit} class="auth-form" novalidate>
+          ${this.renderFormContent()}
+
+          <!-- Actions -->
+          <div class="form-actions">
+            ${this.renderActions()}
+          </div>
+
+          ${this.renderAlerts()}
+        </form>
+
+        ${this.renderFooter()}
+      </div>
+    `;
+  }
+  renderFormContent() {
+    if (this.resetStep === "none" && (!this.mode || this.mode === "signin" || this.signupStep === "form"))
+      return m`
+        <!-- Email -->
+        <label class="field">
+          <span class="field-label">Email Address</span>
+          <input
+            id="email-input"
+            type="email"
+            class="field-input ${this.errors.email ? "field-input--error" : ""}"
+            placeholder="Enter your email"
+            .value=${this.email}
+            @input=${(e) => this.email = e.target.value}
+            required
+            autocomplete="email"
+          />
+          ${this.errors.email ? m`<span class="field-error">${this.errors.email}</span>` : $}
+        </label>
+
+        <!-- Password -->
+        <label class="field">
+          <span class="field-label">Password</span>
+          <input
+            type="password"
+            class="field-input ${this.errors.password ? "field-input--error" : ""}"
+            placeholder="Enter your password"
+            .value=${this.password}
+            @input=${(e) => this.password = e.target.value}
+            required
+            autocomplete=${this.mode === "signup" ? "new-password" : "current-password"}
+          />
+          ${this.errors.password ? m`<span class="field-error">${this.errors.password}</span>` : $}
+        </label>
+
+        ${this.mode === "signin" && this.error ? m`
+              <div class="forgot-row">
+                <button type="button" class="text-btn" @click=${this.startReset}>
+                  Forgot your password?
+                </button>
+              </div>
+            ` : $}
+
+        ${this.mode === "signup" ? m`
+              <!-- Confirm Password -->
+              <label class="field">
+                <span class="field-label">Confirm Password</span>
+                <input
+                  type="password"
+                  class="field-input ${this.errors.confirm_password ? "field-input--error" : ""}"
+                  placeholder="Re-enter your password"
+                  .value=${this.confirmPassword}
+                  @input=${(e) => this.confirmPassword = e.target.value}
+                  required
+                  autocomplete="new-password"
+                />
+                ${this.errors.confirm_password ? m`<span class="field-error">${this.errors.confirm_password}</span>` : $}
+              </label>
+
+              <!-- First Name -->
+              <label class="field">
+                <span class="field-label">First Name</span>
+                <input
+                  type="text"
+                  class="field-input ${this.errors.givenName ? "field-input--error" : ""}"
+                  placeholder="Enter your first name"
+                  .value=${this.givenName}
+                  @input=${(e) => this.givenName = e.target.value}
+                  required
+                  autocomplete="given-name"
+                />
+                ${this.errors.givenName ? m`<span class="field-error">${this.errors.givenName}</span>` : $}
+              </label>
+
+              <!-- Last Name -->
+              <label class="field">
+                <span class="field-label">Last Name</span>
+                <input
+                  type="text"
+                  class="field-input ${this.errors.familyName ? "field-input--error" : ""}"
+                  placeholder="Enter your last name"
+                  .value=${this.familyName}
+                  @input=${(e) => this.familyName = e.target.value}
+                  required
+                  autocomplete="family-name"
+                />
+                ${this.errors.familyName ? m`<span class="field-error">${this.errors.familyName}</span>` : $}
+              </label>
+            ` : $}
+      `;
+    if (this.mode === "signup" && this.signupStep === "otp")
+      return m`
+        <div class="otp-section">
+          <label class="otp-label">Enter 6-digit code</label>
+          <div class="otp-inputs" role="group" aria-label="One time code">
+            ${ft(
+        Array.from({ length: 6 }, (e, t) => t),
+        (e) => e,
+        (e) => m`
+                <input
+                  class="otp-input signup-otp-input ${this.errors.signup_otp ? "otp-input--error" : ""}"
+                  type="text"
+                  inputmode="numeric"
+                  pattern="[0-9]*"
+                  maxlength="1"
+                  data-index="${e}"
+                  .value=${this.signupOtpDigits[e]}
+                  @input=${(t) => this.handleOtpInput(e, t, !0)}
+                  @keydown=${(t) => this.handleOtpKeydown(e, t, !0)}
+                  @paste=${(t) => this.handleOtpPaste(t, !0)}
+                  aria-label="Digit ${e + 1}"
+                />
+              `
+      )}
+          </div>
+          ${this.errors.signup_otp ? m`<p class="otp-error">${this.errors.signup_otp}</p>` : $}
+        </div>
+        <div class="forgot-row">
+          <button type="button" class="text-btn" @click=${this.backToSignupForm}>
+            Didn't get a code? Go back
+          </button>
+        </div>
+      `;
+    if (this.resetStep === "request")
+      return m`
+        <label class="field">
+          <span class="field-label">Email Address</span>
+          <input
+            id="email-input"
+            type="email"
+            class="field-input ${this.errors.email ? "field-input--error" : ""}"
+            placeholder="Enter your email"
+            .value=${this.email}
+            @input=${(e) => this.email = e.target.value}
+            required
+            autocomplete="email"
+          />
+          ${this.errors.email ? m`<span class="field-error">${this.errors.email}</span>` : $}
+        </label>
+        <div class="forgot-row">
+          <button type="button" class="text-btn" @click=${this.cancelReset}>
+            Back to Sign In
+          </button>
+        </div>
+      `;
+    if (this.resetStep === "confirm") {
+      const e = this.otpDigits.every((t) => /^\d$/.test(t));
+      return m`
+        <label class="field">
+          <span class="field-label">Email Address</span>
+          <input
+            type="email"
+            class="field-input ${this.errors.email ? "field-input--error" : ""}"
+            placeholder="Enter your email"
+            .value=${this.email}
+            @input=${(t) => this.email = t.target.value}
+            required
+            autocomplete="email"
+          />
+          ${this.errors.email ? m`<span class="field-error">${this.errors.email}</span>` : $}
+        </label>
+
+        <div class="otp-section">
+          <label class="otp-label">Enter 6-digit code</label>
+          <div class="otp-inputs" role="group" aria-label="One time code">
+            ${ft(
+        Array.from({ length: 6 }, (t, s) => s),
+        (t) => t,
+        (t) => m`
+                <input
+                  class="otp-input reset-otp-input ${this.errors.otp ? "otp-input--error" : ""}"
+                  type="text"
+                  inputmode="numeric"
+                  pattern="[0-9]*"
+                  maxlength="1"
+                  data-index="${t}"
+                  .value=${this.otpDigits[t]}
+                  @input=${(s) => this.handleOtpInput(t, s, !1)}
+                  @keydown=${(s) => this.handleOtpKeydown(t, s, !1)}
+                  @paste=${(s) => this.handleOtpPaste(s, !1)}
+                  aria-label="Digit ${t + 1}"
+                />
+              `
+      )}
+          </div>
+          ${this.errors.otp ? m`<p class="otp-error">${this.errors.otp}</p>` : $}
+        </div>
+
+        ${e ? m`
+              <div class="new-password-fields">
+                <label class="field">
+                  <span class="field-label">New Password</span>
+                  <input
+                    type="password"
+                    class="field-input ${this.errors.new_password ? "field-input--error" : ""}"
+                    placeholder="Enter your new password"
+                    .value=${this.newPassword}
+                    @input=${(t) => this.newPassword = t.target.value}
+                    required
+                    autocomplete="new-password"
+                  />
+                  ${this.errors.new_password ? m`<span class="field-error">${this.errors.new_password}</span>` : $}
+                </label>
+
+                <label class="field">
+                  <span class="field-label">Confirm New Password</span>
+                  <input
+                    type="password"
+                    class="field-input ${this.errors.confirm_password ? "field-input--error" : ""}"
+                    placeholder="Re-enter your new password"
+                    .value=${this.confirmPassword}
+                    @input=${(t) => this.confirmPassword = t.target.value}
+                    required
+                    autocomplete="new-password"
+                  />
+                  ${this.errors.confirm_password ? m`<span class="field-error">${this.errors.confirm_password}</span>` : $}
+                </label>
+              </div>
+            ` : $}
+
+        <div class="forgot-row">
+          <button type="button" class="text-btn" @click=${this.backToRequest}>
+            Didn't get a code? Resend
+          </button>
+        </div>
+      `;
+    }
+    return $;
+  }
+  renderActions() {
+    if (this.resetStep === "request")
+      return m`
+        <button type="submit" class="cta" ?disabled=${this.isLoading}>
+          ${this.isLoading ? "Sending..." : "Send Reset Code"}
+        </button>
+      `;
+    if (this.resetStep === "confirm")
+      return this.otpDigits.every((t) => /^\d$/.test(t)) ? m`
+          <button type="submit" class="cta" ?disabled=${this.isLoading}>
+            ${this.isLoading ? "Resetting..." : "Reset Password"}
+          </button>
+        ` : $;
+    if (this.mode === "signup" && this.signupStep === "otp") {
+      const e = this.signupOtpDigits.every((t) => /^\d$/.test(t));
+      return m`
+        <button type="submit" class="cta" ?disabled=${!e || this.isLoading}>
+          ${this.isLoading ? "Completing..." : "Complete Registration"}
+        </button>
+      `;
+    }
+    return m`
+      <button type="submit" class="cta" ?disabled=${this.isLoading}>
+        ${this.isLoading ? "Loading..." : this.mode === "signup" ? "Continue" : "Sign In"}
+      </button>
+
+      ${this.isOAuthConfigured() && this.mode === "signin" ? m`
+            <div class="button-row">
+              <button
+                type="button"
+                class="oauth-btn"
+                @click=${this.handleGoogleSignIn}
+                ?disabled=${this.isLoading}
+              >
+                ${this.renderGoogleIcon()}
+              </button>
+
+              <button
+                type="button"
+                class="oauth-btn"
+                @click=${this.handleAppleSignIn}
+                ?disabled=${this.isLoading}
+              >
+                ${this.renderAppleIcon()}
+              </button>
+            </div>
+          ` : $}
+    `;
+  }
+  renderAlerts() {
+    return m`
+      ${this.notice ? m`
+            <div class="alert alert--success">
+              ${this.notice}
+              <button class="alert-close" @click=${() => this.notice = ""} aria-label="Dismiss">
+                ×
+              </button>
+            </div>
+          ` : $}
+      ${this.error ? m`
+            <div class="alert alert--error">
+              ${this.error}
+              <button class="alert-close" @click=${() => this.error = ""} aria-label="Dismiss">
+                ×
+              </button>
+            </div>
+          ` : $}
+    `;
+  }
+  renderFooter() {
+    return this.isLoggedIn ? $ : this.resetStep === "none" && (!this.mode || this.mode === "signin" || this.signupStep === "form") ? m`
+        <div class="auth-footer">
+          <p class="toggle-text">
+            ${this.mode === "signup" ? "Already have an account?" : "Don't have an account?"}
+          </p>
+          <button type="button" class="text-btn" @click=${this.toggleMode}>
+            ${this.mode === "signup" ? "Sign In" : "Sign Up"}
+          </button>
+        </div>
+      ` : m`
+      <div class="auth-footer">
+        <p class="toggle-text">
+          Having trouble? Email
+          <a href="mailto:support@example.com">support@example.com</a>
+        </p>
+      </div>
+    `;
+  }
+  renderGoogleIcon() {
+    return m`
+      <svg viewBox="-0.5 0 48 48" width="18" height="18" fill="none">
+        <path d="M9.82727273,24 C9.82727273,22.4757333 10.0804318,21.0144 10.5322727,19.6437333 L2.62345455,13.6042667 C1.08206818,16.7338667 0.213636364,20.2602667 0.213636364,24 C0.213636364,27.7365333 1.081,31.2608 2.62025,34.3882667 L10.5247955,28.3370667 C10.0772273,26.9728 9.82727273,25.5168 9.82727273,24" fill="#FBBC05"></path>
+        <path d="M23.7136364,10.1333333 C27.025,10.1333333 30.0159091,11.3066667 32.3659091,13.2266667 L39.2022727,6.4 C35.0363636,2.77333333 29.6954545,0.533333333 23.7136364,0.533333333 C14.4268636,0.533333333 6.44540909,5.84426667 2.62345455,13.6042667 L10.5322727,19.6437333 C12.3545909,14.112 17.5491591,10.1333333 23.7136364,10.1333333" fill="#EB4335"></path>
+        <path d="M23.7136364,37.8666667 C17.5491591,37.8666667 12.3545909,33.888 10.5322727,28.3562667 L2.62345455,34.3946667 C6.44540909,42.1557333 14.4268636,47.4666667 23.7136364,47.4666667 C29.4455,47.4666667 34.9177955,45.4314667 39.0249545,41.6181333 L31.5177727,35.8144 C29.3995682,37.1488 26.7323182,37.8666667 23.7136364,37.8666667" fill="#34A853"></path>
+        <path d="M46.1454545,24 C46.1454545,22.6133333 45.9318182,21.12 45.6113636,19.7333333 L23.7136364,19.7333333 L23.7136364,28.8 L36.3181818,28.8 C35.6879545,31.8912 33.9724545,34.2677333 31.5177727,35.8144 L39.0249545,41.6181333 C43.3393409,37.6138667 46.1454545,31.6490667 46.1454545,24" fill="#4285F4"></path>
+      </svg>
+    `;
+  }
+  renderAppleIcon() {
+    return m`
+      <svg viewBox="-3.5 0 48 48" width="18" height="18" class="apple-icon">
+        <path d="M231.174735,567.792499 C232.740177,565.771699 233.926883,562.915484 233.497649,560 C230.939077,560.177808 227.948466,561.814769 226.203475,563.948463 C224.612784,565.88177 223.305444,568.757742 223.816036,571.549042 C226.613071,571.636535 229.499881,569.960061 231.174735,567.792499 L231.174735,567.792499 Z M245,595.217241 C243.880625,597.712195 243.341978,598.827022 241.899976,601.03692 C239.888467,604.121745 237.052156,607.962958 233.53412,607.991182 C230.411652,608.02505 229.606488,605.94498 225.367451,605.970382 C221.128414,605.99296 220.244696,608.030695 217.116618,607.999649 C213.601387,607.968603 210.913765,604.502761 208.902256,601.417937 C203.27452,592.79849 202.68257,582.680377 206.152914,577.298162 C208.621711,573.476705 212.515678,571.241407 216.173986,571.241407 C219.89682,571.241407 222.239372,573.296075 225.322563,573.296075 C228.313175,573.296075 230.133913,571.235762 234.440281,571.235762 C237.700215,571.235762 241.153726,573.022307 243.611302,576.10431 C235.554045,580.546683 236.85858,592.121127 245,595.217241 L245,595.217241 Z" transform="translate(-204.000000, -560.000000)" fill="#0b0b0a"></path>
+      </svg>
+    `;
+  }
+  // Public methods for external control
+  setError(e) {
+    this.error = e;
+  }
+  setNotice(e) {
+    this.notice = e;
+  }
+  closeModal() {
+    this.handleClose();
+  }
+  openModal() {
+    this.open = !0, this.isVisible = !0;
+  }
+  async refresh() {
+    try {
+      if (!this.hasApiBaseUrl()) {
+        this.error = this.baseUrlErrorMessage;
+        return;
+      }
+      const e = this.cookies.getAuthToken("REFRESH_TOKEN"), t = this.cookies.getAuthToken("ACCESS_TOKEN"), s = this.cookies.getAuthToken("AUTH_TOKEN");
+      if (!e || !t || !s) {
+        this.cookies.clearAllAuthTokens(), this.isLoggedIn = !1;
+        return;
+      }
+      const { accessToken: i, idToken: r, refreshToken: o } = await this.getApiService().refresh({
+        refreshToken: e
+      });
+      this.cookies.setAuthToken("ACCESS_TOKEN", i), this.cookies.setAuthToken("AUTH_TOKEN", r), this.cookies.setAuthToken("REFRESH_TOKEN", o ?? e);
+    } catch {
+      this.cookies.clearAllAuthTokens(), this.isLoggedIn = !1;
+    }
+  }
+};
+g.styles = le();
+f([
+  k({ type: Boolean, reflect: !0 })
+], g.prototype, "open", 2);
+f([
+  k({ type: String, attribute: "initial-mode" })
+], g.prototype, "initialMode", 2);
+f([
+  k({ type: String, attribute: "logo-url" })
+], g.prototype, "logoUrl", 2);
+f([
+  k({ type: String, attribute: "api-domain" })
+], g.prototype, "baseUrl", 2);
+f([
+  k({ type: String, attribute: "oauth-domain" })
+], g.prototype, "oauthDomain", 2);
+f([
+  k({ type: String, attribute: "oauth-region" })
+], g.prototype, "oauthRegion", 2);
+f([
+  k({ type: String, attribute: "oauth-user-pool-id" })
+], g.prototype, "oauthUserPoolId", 2);
+f([
+  k({ type: String, attribute: "oauth-client-id" })
+], g.prototype, "oauthClientId", 2);
+f([
+  k({ type: String, attribute: "oauth-redirect-uri" })
+], g.prototype, "oauthRedirectUri", 2);
+f([
+  k({ type: String, attribute: "size" })
+], g.prototype, "size", 2);
+f([
+  k({ type: String, attribute: "data-theme", reflect: !0 })
+], g.prototype, "theme", 2);
+f([
+  b()
+], g.prototype, "mode", 2);
+f([
+  b()
+], g.prototype, "resetStep", 2);
+f([
+  b()
+], g.prototype, "signupStep", 2);
+f([
+  b()
+], g.prototype, "isLoading", 2);
+f([
+  b()
+], g.prototype, "isClosing", 2);
+f([
+  b()
+], g.prototype, "isVisible", 2);
+f([
+  b()
+], g.prototype, "isLoggedIn", 2);
+f([
+  b()
+], g.prototype, "email", 2);
+f([
+  b()
+], g.prototype, "password", 2);
+f([
+  b()
+], g.prototype, "givenName", 2);
+f([
+  b()
+], g.prototype, "familyName", 2);
+f([
+  b()
+], g.prototype, "newPassword", 2);
+f([
+  b()
+], g.prototype, "confirmPassword", 2);
+f([
+  b()
+], g.prototype, "notice", 2);
+f([
+  b()
+], g.prototype, "error", 2);
+f([
+  b()
+], g.prototype, "errors", 2);
+f([
+  b()
+], g.prototype, "otpDigits", 2);
+f([
+  b()
+], g.prototype, "signupOtpDigits", 2);
+f([
+  b()
+], g.prototype, "isDragging", 2);
+f([
+  b()
+], g.prototype, "dragStartY", 2);
+f([
+  b()
+], g.prototype, "dragCurrentY", 2);
+f([
+  b()
+], g.prototype, "dragStartTime", 2);
+f([
+  b()
+], g.prototype, "lastDragEndTime", 2);
+f([
+  X(".modal-container")
+], g.prototype, "modalContainer", 2);
+f([
+  X("#email-input")
+], g.prototype, "emailInput", 2);
+f([
+  X(".modal-body")
+], g.prototype, "modalBody", 2);
+g = f([
+  xt("cals-auth")
+], g);
+export {
+  g as CalsAuth
+};