@openlv/modal 0.0.1-beta.2

package/dist/index.js

@@ -0,0 +1,1355 @@
+var Ye = Object.defineProperty;
+var $e = (e, t, r) => t in e ? Ye(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r;
+var F = (e, t, r) => $e(e, typeof t != "symbol" ? t + "" : t, r);
+import { jsx as s, jsxs as d, Fragment as et } from "preact/jsx-runtime";
+import { useEffect as L, useContext as ae, useState as y, useCallback as C, useRef as Se, useReducer as Ne, useMemo as Ae, useLayoutEffect as Z, useImperativeHandle as Oe, useId as je, useDebugValue as Re } from "preact/hooks";
+import { createContext as Pe, createElement as R, Fragment as z, Component as B, createRef as tt, toChildArray as j, cloneElement as rt, render as T, hydrate as nt, options as b, h as ot } from "preact";
+import it from "qrcode-generator";
+function at(e) {
+  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
+}
+var Y = { exports: {} };
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/
+var fe;
+function st() {
+  return fe || (fe = 1, (function(e) {
+    (function() {
+      var t = {}.hasOwnProperty;
+      function r() {
+        for (var i = "", a = 0; a < arguments.length; a++) {
+          var l = arguments[a];
+          l && (i = o(i, n(l)));
+        }
+        return i;
+      }
+      function n(i) {
+        if (typeof i == "string" || typeof i == "number")
+          return i;
+        if (typeof i != "object")
+          return "";
+        if (Array.isArray(i))
+          return r.apply(null, i);
+        if (i.toString !== Object.prototype.toString && !i.toString.toString().includes("[native code]"))
+          return i.toString();
+        var a = "";
+        for (var l in i)
+          t.call(i, l) && i[l] && (a = o(a, l));
+        return a;
+      }
+      function o(i, a) {
+        return a ? i ? i + " " + a : i + a : i;
+      }
+      e.exports ? (r.default = r, e.exports = r) : window.classNames = r;
+    })();
+  })(Y)), Y.exports;
+}
+var lt = st();
+const Le = /* @__PURE__ */ at(lt), v = Symbol.for("@ts-pattern/matcher"), Ee = Symbol.for("@ts-pattern/isVariadic"), J = "@ts-pattern/anonymous-select-key", ee = (e) => !!(e && typeof e == "object"), V = (e) => e && !!e[v], h = (e, t, r) => {
+  if (V(e)) {
+    const n = e[v](), { matched: o, selections: i } = n.match(t);
+    return o && i && Object.keys(i).forEach((a) => r(a, i[a])), o;
+  }
+  if (ee(e)) {
+    if (!ee(t)) return !1;
+    if (Array.isArray(e)) {
+      if (!Array.isArray(t)) return !1;
+      let n = [], o = [], i = [];
+      for (const a of e.keys()) {
+        const l = e[a];
+        V(l) && l[Ee] ? i.push(l) : i.length ? o.push(l) : n.push(l);
+      }
+      if (i.length) {
+        if (i.length > 1) throw new Error("Pattern error: Using `...P.array(...)` several times in a single pattern is not allowed.");
+        if (t.length < n.length + o.length) return !1;
+        const a = t.slice(0, n.length), l = o.length === 0 ? [] : t.slice(-o.length), c = t.slice(n.length, o.length === 0 ? 1 / 0 : -o.length);
+        return n.every((f, w) => h(f, a[w], r)) && o.every((f, w) => h(f, l[w], r)) && (i.length === 0 || h(i[0], c, r));
+      }
+      return e.length === t.length && e.every((a, l) => h(a, t[l], r));
+    }
+    return Reflect.ownKeys(e).every((n) => {
+      const o = e[n];
+      return (n in t || V(i = o) && i[v]().matcherType === "optional") && h(o, t[n], r);
+      var i;
+    });
+  }
+  return Object.is(t, e);
+}, m = (e) => {
+  var t, r, n;
+  return ee(e) ? V(e) ? (t = (r = (n = e[v]()).getSelectionKeys) == null ? void 0 : r.call(n)) != null ? t : [] : Array.isArray(e) ? M(e, m) : M(Object.values(e), m) : [];
+}, M = (e, t) => e.reduce((r, n) => r.concat(t(n)), []);
+function ct(...e) {
+  if (e.length === 1) {
+    const [t] = e;
+    return (r) => h(t, r, () => {
+    });
+  }
+  if (e.length === 2) {
+    const [t, r] = e;
+    return h(t, r, () => {
+    });
+  }
+  throw new Error(`isMatching wasn't given the right number of arguments: expected 1 or 2, received ${e.length}.`);
+}
+function g(e) {
+  return Object.assign(e, { optional: () => se(e), and: (t) => p(e, t), or: (t) => Fe(e, t), select: (t) => t === void 0 ? W(e) : W(t, e) });
+}
+function te(e) {
+  return Object.assign(((t) => Object.assign(t, { [Symbol.iterator]() {
+    let r = 0;
+    const n = [{ value: Object.assign(t, { [Ee]: !0 }), done: !1 }, { done: !0, value: void 0 }];
+    return { next: () => {
+      var o;
+      return (o = n[r++]) != null ? o : n.at(-1);
+    } };
+  } }))(e), { optional: () => te(se(e)), select: (t) => te(t === void 0 ? W(e) : W(t, e)) });
+}
+function se(e) {
+  return g({ [v]: () => ({ match: (t) => {
+    let r = {};
+    const n = (o, i) => {
+      r[o] = i;
+    };
+    return t === void 0 ? (m(e).forEach((o) => n(o, void 0)), { matched: !0, selections: r }) : { matched: h(e, t, n), selections: r };
+  }, getSelectionKeys: () => m(e), matcherType: "optional" }) });
+}
+const ut = (e, t) => {
+  for (const r of e) if (!t(r)) return !1;
+  return !0;
+}, dt = (e, t) => {
+  for (const [r, n] of e.entries()) if (!t(n, r)) return !1;
+  return !0;
+}, pt = (e, t) => {
+  const r = Reflect.ownKeys(e);
+  for (const n of r) if (!t(n, e[n])) return !1;
+  return !0;
+};
+function p(...e) {
+  return g({ [v]: () => ({ match: (t) => {
+    let r = {};
+    const n = (o, i) => {
+      r[o] = i;
+    };
+    return { matched: e.every((o) => h(o, t, n)), selections: r };
+  }, getSelectionKeys: () => M(e, m), matcherType: "and" }) });
+}
+function Fe(...e) {
+  return g({ [v]: () => ({ match: (t) => {
+    let r = {};
+    const n = (o, i) => {
+      r[o] = i;
+    };
+    return M(e, m).forEach((o) => n(o, void 0)), { matched: e.some((o) => h(o, t, n)), selections: r };
+  }, getSelectionKeys: () => M(e, m), matcherType: "or" }) });
+}
+function u(e) {
+  return { [v]: () => ({ match: (t) => ({ matched: !!e(t) }) }) };
+}
+function W(...e) {
+  const t = typeof e[0] == "string" ? e[0] : void 0, r = e.length === 2 ? e[1] : typeof e[0] == "string" ? void 0 : e[0];
+  return g({ [v]: () => ({ match: (n) => {
+    let o = { [t ?? J]: n };
+    return { matched: r === void 0 || h(r, n, (i, a) => {
+      o[i] = a;
+    }), selections: o };
+  }, getSelectionKeys: () => [t ?? J].concat(r === void 0 ? [] : m(r)) }) });
+}
+function Be(e) {
+  return !0;
+}
+function x(e) {
+  return typeof e == "number";
+}
+function S(e) {
+  return typeof e == "string";
+}
+function N(e) {
+  return typeof e == "bigint";
+}
+const Te = g(u(Be)), ft = g(u(Be)), ht = Te, A = (e) => Object.assign(g(e), { startsWith: (t) => {
+  return A(p(e, (r = t, u((n) => S(n) && n.startsWith(r)))));
+  var r;
+}, endsWith: (t) => {
+  return A(p(e, (r = t, u((n) => S(n) && n.endsWith(r)))));
+  var r;
+}, minLength: (t) => A(p(e, ((r) => u((n) => S(n) && n.length >= r))(t))), length: (t) => A(p(e, ((r) => u((n) => S(n) && n.length === r))(t))), maxLength: (t) => A(p(e, ((r) => u((n) => S(n) && n.length <= r))(t))), includes: (t) => {
+  return A(p(e, (r = t, u((n) => S(n) && n.includes(r)))));
+  var r;
+}, regex: (t) => {
+  return A(p(e, (r = t, u((n) => S(n) && !!n.match(r)))));
+  var r;
+} }), he = A(u(S)), k = (e) => Object.assign(g(e), { between: (t, r) => k(p(e, ((n, o) => u((i) => x(i) && n <= i && o >= i))(t, r))), lt: (t) => k(p(e, ((r) => u((n) => x(n) && n < r))(t))), gt: (t) => k(p(e, ((r) => u((n) => x(n) && n > r))(t))), lte: (t) => k(p(e, ((r) => u((n) => x(n) && n <= r))(t))), gte: (t) => k(p(e, ((r) => u((n) => x(n) && n >= r))(t))), int: () => k(p(e, u((t) => x(t) && Number.isInteger(t)))), finite: () => k(p(e, u((t) => x(t) && Number.isFinite(t)))), positive: () => k(p(e, u((t) => x(t) && t > 0))), negative: () => k(p(e, u((t) => x(t) && t < 0))) }), gt = k(u(x)), O = (e) => Object.assign(g(e), { between: (t, r) => O(p(e, ((n, o) => u((i) => N(i) && n <= i && o >= i))(t, r))), lt: (t) => O(p(e, ((r) => u((n) => N(n) && n < r))(t))), gt: (t) => O(p(e, ((r) => u((n) => N(n) && n > r))(t))), lte: (t) => O(p(e, ((r) => u((n) => N(n) && n <= r))(t))), gte: (t) => O(p(e, ((r) => u((n) => N(n) && n >= r))(t))), positive: () => O(p(e, u((t) => N(t) && t > 0))), negative: () => O(p(e, u((t) => N(t) && t < 0))) }), mt = O(u(N)), vt = g(u(function(e) {
+  return typeof e == "boolean";
+})), bt = g(u(function(e) {
+  return typeof e == "symbol";
+})), wt = g(u(function(e) {
+  return e == null;
+})), yt = g(u(function(e) {
+  return e != null;
+}));
+var le = { __proto__: null, matcher: v, optional: se, array: function(...e) {
+  return te({ [v]: () => ({ match: (t) => {
+    if (!Array.isArray(t)) return { matched: !1 };
+    if (e.length === 0) return { matched: !0 };
+    const r = e[0];
+    let n = {};
+    if (t.length === 0) return m(r).forEach((i) => {
+      n[i] = [];
+    }), { matched: !0, selections: n };
+    const o = (i, a) => {
+      n[i] = (n[i] || []).concat([a]);
+    };
+    return { matched: t.every((i) => h(r, i, o)), selections: n };
+  }, getSelectionKeys: () => e.length === 0 ? [] : m(e[0]) }) });
+}, set: function(...e) {
+  return g({ [v]: () => ({ match: (t) => {
+    if (!(t instanceof Set)) return { matched: !1 };
+    let r = {};
+    if (t.size === 0) return { matched: !0, selections: r };
+    if (e.length === 0) return { matched: !0 };
+    const n = (i, a) => {
+      r[i] = (r[i] || []).concat([a]);
+    }, o = e[0];
+    return { matched: ut(t, (i) => h(o, i, n)), selections: r };
+  }, getSelectionKeys: () => e.length === 0 ? [] : m(e[0]) }) });
+}, map: function(...e) {
+  return g({ [v]: () => ({ match: (t) => {
+    if (!(t instanceof Map)) return { matched: !1 };
+    let r = {};
+    if (t.size === 0) return { matched: !0, selections: r };
+    const n = (l, c) => {
+      r[l] = (r[l] || []).concat([c]);
+    };
+    if (e.length === 0) return { matched: !0 };
+    var o;
+    if (e.length === 1) throw new Error(`\`P.map\` wasn't given enough arguments. Expected (key, value), received ${(o = e[0]) == null ? void 0 : o.toString()}`);
+    const [i, a] = e;
+    return { matched: dt(t, (l, c) => {
+      const f = h(i, c, n), w = h(a, l, n);
+      return f && w;
+    }), selections: r };
+  }, getSelectionKeys: () => e.length === 0 ? [] : [...m(e[0]), ...m(e[1])] }) });
+}, record: function(...e) {
+  return g({ [v]: () => ({ match: (t) => {
+    if (t === null || typeof t != "object" || Array.isArray(t)) return { matched: !1 };
+    var r;
+    if (e.length === 0) throw new Error(`\`P.record\` wasn't given enough arguments. Expected (value) or (key, value), received ${(r = e[0]) == null ? void 0 : r.toString()}`);
+    let n = {};
+    const o = (l, c) => {
+      n[l] = (n[l] || []).concat([c]);
+    }, [i, a] = e.length === 1 ? [he, e[0]] : e;
+    return { matched: pt(t, (l, c) => {
+      const f = typeof l != "string" || Number.isNaN(Number(l)) ? null : Number(l), w = f !== null && h(i, f, o), Ge = h(i, l, o), qe = h(a, c, o);
+      return (Ge || w) && qe;
+    }), selections: n };
+  }, getSelectionKeys: () => e.length === 0 ? [] : [...m(e[0]), ...m(e[1])] }) });
+}, intersection: p, union: Fe, not: function(e) {
+  return g({ [v]: () => ({ match: (t) => ({ matched: !h(e, t, () => {
+  }) }), getSelectionKeys: () => [], matcherType: "not" }) });
+}, when: u, select: W, any: Te, unknown: ft, _: ht, string: he, number: gt, bigint: mt, boolean: vt, symbol: bt, nullish: wt, nonNullable: yt, instanceOf: function(e) {
+  return g(u(/* @__PURE__ */ (function(t) {
+    return (r) => r instanceof t;
+  })(e)));
+}, shape: function(e) {
+  return g(u(ct(e)));
+} };
+let xt = class extends Error {
+  constructor(t) {
+    let r;
+    try {
+      r = JSON.stringify(t);
+    } catch {
+      r = t;
+    }
+    super(`Pattern matching error: no pattern matches value ${r}`), this.input = void 0, this.input = t;
+  }
+};
+const re = { matched: !1, value: void 0 };
+function _(e) {
+  return new kt(e, re);
+}
+let kt = class ne {
+  constructor(t, r) {
+    this.input = void 0, this.state = void 0, this.input = t, this.state = r;
+  }
+  with(...t) {
+    if (this.state.matched) return this;
+    const r = t[t.length - 1], n = [t[0]];
+    let o;
+    t.length === 3 && typeof t[1] == "function" ? o = t[1] : t.length > 2 && n.push(...t.slice(1, t.length - 1));
+    let i = !1, a = {};
+    const l = (f, w) => {
+      i = !0, a[f] = w;
+    }, c = !n.some((f) => h(f, this.input, l)) || o && !o(this.input) ? re : { matched: !0, value: r(i ? J in a ? a[J] : a : this.input, this.input) };
+    return new ne(this.input, c);
+  }
+  when(t, r) {
+    if (this.state.matched) return this;
+    const n = !!t(this.input);
+    return new ne(this.input, n ? { matched: !0, value: r(this.input, this.input) } : re);
+  }
+  otherwise(t) {
+    return this.state.matched ? this.state.value : t(this.input);
+  }
+  exhaustive(t = Ct) {
+    return this.state.matched ? this.state.value : t(this.input);
+  }
+  run() {
+    return this.exhaustive();
+  }
+  returnType() {
+    return this;
+  }
+  narrow() {
+    return this;
+  }
+};
+function Ct(e) {
+  throw new xt(e);
+}
+const _t = async (e) => {
+  if (!e) return !1;
+  try {
+    if (navigator?.clipboard?.writeText)
+      return await navigator.clipboard.writeText(e), !0;
+  } catch {
+  }
+  try {
+    const t = document.createElement("textarea");
+    t.value = e, t.style.position = "fixed", t.style.left = "-999999px", t.style.top = "-999999px", document.body.appendChild(t), t.focus(), t.select();
+    const r = document.execCommand("copy");
+    return document.body.removeChild(t), r;
+  } catch {
+    return !1;
+  }
+}, H = (e, t, r) => {
+  L(() => (e?.on(t, r), () => {
+    e?.off(t, r);
+  }), [e, t]);
+}, De = Pe({
+  provider: void 0,
+  storage: void 0
+}), St = ({
+  provider: e,
+  storage: t,
+  onClose: r
+}) => /* @__PURE__ */ s(De.Provider, { value: { provider: e, storage: t }, children: /* @__PURE__ */ s(Fr, { onClose: r }) }), E = () => {
+  const e = ae(De), { provider: t, storage: r } = e, [n, o] = y(
+    t?.getState().status || "disconnected"
+  );
+  if (H(
+    t?.emitter,
+    "status_change",
+    (i) => {
+      o(i);
+    }
+  ), !e.provider) throw new Error("Provider not found");
+  return { provider: t, status: n, storage: r };
+}, Nt = (e) => {
+  const t = new URLSearchParams();
+  return t.set("h", e.h), t.set("k", e.k), e.p && t.set("p", e.p), e.s && t.set("s", e.s), `openlv://${e.sessionId}?${t.toString()}`;
+}, D = (...e) => console.log(
+  "%c[modal]%c",
+  "color: yellow; font-weight: bold",
+  "color: inherit; font-weight: normal",
+  ...e
+), ce = () => {
+  const { storage: e } = E(), [t, r] = y(
+    e?.getSettings()
+  );
+  return H(e?.emitter, "settings_change", (o) => {
+    r(o);
+  }), { settings: t, updateSettings: (o) => {
+    if (!t) return;
+    const i = {
+      ...t,
+      ...o,
+      session: {
+        ...t?.session || {},
+        ...o.session || {}
+      }
+    };
+    r(i), e?.setSettings(i);
+  } };
+}, G = () => {
+  const { provider: e } = E(), [t, r] = y(
+    e?.getSession()
+  ), n = t?.getHandshakeParameters(), o = n ? Nt(n) : void 0, [i, a] = y(
+    t?.getState()
+  );
+  return H(t?.emitter, "state_change", (l) => {
+    D("session state change: ", l), a(l);
+  }), H(e?.emitter, "session_started", (l) => {
+    D("session started: ", l), r(l), a(l.getState());
+  }), L(() => {
+    t && a(t.getState());
+  }, [t]), {
+    uri: o,
+    status: i
+  };
+}, At = () => {
+  const { provider: e } = E(), { settings: t } = ce();
+  return {
+    start: () => {
+      e?.createSession(t?.session);
+    }
+  };
+}, K = ({ state: e }) => {
+  const { status: t, uri: r } = G(), { status: n } = E();
+  return console.error("Unknown state: ", { state: e, sessionStatus: t, providerStatus: n }), /* @__PURE__ */ d("div", { className: "rounded-md bg-gray-100 p-2 text-gray-500", children: [
+    /* @__PURE__ */ d("div", { children: [
+      "Unknown state: ",
+      JSON.stringify(e)
+    ] }),
+    /* @__PURE__ */ d("div", { children: [
+      "URI: ",
+      r
+    ] }),
+    /* @__PURE__ */ d("div", { children: [
+      "Session Status: ",
+      JSON.stringify(t)
+    ] }),
+    /* @__PURE__ */ d("div", { children: [
+      "Provider Status: ",
+      JSON.stringify(n)
+    ] })
+  ] });
+}, Ot = () => /* @__PURE__ */ s("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ s("div", { className: "h-8 w-8 animate-spin rounded-full border-4 border-blue-500 border-t-transparent" }) }), jt = ({ onClose: e, onCopy: t }) => {
+  const { uri: r, status: n = { status: "created" } } = G(), o = "", i = C(() => {
+    r && t(r);
+  }, [r, t]), a = C((l) => {
+    const c = it(0, "M");
+    return c.addData(l), c.make(), c.createSvgTag({ cellSize: 5, margin: 0, scalable: !0 });
+  }, []);
+  return _(n).with({ status: "disconnected" }, () => /* @__PURE__ */ s("div", { children: "hi" })).with(
+    { status: le.union("created", "signaling", "connected", "ready") },
+    (l) => _(l.signaling).with({ state: "connecting" }, () => /* @__PURE__ */ d("div", { className: "flex flex-col items-center gap-4 p-6", children: [
+      /* @__PURE__ */ s(Ot, {}),
+      /* @__PURE__ */ d("div", { className: "text-center", children: [
+        /* @__PURE__ */ s("h3", { className: "mb-2 font-semibold text-gray-900 text-lg", children: "Connecting" }),
+        /* @__PURE__ */ s("p", { className: "text-gray-500 text-sm", children: "Waiting for wallet to connect..." })
+      ] })
+    ] })).with({ state: "handshake-open" }, () => /* @__PURE__ */ d("div", { className: "flex flex-col items-center gap-4 px-2", children: [
+      /* @__PURE__ */ d("div", { className: "w-full space-y-4 rounded-md border border-neutral-200 bg-neutral-100 p-4", children: [
+        r && /* @__PURE__ */ s("div", { className: "relative mx-auto flex w-fit items-center justify-center rounded-lg border-2 border-gray-200 bg-gray-50 p-4", children: /* @__PURE__ */ s(
+          "div",
+          {
+            className: "flex h-[200px] w-[200px] cursor-pointer items-center justify-center",
+            onClick: i,
+            title: "Click to copy connection URL",
+            dangerouslySetInnerHTML: { __html: a(r) }
+          }
+        ) }),
+        /* @__PURE__ */ s("div", { className: "w-full", children: /* @__PURE__ */ s(
+          "button",
+          {
+            type: "button",
+            onClick: i,
+            className: "w-full cursor-pointer rounded-lg border border-gray-300 bg-gray-200 px-4 py-2 text-gray-700 text-sm transition hover:bg-gray-300",
+            children: "Copy Connection URL"
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ d("div", { className: "w-full", children: [
+        /* @__PURE__ */ s("span", { children: "Scan the link above using your mobile wallet." }),
+        /* @__PURE__ */ s("br", {}),
+        /* @__PURE__ */ s("span", { children: "Or copy the link and paste it into your wallet." })
+      ] })
+    ] })).with({ state: "handshake-closed" }, () => /* @__PURE__ */ s("div", { className: "flex flex-col items-center gap-4 p-6", children: /* @__PURE__ */ s("div", { className: "text-center", children: /* @__PURE__ */ s("h3", { className: "mb-2 font-semibold text-gray-900 text-lg", children: "Establishing e2e encryption..." }) }) })).with({ state: "xr-encrypted" }, () => /* @__PURE__ */ s("div", { className: "flex flex-col items-center gap-4 p-6", children: /* @__PURE__ */ d("div", { className: "text-center", children: [
+      /* @__PURE__ */ s("div", { className: "mb-4 text-4xl", children: "✅" }),
+      /* @__PURE__ */ s("h3", { className: "mb-2 font-semibold text-gray-900 text-lg", children: "Connected Successfully!" }),
+      o,
+      /* @__PURE__ */ s("p", { className: "text-gray-500 text-sm", children: "Your wallet is now connected and ready to use." })
+    ] }) })).with({ state: "disconnected" }, () => /* @__PURE__ */ d("div", { className: "flex flex-col items-center gap-4 p-6", children: [
+      /* @__PURE__ */ d("div", { className: "text-center", children: [
+        /* @__PURE__ */ s("div", { className: "mb-4 text-4xl", children: "🔌" }),
+        /* @__PURE__ */ s("h3", { className: "mb-2 font-semibold text-gray-900 text-lg", children: "Disconnected" }),
+        /* @__PURE__ */ s("p", { className: "mb-4 text-gray-500 text-sm", children: "The connection has been closed." })
+      ] }),
+      /* @__PURE__ */ s(
+        "button",
+        {
+          type: "button",
+          onClick: e,
+          className: "w-full rounded-lg bg-gray-100 px-4 py-2 font-semibold text-gray-700 text-sm transition hover:bg-gray-200",
+          children: "Close"
+        }
+      )
+    ] })).otherwise(() => /* @__PURE__ */ s(K, { state: n }))
+  ).otherwise(() => /* @__PURE__ */ s(K, { state: n }));
+}, Rt = () => {
+  const { start: e } = At();
+  return /* @__PURE__ */ d("div", { className: "flex flex-col items-center gap-4 p-6", children: [
+    /* @__PURE__ */ d("div", { className: "text-center", children: [
+      /* @__PURE__ */ s("h3", { className: "mb-2 font-semibold text-gray-900 text-lg", children: "Ready to Connect" }),
+      /* @__PURE__ */ s("p", { className: "mb-4 text-gray-500 text-sm", children: "Click the button below to start the connection process." })
+    ] }),
+    /* @__PURE__ */ s(
+      "button",
+      {
+        type: "button",
+        onClick: e,
+        className: "w-full cursor-pointer rounded-lg bg-blue-500 px-6 py-3 font-semibold text-sm text-white transition hover:bg-blue-600",
+        children: "Start Connection"
+      }
+    )
+  ] });
+}, Pt = "data:image/webp;base64,UklGRjYRAABXRUJQVlA4WAoAAAAQAAAAfwAAfwAAQUxQSOwHAAABsIb///k21zdJk7anNmfbRrf01uztcO5s2yqOPdu27e2ybaPtlLRJ83nw+ye/3++PZ/eDiJgA+hV0c620Pml9MhYu8HlhejUhJbv1SfO5T+964XrgN/I9hD5uLKDZXXDnXPhfq0ImrdX+BMHb/blCjkJo3v2laeVsmvojRJ8L5ir7Vgz7auuIclbtpHwTtdjCFXlBHIBXGzpFaiXwr06lAt/dR8oQf9cPMgDXyW4R2qCAdvPS09MzBnfo6HPrWBJobjAj3fd5q5+4fAFcJ1qY5dnCbHxathRv/+9rX3wAcrPiZbXafX5TRR1hoxvPPPjJG7ApRE7d5wDOFNYXIgqsO/6M04uzuZSSl8D20B0iCu+465sCusuw/AOKvfSIKKDdYeZVTRmp2QqXk/WJKDr93fdHnUhiwE6w2W1Jty2VGpYkmY2zFeaY9Et6FtirhcioYy4pjCLDbviFeVzcuHqB3WI1rvkKQ8mwbfuY702MK+4mk1PTuAo9Ze4lGNgT5k6scRV7xpwIkRFevWkTVTatFWWSZxLR5DuzwSyuWvr5jw6V5lxZmGKRU+/vi1oH8lV9Lydo/DOoOjsrUUbqC8A5ycSV/JjZaROUvKwAaj9WRpxpGQDcT+Yq/YrZFyAmeD00eDxJmHUP86UeV6qT2WAWYp5VwORfWLTng8LnBXPmSsw65mAw31/YbuZbA64f8yQ0zwGAh70jyL/BbsaTRVJD2l1k8vrqRvgxALhVl9jIFQCQa5dCVP4sANwppRcDXACym5FyoTMAsDVIDlV5AABZOhF1CQAyzF6oxRcAX3+QRAMLADyvIGgX86aCev6QD+BGUfLutwgA1lolhe0HgLliws8zd2JVY90EABPJ17ofALyrJona5wG4HC0k+bGgVCezUUDVNwCelvbJugkARsiKugAgr62aijxk5hD/CABYYPaJfucGsN1fEk0FgD/LiOOiod+AcyX5rJsAuNqR74UfAHhVVlb9XACXooU8Ym7H8lnbTBlWkviLPQHwpDiHeSkAdydZoScBZNcQUfUDsy+AT/SPDgCrLRzUBwCyZNGfAXi6i/jByWw0q2UoAEwm3jqfABwKlNXNA+DvIlIVNqlmIQB3J66o6wCuRMmqkwtgf4DWrDsBfKjCZdsB4G05WQl3AZwN0VrMDQBXorloOQBnM1m2XQCeFxfQIp9ZZVJJ3F0AhwP4JgHwdJZlWg/gQ2UBI8BOJpWWfgngqJK5XMeGIUpDAGC0LFoIwNVawBiFcWpp+A3AWgsTmvHa/WVvFYXW+QDWN7Hb7VUCFExFm9jt9tSKZgW/Cna7PWUBAHc7Ae1cAFztVZVF7AAPAOwMZhp9B+B2OBzOD0vDmX6PHE6Hw/lmmj8RWSe9dTocDpeoyJ0Adkepz28H2I+VmMaMsrsjESXdgXJ2VSKqmwPvQii+z/JhSaQ+2z6FnGpcGEREZd97+V6fiNq6JalbIZMxLVK4ncg08uVBVSIKWuPlUAIRxZ3WkUbMfIbKnQXwsSuxKcyZWbNnz5lWm9j4YXNnz549Z0wRYitOnjN79sxDulAnF8ChAIbKZG5dkmpS6OkBkE6yR+pC0gMAh5WILCZSHgkAmdJG6UL8PQBnQr34OF+nIjoNqWvlCT0N4HlxLvN6fYpeU4CcyX4c5o0AvqZwhV3UpxEA8L4KB80GgH5chR7q098Z/JGnnQvAv7ja5uvT3xS68VR6D+B0KM9cGEjEWQA5tTmCjhgJzQKAsRy1PhlK63wAJ0N8mwpDibsC4OsvPiXdMhbKAoDN/r4M9hhMzbcAvrb3IfEitFak2U/RqjL/FwAuFfZi/Re01uCKK+9gSXHuznxU4y0ArI9RMA12aC14PwBkirBuYXJqCDBNZ7AuiYhsg78AQK5bQ7F3mWvRAgKPM9nVBFD0QQaXBjVtv/E7ALyc+UVLt5mnhQXE3WAeFxVBNR4y8DhdYPN6N/yupTvMk0ICyrxhLocLIfsjxmveFHMjLYWdZT7VEPCjgzkdIoZSzvjwsq+NGjMZGjFvYPKbCegDdjGJTph9x828W1GDSCmLLHJpjCDKYDBKwCKFQcKICnWaNmv2yOpW8nZ/y1a5m28AKBDxJw+zxswVeYn5niLB9+qfoFZHqoBG35hLUVyFnzJPS6gkaI9qLkQLSLrHZNfgir/DrPVTCTV6qZLsLiTQtpf51oDLNNwJvG9Gqm2663W+S3b+u0MtTSKsuwWRteuGRXazeiiwXLMWsptXCiKh4ojMJjJEpfeVRRhl1CXmTpxxJT9RiDWuQo+Zu3HGVTeXORZsXKlOZpPZuLq4mWUm45oJdgIZdtARxtXBuEo8Y16XMa7+HuZUqGFFnwQ7nWT6WXVttIfJri/B/Psdu6cX06/462B3BUholg3gVu8IvSr3nvnWnsRbVoN1nehfzKxLSXeZ5VYJflsUADxc279CuP5Q7xzgXHmS2dftBcDbi/N/Zy8e7IPJX9GiKcuPM/okk9TASR99AFDgeH5i/rx0xXlLDrKHNnQNFFFufEY6f0aPCD41muz783wR7BojoMF9CPWsj9QAUUinXTmScCeRy7YRogdogiggJfOMQ8rL4lwRV4XN0wgRRfw4Yc8Lp7CVNi7LYlGe3tohooBSv0xcfebxF4+Xb5+VP20qRfwVLojJXxquKdYUUqRe1z5paWlpfXql1FKsXfU3JLJ49z5p/H3ahdCvnwNWUDggJAkAAFAzAJ0BKoAAgAA+TR6NRCKhoZUKb+QoBMS0gXAB+AH6AA+Ufoz/Jfxg77f7Z+S/YJ+nfbP1gq1XNV9yP0v9m88u9n4J6gXsHdvbKegF67/Sv+T4Lf9d6F/VT2AP5b/Kf+VyINAD+K/1H/h/43+8fC5/Lf9f7u/bv+Wf4H/xf5X4Bv43/Qv+F/avaA9c37VewZ+qi6YnObtVG6xTptSDxWdZOyXNa59dCAiUQx0s9QeFuTtEkCCZ1VDt2yVu6wuLleg8UGC+xygF+ikCc6OFScW3keDjkgMNXtWhnlVuP8adiwFQqtWB898/cNZ/ZPZSbT/SGkUu9L/80Jh9MhRi3Uj+yGTg6IHihIpDzvYgtbVOefgBSvK2WP/ViDlFYMqcmV3S37jDRft7Kj/mgg3mnWnsm+HacJJd/5io8v7EadJwLNxOge91hk1mPHA+PYMINGKvA97JcZEFvzSmFAqBtHUzKqf50fXJLd0XhZmBQWhr/vwnXFii3VNfEfiIXySQr4RbWO8yPn7m0Z/G9Qg9KvDGNk/4ljKJZS1VxLuWUk+To4QAAP7+R5Re1p/qxbSLcVAEvC2Ae4+JAjoahTi+1Tx+R05wIIyRWKCPZqNwQFn8n4hkHC+YaT3NWwkaKKHw8WZH8NqlsIlsWxinFRzXJs8GKMdG2p7hG3px0/aKtlukGtCOvGxG+BPnLqe18kpHi6ID1Cv9VF+k0GfsVXRTfFJ5kFnxBXWEWfHSCRjr5ChoztIFhGiUjdeGW4oPH0mJRKxppXb/SuuY9AJME864F/0/K+rCPHrn4fAaKjIrvZAAGFSMZfovGmlhlAOl0kQHWDDypV8h5DEaTfOmXo5EIScC+SMO14Ob/u1b/QV6+wekJBWTZhjk7IgO7VyRpgGNBj23IgoGI3ZehsZNjz/FwpX2moSeDzk53u1qkXHaKG5d2qCOZSmjD/Mw60AzF22eAe+RoeFKSwUIci9CQD/6et+xH8moMwLOUzzuwuyvWC4o2rAhgXyPm9/OgwkYNR/47Hy+a8QNAxmh8RiQHQGZWu2c8agkAJ64pR2Tx0moSJcAN6mcLGZJM6OR4UvYNwbS3zHo/m2mznwl6FpIv416AQ2FRptmE3mPGs+fumcGy9QktCC15M3KIwNfUa+v+vCs+8cLY3ceuO7FOrdF4O62gur2g1PMJvcYV8xIJTjMC2ZxBtam98jF7JFQus/mSBWdPgN/EJ8azS69gF/kVpet+eEfx0gPfWCS/lXuCCxSTaW6UFiLosH3nrqmK5mWavssaOjz3T6dTb2/wflvaP/c2Q2mXRtiIL0wWJNO1WesBYkScU+pmuiwAuOw62WA6KAf9AOh7glFdfHQf81TCfj3NLS64NeCeXZ+S5Ea0iXT6aKx7ozBGub6ThREbIi3Xg7TnjOFoNnqzOnl2FumRXpwwuB6SujUtv/oX3hzheHNMPGb5C+LuOWwS4BAdAwTnE2vklObQHXtcp59P/ePfam2i7JOlXAWMQBQNP8a1w1rbnyxKFwYqsipF4ckJx3bppb4fgDS/FF2/y46LUyi1BnmZawEb37wuvOD3INuDKaakzzJyAzc2ta/DPhrpHaRn3O5CWc3s860AfNLwHDvxZs7JbQmcAv9paq37frkj2TJJ8P1GdMqpV35v5jukCYvxXga7V7ByDA/GZYBpJnBURfvGjAlOFtypjNWTjzA9zf475TTmOmroREsje7XMgekroBn4vwoWtc0UaaztuLsC9M2tModgoRBzav0PdM3molaBeu6PSwD3AYmgUHitoDOfvM2d85I7Q2I1FbNTmueFesWyTDRlN1T8+fTgaoZpKhrlx/kS+FNkrUKBy6yu68r8BgwNrGNfCLBh0RlefCkZMvUsB206vOJyP+JYtyXtPGzwuvvQ1NnzNCo/yfQtMBUFr0LMyfftfGbGw/uAuQC8VbqHI7vGtA35Pa/DoSi0zpfklckK/28i5yRB7UBdmsXAI4Xv+y5gLBNKYBZE4r3Ys+TE2oYTNlGGM22J0nkGvvERFqksAH7KakYgGUiGfDLagwIMw8o290UXsXUzA5nyTBBbMVjIriG4zcPG5/0lt3Hq3ykjGQZBYE2RFw15tOWJpEBpHoaSxwDmkDPEretisSxreTo/Iul/Pkj1RPlpUpBzqZ5YIzh/ch9TvBAU7YkxhYoEGS8rfw/dgP9aRwT1caEoREnr087aLahcF/h+/JIJfVqi8kl5IbvseIuGA+m+e1JqF49+tndB4QCulVeeuQsql47VKHF/9q8PRMeGYIfPChm+Osj0cHvED3n39qHidL63b2WYqKMKjTTFeORKbtbEHY7b/Xs29zBbWjwaRQ77mEGpkgDUP8Ebi9KQ2JeoW28yYYSO7pF/mqd2E++jgS/MxBo/x1sK/Nz1ZsMB164YppO3fLO519Erh4lDdAgT58nCsImfBkKhteF9rcpwDZe9j0FQ9IT5nuJH1Bt0Zdd1fIIAkYBzje1xr+t4KDj2F7055fEf9VdfsyJPFcK1JZ26v73bpjXJkmUuzMs3+VbxZQ5/4WBwqFJdbOvpFQ4ot/+Hn+qL0oUn4PA4/cgMjQwiYL81rsWfgtbjRThL/oDLbwfK+9cKcerxpB/GJkt5+x8JVN1A3/YhzzMPDnbewqzn+EodKIALRzTXzDHTMQkNZZY6QKRycJ2VCb8vNvQBmdev/CpTn1fgsVtGDJ0+c1iOBN0/f1DQMifz17Os7Oz1pKw7eOP9dtuyGwI7pYe0cEAHId4jKsr5WYfoSOIgXwE7bTm6l9ytV0zbma1KfNP/Ueaf86PTBrUXb3mh1wOj2xW9r5slTCunQPsdDHdZhtq/ldOBDSm/8BZs0vOj+BaStwJTUL6ShMniBq45fMXgBYhE0HCVgrmd8huP1g79tfH/sI40kXryAN0Id9OxWe8OtUDqd+hFn5Lea/0IyqEMOo1l6zdXzTvnn7ZMZQ13YXZ42HNbFrHSpaISyLIEnjorwZViflpTYJU5+TBcgDljbeiGSw9XFp1juoAWD7Du38M26w9QFezhy38ycpTOQI5qBb7hvaPBeGCI6FZxDSfGL8DLCIuXSPDU1wKHXgrR9dz8+Jzlm9rQs+FlQrh/TVOKrVVxQAAAA==", Lt = () => {
+  const { status: e } = G(), { status: t } = E(), r = _(t).with("disconnected", () => {
+  }).with(
+    le.union("connected", "connecting", "error"),
+    () => _(e).with({ status: "disconnected" }, () => ({
+      icon: "🫲",
+      text: "Disconnected"
+    })).with(
+      { status: "signaling" },
+      (n) => _(n.signaling).with({ state: "handshake-open" }, () => ({
+        icon: "👋",
+        text: "Handshake Open"
+      })).with({ state: "handshake-closed" }, () => ({
+        icon: "🤝",
+        text: "Handshake Closed"
+      })).otherwise(() => ({
+        icon: "❓",
+        text: "Unknown " + n.signaling?.state
+      }))
+    ).otherwise((n) => ({
+      icon: "❓",
+      text: "Unknown " + JSON.stringify(n)
+    }))
+  ).otherwise(() => ({
+    icon: "❓",
+    text: "Unknown provider status " + JSON.stringify(t)
+  }));
+  return r ? /* @__PURE__ */ d("div", { className: "group flex items-center gap-2 rounded-md px-2 py-2 hover:bg-neutral-200", children: [
+    /* @__PURE__ */ s("div", { className: "text-gray-900 text-xs opacity-0 transition-opacity duration-300 group-hover:opacity-100", children: r.text }),
+    /* @__PURE__ */ s("div", { children: r.icon })
+  ] }) : /* @__PURE__ */ s(et, {});
+}, Et = () => /* @__PURE__ */ d("div", { className: "mt-2 flex items-end justify-between gap-2 px-1 text-gray-500", children: [
+  /* @__PURE__ */ d(
+    "a",
+    {
+      href: "https://github.com/v3xlabs/open-lavatory",
+      target: "_blank",
+      rel: "noreferrer",
+      className: "flex items-center gap-2 p-1 font-semibold text-gray-500 text-sm",
+      children: [
+        /* @__PURE__ */ s(
+          "img",
+          {
+            src: Pt,
+            alt: "Open Lavatory Logo",
+            width: 20,
+            height: 20,
+            className: "rounded"
+          }
+        ),
+        /* @__PURE__ */ s("span", { children: "openlv" })
+      ]
+    }
+  ),
+  /* @__PURE__ */ s("div", { className: "text-gray-500 text-sm", children: /* @__PURE__ */ s(Lt, {}) })
+] }), Ft = ({ size: e = 24 }) => (
+  // biome-ignore lint/a11y/noSvgWithoutTitle: Chevron left icon
+  /* @__PURE__ */ s(
+    "svg",
+    {
+      title: "Chevron left icon",
+      width: e,
+      height: e,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ s(
+        "path",
+        {
+          d: "M15.5 19L8.5 12L15.5 5",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    }
+  )
+), Bt = ({ size: e = 24 }) => (
+  // biome-ignore lint/a11y/noSvgWithoutTitle: Cog icon
+  /* @__PURE__ */ d(
+    "svg",
+    {
+      title: "Cog icon",
+      width: e,
+      height: e,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ s(
+          "path",
+          {
+            d: "M12 15C13.6569 15 15 13.6569 15 12C15 10.3431 13.6569 9 12 9C10.3431 9 9 10.3431 9 12C9 13.6569 10.3431 15 12 15Z",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ s(
+          "path",
+          {
+            d: "M19.4 15C19.2669 15.3016 19.2272 15.6362 19.286 15.9606C19.3448 16.285 19.4995 16.5843 19.73 16.82L19.79 16.88C19.976 17.0657 20.1235 17.2863 20.2241 17.5291C20.3248 17.7719 20.3766 18.0322 20.3766 18.295C20.3766 18.5578 20.3248 18.8181 20.2241 19.0609C20.1235 19.3037 19.976 19.5243 19.79 19.71C19.6043 19.896 19.3837 20.0435 19.1409 20.1441C18.8981 20.2448 18.6378 20.2966 18.375 20.2966C18.1122 20.2966 17.8519 20.2448 17.6091 20.1441C17.3663 20.0435 17.1457 19.896 16.96 19.71L16.9 19.65C16.6643 19.4195 16.365 19.2648 16.0396 19.206C15.7142 19.1472 15.3796 19.1869 15.078 19.32C14.7841 19.4468 14.532 19.6572 14.3543 19.9255C14.1766 20.1938 14.0813 20.5082 14.08 20.83V21C14.08 21.5304 13.8693 22.0391 13.4893 22.4191C13.1092 22.7992 12.6005 23.01 12.07 23.01C11.5395 23.01 11.0308 22.7992 10.6507 22.4191C10.2707 22.0391 10.06 21.5304 10.06 21V20.91C10.0587 20.5882 9.96337 20.2738 9.78568 20.0055C9.60799 19.7372 9.35593 19.5268 9.062 19.4C8.76038 19.2669 8.42579 19.2272 8.10135 19.286C7.77691 19.3448 7.47663 19.4995 7.242 19.73L7.182 19.79C6.99628 19.976 6.77566 20.1235 6.53284 20.2241C6.29002 20.3248 6.02971 20.3766 5.76693 20.3766C5.50415 20.3766 5.24384 20.3248 5.00102 20.2241C4.7582 20.1235 4.53758 19.976 4.35186 19.79C4.16591 19.6043 4.0184 19.3837 3.91776 19.1409C3.81712 18.8981 3.7654 18.6378 3.7654 18.375C3.7654 18.1122 3.81712 17.8519 3.91776 17.6091C4.0184 17.3663 4.16591 17.1457 4.35186 16.96L4.41186 16.9C4.6424 16.6643 4.79708 16.365 4.85586 16.0396C4.91464 15.7142 4.87497 15.3796 4.74186 15.078C4.615 14.7841 4.40463 14.532 4.13633 14.3543C3.86803 14.1766 3.55362 14.0813 3.23186 14.08H3.16186C2.63142 14.08 2.12271 13.8693 1.74264 13.4893C1.36257 13.1092 1.15186 12.6005 1.15186 12.07C1.15186 11.5395 1.36257 11.0308 1.74264 10.6507C2.12271 10.2707 2.63142 10.06 3.16186 10.06H3.25186C3.57362 10.0587 3.88803 9.96337 4.15633 9.78568C4.42463 9.60799 4.635 9.35593 4.76186 9.062C4.895 8.76038 4.93464 8.42579 4.87586 8.10135C4.81708 7.77691 4.6624 7.47763 4.43186 7.242L4.37186 7.182C4.18591 6.99628 4.0384 6.77566 3.93776 6.53284C3.83712 6.29002 3.7854 6.02971 3.7854 5.76693C3.7854 5.50415 3.83712 5.24384 3.93776 5.00102C4.0384 4.7582 4.18591 4.53758 4.37186 4.35186C4.55758 4.16591 4.7782 4.0184 5.02102 3.91776C5.26384 3.81712 5.52415 3.7654 5.78693 3.7654C6.04971 3.7654 6.31002 3.81712 6.55284 3.91776C6.79566 4.0184 7.01628 4.16591 7.202 4.35186L7.262 4.41186C7.49763 4.6424 7.79691 4.79708 8.12135 4.85586C8.44579 4.91464 8.78038 4.87497 9.082 4.74186C9.37593 4.615 9.62799 4.40463 9.80568 4.13633C9.98337 3.86803 10.0787 3.55362 10.08 3.23186V3.16186C10.08 2.63142 10.2907 2.12271 10.6707 1.74264C11.0508 1.36257 11.5595 1.15186 12.09 1.15186C12.6205 1.15186 13.1292 1.36257 13.5093 1.74264C13.8893 2.12271 14.1 2.63142 14.1 3.16186V3.25186C14.1013 3.57362 14.1966 3.88803 14.3743 4.15633C14.552 4.42463 14.8041 4.635 15.098 4.76186C15.3996 4.895 15.7342 4.93464 16.0586 4.87586C16.3831 4.81708 16.6824 4.6624 16.918 4.43186L16.978 4.37186C17.1637 4.18591 17.3843 4.0384 17.6271 3.93776C17.8699 3.83712 18.1302 3.7854 18.393 3.7854C18.6558 3.7854 18.9161 3.83712 19.1589 3.93776C19.4017 4.0384 19.6223 4.18591 19.808 4.37186C19.994 4.55758 20.1415 4.7782 20.2421 5.02102C20.3428 5.26384 20.3945 5.52415 20.3945 5.78693C20.3945 6.04971 20.3428 6.31002 20.2421 6.55284C20.1415 6.79566 19.994 7.01628 19.808 7.202L19.748 7.262C19.5175 7.49763 19.3628 7.79691 19.304 8.12135C19.2452 8.44579 19.2849 8.78038 19.418 9.082C19.5449 9.37593 19.7552 9.62799 20.0235 9.80568C20.2918 9.98337 20.6062 10.0787 20.928 10.08H20.998C21.5284 10.08 22.0371 10.2907 22.4172 10.6707C22.7973 11.0508 23.008 11.5595 23.008 12.09C23.008 12.6205 22.7973 13.1292 22.4172 13.5093C22.0371 13.8893 21.5284 14.1 20.998 14.1H20.908C20.5862 14.1013 20.2718 14.1966 20.0035 14.3743C19.7352 14.552 19.5248 14.8041 19.398 15.098L19.4 15Z",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        )
+      ]
+    }
+  )
+), Tt = ({
+  title: e,
+  view: t,
+  onToggleSettings: r,
+  setView: n,
+  onClose: o
+}) => {
+  const { status: i, provider: a } = E(), l = C(async () => {
+    D("closing session"), await a.closeSession();
+  }, [a]), c = C(() => {
+    D("status", i), _(i).with(
+      "disconnected",
+      () => _({ view: t }).with({ view: "settings" }, () => n("start")).with({ view: "start" }, o).otherwise(o)
+    ).with("connecting", l).with("connected", o).otherwise(o);
+  }, [i, t, n, o, l]);
+  return /* @__PURE__ */ d("div", { className: "flex items-center justify-between px-2 py-2", children: [
+    /* @__PURE__ */ s(
+      "button",
+      {
+        type: "button",
+        onClick: c,
+        "aria-label": t === "settings" ? "Back to QR" : "Close modal",
+        className: "flex h-8 w-8 cursor-pointer items-center justify-center rounded-lg transition-colors hover:bg-gray-200",
+        children: /* @__PURE__ */ s(Ft, {})
+      }
+    ),
+    /* @__PURE__ */ s("h2", { className: "flex items-center justify-center gap-2 font-semibold text-gray-900 text-lg", children: e }),
+    /* @__PURE__ */ s(
+      "button",
+      {
+        type: "button",
+        "aria-label": t === "settings" ? "Hide connection settings" : "Show connection settings",
+        "aria-pressed": t === "settings",
+        onClick: r,
+        className: "flex h-8 w-8 cursor-pointer items-center justify-center rounded-lg transition-colors hover:bg-gray-200",
+        children: /* @__PURE__ */ s(Bt, {})
+      }
+    )
+  ] });
+};
+function oe(e, t) {
+  for (var r in e) if (r !== "__source" && !(r in t)) return !0;
+  for (var n in t) if (n !== "__source" && e[n] !== t[n]) return !0;
+  return !1;
+}
+function ie(e, t) {
+  this.props = e, this.context = t;
+}
+function Dt(e, t) {
+  function r(o) {
+    var i = this.props.ref, a = i == o.ref;
+    return !a && i && (i.call ? i(null) : i.current = null), t ? !t(this.props, o) || !a : oe(this.props, o);
+  }
+  function n(o) {
+    return this.shouldComponentUpdate = r, R(e, o);
+  }
+  return n.displayName = "Memo(" + (e.displayName || e.name) + ")", n.prototype.isReactComponent = !0, n.__f = !0, n;
+}
+(ie.prototype = new B()).isPureReactComponent = !0, ie.prototype.shouldComponentUpdate = function(e, t) {
+  return oe(this.props, e) || oe(this.state, t);
+};
+var ge = b.__b;
+b.__b = function(e) {
+  e.type && e.type.__f && e.ref && (e.props.ref = e.ref, e.ref = null), ge && ge(e);
+};
+var It = typeof Symbol < "u" && Symbol.for && Symbol.for("react.forward_ref") || 3911;
+function zt(e) {
+  function t(r) {
+    if (!("ref" in r)) return e(r, null);
+    var n = r.ref;
+    delete r.ref;
+    var o = e(r, n);
+    return r.ref = n, o;
+  }
+  return t.$$typeof = It, t.render = t, t.prototype.isReactComponent = t.__f = !0, t.displayName = "ForwardRef(" + (e.displayName || e.name) + ")", t;
+}
+var me = function(e, t) {
+  return e == null ? null : j(j(e).map(t));
+}, Mt = { map: me, forEach: me, count: function(e) {
+  return e ? j(e).length : 0;
+}, only: function(e) {
+  var t = j(e);
+  if (t.length !== 1) throw "Children.only";
+  return t[0];
+}, toArray: j }, Wt = b.__e;
+b.__e = function(e, t, r, n) {
+  if (e.then) {
+    for (var o, i = t; i = i.__; ) if ((o = i.__c) && o.__c) return t.__e == null && (t.__e = r.__e, t.__k = r.__k), o.__c(e, t);
+  }
+  Wt(e, t, r, n);
+};
+var ve = b.unmount;
+function Ie(e, t, r) {
+  return e && (e.__c && e.__c.__H && (e.__c.__H.__.forEach(function(n) {
+    typeof n.__c == "function" && n.__c();
+  }), e.__c.__H = null), (e = (function(n, o) {
+    for (var i in o) n[i] = o[i];
+    return n;
+  })({}, e)).__c != null && (e.__c.__P === r && (e.__c.__P = t), e.__c = null), e.__k = e.__k && e.__k.map(function(n) {
+    return Ie(n, t, r);
+  })), e;
+}
+function ze(e, t, r) {
+  return e && r && (e.__v = null, e.__k = e.__k && e.__k.map(function(n) {
+    return ze(n, t, r);
+  }), e.__c && e.__c.__P === t && (e.__e && r.appendChild(e.__e), e.__c.__e = !0, e.__c.__P = r)), e;
+}
+function U() {
+  this.__u = 0, this.t = null, this.__b = null;
+}
+function Me(e) {
+  var t = e.__.__c;
+  return t && t.__a && t.__a(e);
+}
+function Vt(e) {
+  var t, r, n;
+  function o(i) {
+    if (t || (t = e()).then(function(a) {
+      r = a.default || a;
+    }, function(a) {
+      n = a;
+    }), n) throw n;
+    if (!r) throw t;
+    return R(r, i);
+  }
+  return o.displayName = "Lazy", o.__f = !0, o;
+}
+function I() {
+  this.u = null, this.o = null;
+}
+b.unmount = function(e) {
+  var t = e.__c;
+  t && t.__R && t.__R(), t && 32 & e.__u && (e.type = null), ve && ve(e);
+}, (U.prototype = new B()).__c = function(e, t) {
+  var r = t.__c, n = this;
+  n.t == null && (n.t = []), n.t.push(r);
+  var o = Me(n.__v), i = !1, a = function() {
+    i || (i = !0, r.__R = null, o ? o(l) : l());
+  };
+  r.__R = a;
+  var l = function() {
+    if (!--n.__u) {
+      if (n.state.__a) {
+        var c = n.state.__a;
+        n.__v.__k[0] = ze(c, c.__c.__P, c.__c.__O);
+      }
+      var f;
+      for (n.setState({ __a: n.__b = null }); f = n.t.pop(); ) f.forceUpdate();
+    }
+  };
+  n.__u++ || 32 & t.__u || n.setState({ __a: n.__b = n.__v.__k[0] }), e.then(a, a);
+}, U.prototype.componentWillUnmount = function() {
+  this.t = [];
+}, U.prototype.render = function(e, t) {
+  if (this.__b) {
+    if (this.__v.__k) {
+      var r = document.createElement("div"), n = this.__v.__k[0].__c;
+      this.__v.__k[0] = Ie(this.__b, r, n.__O = n.__P);
+    }
+    this.__b = null;
+  }
+  var o = t.__a && R(z, null, e.fallback);
+  return o && (o.__u &= -33), [R(z, null, t.__a ? null : e.children), o];
+};
+var be = function(e, t, r) {
+  if (++r[1] === r[0] && e.o.delete(t), e.props.revealOrder && (e.props.revealOrder[0] !== "t" || !e.o.size)) for (r = e.u; r; ) {
+    for (; r.length > 3; ) r.pop()();
+    if (r[1] < r[0]) break;
+    e.u = r = r[2];
+  }
+};
+function Ut(e) {
+  return this.getChildContext = function() {
+    return e.context;
+  }, e.children;
+}
+function Jt(e) {
+  var t = this, r = e.i;
+  t.componentWillUnmount = function() {
+    T(null, t.l), t.l = null, t.i = null;
+  }, t.i && t.i !== r && t.componentWillUnmount(), t.l || (t.i = r, t.l = { nodeType: 1, parentNode: r, childNodes: [], contains: function() {
+    return !0;
+  }, appendChild: function(n) {
+    this.childNodes.push(n), t.i.appendChild(n);
+  }, insertBefore: function(n, o) {
+    this.childNodes.push(n), t.i.appendChild(n);
+  }, removeChild: function(n) {
+    this.childNodes.splice(this.childNodes.indexOf(n) >>> 1, 1), t.i.removeChild(n);
+  } }), T(R(Ut, { context: t.context }, e.__v), t.l);
+}
+function Ht(e, t) {
+  var r = R(Jt, { __v: e, i: t });
+  return r.containerInfo = t, r;
+}
+(I.prototype = new B()).__a = function(e) {
+  var t = this, r = Me(t.__v), n = t.o.get(e);
+  return n[0]++, function(o) {
+    var i = function() {
+      t.props.revealOrder ? (n.push(o), be(t, e, n)) : o();
+    };
+    r ? r(i) : i();
+  };
+}, I.prototype.render = function(e) {
+  this.u = null, this.o = /* @__PURE__ */ new Map();
+  var t = j(e.children);
+  e.revealOrder && e.revealOrder[0] === "b" && t.reverse();
+  for (var r = t.length; r--; ) this.o.set(t[r], this.u = [1, 0, this.u]);
+  return e.children;
+}, I.prototype.componentDidUpdate = I.prototype.componentDidMount = function() {
+  var e = this;
+  this.o.forEach(function(t, r) {
+    be(e, r, t);
+  });
+};
+var We = typeof Symbol < "u" && Symbol.for && Symbol.for("react.element") || 60103, Kt = /^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image(!S)|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/, Xt = /^on(Ani|Tra|Tou|BeforeInp|Compo)/, Qt = /[A-Z0-9]/g, Zt = typeof document < "u", Gt = function(e) {
+  return (typeof Symbol < "u" && typeof Symbol() == "symbol" ? /fil|che|rad/ : /fil|che|ra/).test(e);
+};
+function qt(e, t, r) {
+  return t.__k == null && (t.textContent = ""), T(e, t), typeof r == "function" && r(), e ? e.__c : null;
+}
+function Yt(e, t, r) {
+  return nt(e, t), typeof r == "function" && r(), e ? e.__c : null;
+}
+B.prototype.isReactComponent = {}, ["componentWillMount", "componentWillReceiveProps", "componentWillUpdate"].forEach(function(e) {
+  Object.defineProperty(B.prototype, e, { configurable: !0, get: function() {
+    return this["UNSAFE_" + e];
+  }, set: function(t) {
+    Object.defineProperty(this, e, { configurable: !0, writable: !0, value: t });
+  } });
+});
+var we = b.event;
+function $t() {
+}
+function er() {
+  return this.cancelBubble;
+}
+function tr() {
+  return this.defaultPrevented;
+}
+b.event = function(e) {
+  return we && (e = we(e)), e.persist = $t, e.isPropagationStopped = er, e.isDefaultPrevented = tr, e.nativeEvent = e;
+};
+var ue, rr = { enumerable: !1, configurable: !0, get: function() {
+  return this.class;
+} }, ye = b.vnode;
+b.vnode = function(e) {
+  typeof e.type == "string" && (function(t) {
+    var r = t.props, n = t.type, o = {}, i = n.indexOf("-") === -1;
+    for (var a in r) {
+      var l = r[a];
+      if (!(a === "value" && "defaultValue" in r && l == null || Zt && a === "children" && n === "noscript" || a === "class" || a === "className")) {
+        var c = a.toLowerCase();
+        a === "defaultValue" && "value" in r && r.value == null ? a = "value" : a === "download" && l === !0 ? l = "" : c === "translate" && l === "no" ? l = !1 : c[0] === "o" && c[1] === "n" ? c === "ondoubleclick" ? a = "ondblclick" : c !== "onchange" || n !== "input" && n !== "textarea" || Gt(r.type) ? c === "onfocus" ? a = "onfocusin" : c === "onblur" ? a = "onfocusout" : Xt.test(a) && (a = c) : c = a = "oninput" : i && Kt.test(a) ? a = a.replace(Qt, "-$&").toLowerCase() : l === null && (l = void 0), c === "oninput" && o[a = c] && (a = "oninputCapture"), o[a] = l;
+      }
+    }
+    n == "select" && o.multiple && Array.isArray(o.value) && (o.value = j(r.children).forEach(function(f) {
+      f.props.selected = o.value.indexOf(f.props.value) != -1;
+    })), n == "select" && o.defaultValue != null && (o.value = j(r.children).forEach(function(f) {
+      f.props.selected = o.multiple ? o.defaultValue.indexOf(f.props.value) != -1 : o.defaultValue == f.props.value;
+    })), r.class && !r.className ? (o.class = r.class, Object.defineProperty(o, "className", rr)) : (r.className && !r.class || r.class && r.className) && (o.class = o.className = r.className), t.props = o;
+  })(e), e.$$typeof = We, ye && ye(e);
+};
+var xe = b.__r;
+b.__r = function(e) {
+  xe && xe(e), ue = e.__c;
+};
+var ke = b.diffed;
+b.diffed = function(e) {
+  ke && ke(e);
+  var t = e.props, r = e.__e;
+  r != null && e.type === "textarea" && "value" in t && t.value !== r.value && (r.value = t.value == null ? "" : t.value), ue = null;
+};
+var nr = { ReactCurrentDispatcher: { current: { readContext: function(e) {
+  return ue.__n[e.__c].props.value;
+}, useCallback: C, useContext: ae, useDebugValue: Re, useDeferredValue: Ue, useEffect: L, useId: je, useImperativeHandle: Oe, useInsertionEffect: He, useLayoutEffect: Z, useMemo: Ae, useReducer: Ne, useRef: Se, useState: y, useSyncExternalStore: Ke, useTransition: Je } } };
+function or(e) {
+  return R.bind(null, e);
+}
+function q(e) {
+  return !!e && e.$$typeof === We;
+}
+function ir(e) {
+  return q(e) && e.type === z;
+}
+function ar(e) {
+  return !!e && !!e.displayName && (typeof e.displayName == "string" || e.displayName instanceof String) && e.displayName.startsWith("Memo(");
+}
+function sr(e) {
+  return q(e) ? rt.apply(null, arguments) : e;
+}
+function lr(e) {
+  return !!e.__k && (T(null, e), !0);
+}
+function cr(e) {
+  return e && (e.base || e.nodeType === 1 && e) || null;
+}
+var ur = function(e, t) {
+  return e(t);
+}, dr = function(e, t) {
+  return e(t);
+}, pr = z;
+function Ve(e) {
+  e();
+}
+function Ue(e) {
+  return e;
+}
+function Je() {
+  return [!1, Ve];
+}
+var He = Z, fr = q;
+function Ke(e, t) {
+  var r = t(), n = y({ h: { __: r, v: t } }), o = n[0].h, i = n[1];
+  return Z(function() {
+    o.__ = r, o.v = t, $(o) && i({ h: o });
+  }, [e, r, t]), L(function() {
+    return $(o) && i({ h: o }), e(function() {
+      $(o) && i({ h: o });
+    });
+  }, [e]), r;
+}
+function $(e) {
+  var t, r, n = e.v, o = e.__;
+  try {
+    var i = n();
+    return !((t = o) === (r = i) && (t !== 0 || 1 / t == 1 / r) || t != t && r != r);
+  } catch {
+    return !0;
+  }
+}
+var P = { useState: y, useId: je, useReducer: Ne, useEffect: L, useLayoutEffect: Z, useInsertionEffect: He, useTransition: Je, useDeferredValue: Ue, useSyncExternalStore: Ke, startTransition: Ve, useRef: Se, useImperativeHandle: Oe, useMemo: Ae, useCallback: C, useContext: ae, useDebugValue: Re, version: "18.3.1", Children: Mt, render: qt, hydrate: Yt, unmountComponentAtNode: lr, createPortal: Ht, createElement: R, createContext: Pe, createFactory: or, cloneElement: sr, createRef: tt, Fragment: z, isValidElement: q, isElement: fr, isFragment: ir, isMemo: ar, findDOMNode: cr, Component: B, PureComponent: ie, memo: Dt, forwardRef: zt, flushSync: dr, unstable_batchedUpdates: ur, StrictMode: pr, Suspense: U, SuspenseList: I, lazy: Vt, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: nr }, Xe = {
+  color: void 0,
+  size: void 0,
+  className: void 0,
+  style: void 0,
+  attr: void 0
+}, Ce = P.createContext && /* @__PURE__ */ P.createContext(Xe), hr = ["attr", "size", "title"];
+function gr(e, t) {
+  if (e == null) return {};
+  var r = mr(e, t), n, o;
+  if (Object.getOwnPropertySymbols) {
+    var i = Object.getOwnPropertySymbols(e);
+    for (o = 0; o < i.length; o++)
+      n = i[o], !(t.indexOf(n) >= 0) && Object.prototype.propertyIsEnumerable.call(e, n) && (r[n] = e[n]);
+  }
+  return r;
+}
+function mr(e, t) {
+  if (e == null) return {};
+  var r = {};
+  for (var n in e)
+    if (Object.prototype.hasOwnProperty.call(e, n)) {
+      if (t.indexOf(n) >= 0) continue;
+      r[n] = e[n];
+    }
+  return r;
+}
+function X() {
+  return X = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var r = arguments[t];
+      for (var n in r)
+        Object.prototype.hasOwnProperty.call(r, n) && (e[n] = r[n]);
+    }
+    return e;
+  }, X.apply(this, arguments);
+}
+function _e(e, t) {
+  var r = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var n = Object.getOwnPropertySymbols(e);
+    t && (n = n.filter(function(o) {
+      return Object.getOwnPropertyDescriptor(e, o).enumerable;
+    })), r.push.apply(r, n);
+  }
+  return r;
+}
+function Q(e) {
+  for (var t = 1; t < arguments.length; t++) {
+    var r = arguments[t] != null ? arguments[t] : {};
+    t % 2 ? _e(Object(r), !0).forEach(function(n) {
+      vr(e, n, r[n]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : _e(Object(r)).forEach(function(n) {
+      Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
+    });
+  }
+  return e;
+}
+function vr(e, t, r) {
+  return t = br(t), t in e ? Object.defineProperty(e, t, { value: r, enumerable: !0, configurable: !0, writable: !0 }) : e[t] = r, e;
+}
+function br(e) {
+  var t = wr(e, "string");
+  return typeof t == "symbol" ? t : t + "";
+}
+function wr(e, t) {
+  if (typeof e != "object" || !e) return e;
+  var r = e[Symbol.toPrimitive];
+  if (r !== void 0) {
+    var n = r.call(e, t);
+    if (typeof n != "object") return n;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (t === "string" ? String : Number)(e);
+}
+function Qe(e) {
+  return e && e.map((t, r) => /* @__PURE__ */ P.createElement(t.tag, Q({
+    key: r
+  }, t.attr), Qe(t.child)));
+}
+function yr(e) {
+  return (t) => /* @__PURE__ */ P.createElement(xr, X({
+    attr: Q({}, e.attr)
+  }, t), Qe(e.child));
+}
+function xr(e) {
+  var t = (r) => {
+    var {
+      attr: n,
+      size: o,
+      title: i
+    } = e, a = gr(e, hr), l = o || r.size || "1em", c;
+    return r.className && (c = r.className), e.className && (c = (c ? c + " " : "") + e.className), /* @__PURE__ */ P.createElement("svg", X({
+      stroke: "currentColor",
+      fill: "currentColor",
+      strokeWidth: "0"
+    }, r.attr, n, a, {
+      className: c,
+      style: Q(Q({
+        color: e.color || r.color
+      }, r.style), e.style),
+      height: l,
+      width: l,
+      xmlns: "http://www.w3.org/2000/svg"
+    }), i && /* @__PURE__ */ P.createElement("title", null, i), e.children);
+  };
+  return Ce !== void 0 ? /* @__PURE__ */ P.createElement(Ce.Consumer, null, (r) => t(r)) : t(Xe);
+}
+function kr(e) {
+  return yr({ attr: { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "circle", attr: { cx: "12", cy: "12", r: "10" }, child: [] }, { tag: "path", attr: { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }, child: [] }, { tag: "path", attr: { d: "M12 17h.01" }, child: [] }] })(e);
+}
+const de = ({
+  variant: e,
+  children: t
+}) => /* @__PURE__ */ d("div", { className: "group relative", children: [
+  /* @__PURE__ */ s("div", { className: "cursor-pointer rounded-md p-1.5 transition-colors hover:bg-neutral-200", children: _(e).with("icon", () => /* @__PURE__ */ s(kr, {})).with("text", () => /* @__PURE__ */ s("div", { children: "Text" })).exhaustive() }),
+  /* @__PURE__ */ s("div", { className: "-translate-x-1/2 absolute top-full left-1/2 z-10 hidden rounded-md bg-neutral-100 p-2 shadow-sm group-hover:block", children: t })
+] }), pe = ({ options: e, value: t, onChange: r }) => /* @__PURE__ */ s("div", { className: "flex divide-x rounded-md border border-gray-300", children: e.map(([n, o]) => /* @__PURE__ */ s(
+  "button",
+  {
+    type: "button",
+    onClick: () => r(n),
+    "aria-pressed": n === t,
+    className: Le(
+      "px-4 py-2 font-semibold text-xs transition first:rounded-l-md last:rounded-r-md",
+      n === t ? "border-blue-500 bg-blue-50 text-blue-600" : "cursor-pointer border-gray-300 text-gray-600 hover:border-gray-400"
+    ),
+    children: o
+  },
+  n
+)) }), Cr = ({ label: e, value: t, onChange: r }) => /* @__PURE__ */ s(
+  pe,
+  {
+    options: [
+      ["true", "Yes"],
+      ["false", "No"]
+    ],
+    value: t ? "true" : "false",
+    onChange: (n) => r(n === "true")
+  }
+), _r = () => {
+  const { settings: e, updateSettings: t } = ce();
+  return /* @__PURE__ */ d("div", { children: [
+    /* @__PURE__ */ d("div", { className: "flex items-end justify-between p-2", children: [
+      /* @__PURE__ */ s("div", { children: "Connection preferences" }),
+      /* @__PURE__ */ s(de, { variant: "icon", children: "Something something very cool" })
+    ] }),
+    /* @__PURE__ */ s("div", { className: "flex flex-col gap-4 rounded-md bg-[#F4F5F6] p-2", children: [
+      [
+        "Retain session history",
+        "retainHistory",
+        e?.retainHistory ?? !1,
+        (r) => t({ retainHistory: r })
+      ],
+      [
+        "Auto reconnect",
+        "autoReconnect",
+        e?.autoReconnect ?? !1,
+        (r) => t({ autoReconnect: r })
+      ]
+    ].map(([r, n, o, i]) => /* @__PURE__ */ d("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ s("div", { className: "font-semibold text-gray-900 text-sm", children: r }),
+      /* @__PURE__ */ s(Cr, { label: r, value: o, onChange: i })
+    ] }, n)) })
+  ] });
+}, Sr = "h-11 w-full rounded-lg border border-gray-300 bg-white px-3 text-sm text-gray-700 focus:border-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-200", Nr = ({
+  // eslint-disable-next-line no-restricted-syntax
+  id: e,
+  value: t,
+  placeholder: r,
+  ariaLabel: n,
+  readOnly: o = !0,
+  onChange: i
+}) => /* @__PURE__ */ s(
+  "input",
+  {
+    id: e,
+    className: Sr,
+    value: t,
+    placeholder: r,
+    "aria-label": n,
+    readOnly: o,
+    onChange: (a) => {
+      a.target instanceof HTMLInputElement && i?.(a.target.value);
+    }
+  }
+), Ar = ["MQTT", "NTFY", "GUN"], Or = () => {
+  const { settings: e, updateSettings: t } = ce(), r = (o) => t({ session: { p: o } }), n = (o) => t({ session: { s: o } });
+  return /* @__PURE__ */ d("div", { children: [
+    /* @__PURE__ */ d("div", { className: "flex items-end justify-between p-2", children: [
+      /* @__PURE__ */ s("div", { children: "Signaling" }),
+      /* @__PURE__ */ s(de, { variant: "icon", children: "Something something very cool" })
+    ] }),
+    /* @__PURE__ */ d("div", { className: "flex flex-col gap-4 rounded-md bg-[#F4F5F6] p-2", children: [
+      /* @__PURE__ */ d("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ s("div", { children: "Protocol" }),
+        /* @__PURE__ */ s(
+          pe,
+          {
+            options: Ar.map((o) => [
+              o.toLowerCase(),
+              o
+            ]),
+            value: e?.session.p || "",
+            onChange: r
+          }
+        )
+      ] }),
+      /* @__PURE__ */ s(
+        Nr,
+        {
+          id: "server",
+          value: e?.session.s || "",
+          onChange: (o) => n(o),
+          placeholder: "Server URL",
+          ariaLabel: "Server URL",
+          readOnly: !1
+        }
+      )
+    ] })
+  ] });
+}, jr = ["WebRTC"], Rr = () => {
+  const [e, t] = y("WebRTC");
+  return /* @__PURE__ */ d("div", { children: [
+    /* @__PURE__ */ d("div", { className: "flex items-end justify-between p-2", children: [
+      /* @__PURE__ */ s("div", { children: "Transport" }),
+      /* @__PURE__ */ s(de, { variant: "icon", children: "Something something very cool" })
+    ] }),
+    /* @__PURE__ */ s("div", { className: "flex flex-col gap-4 rounded-md bg-[#F4F5F6] p-2", children: /* @__PURE__ */ d("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ s("div", { children: "Protocol" }),
+      /* @__PURE__ */ s(
+        pe,
+        {
+          options: jr.map((r) => [r, r]),
+          value: e,
+          onChange: (r) => t(r)
+        }
+      )
+    ] }) })
+  ] });
+}, Pr = ({ onBack: e }) => /* @__PURE__ */ s("div", { className: "text-left", children: /* @__PURE__ */ d("div", { className: "flex flex-col gap-2 px-2", children: [
+  /* @__PURE__ */ s(Or, {}),
+  /* @__PURE__ */ s(Rr, {}),
+  /* @__PURE__ */ s(_r, {})
+] }) }), Lr = () => {
+  const [e, t] = y("start"), [r, n] = y(!1);
+  return L(() => {
+    if (!r) return;
+    const o = window.setTimeout(() => n(!1), 2e3);
+    return () => window.clearTimeout(o);
+  }, [r]), {
+    view: e,
+    setView: t,
+    copied: r,
+    setCopied: n
+  };
+}, Er = (e) => {
+  L(() => {
+    const t = (r) => {
+      r.key === "Escape" && e();
+    };
+    return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
+  }, [e]);
+}, Fr = ({ onClose: e = () => {
+}, onCopy: t }) => {
+  const { view: r, setView: n, copied: o, setCopied: i } = Lr(), { uri: a } = G(), { status: l } = E(), c = "Connect Wallet";
+  Er(e);
+  const f = C(async () => {
+    a && await _t(a) && i(!0);
+  }, [a, i]);
+  return D("view", r), /* @__PURE__ */ s(
+    "div",
+    {
+      className: "fixed inset-0 z-[10000] flex animate-[bg-in_0.15s_ease-in-out] items-center justify-center bg-black/30 p-4 font-sans text-slate-800 backdrop-blur-sm",
+      onClick: e,
+      role: "presentation",
+      "data-openlv-modal-root": !0,
+      children: /* @__PURE__ */ d(
+        "div",
+        {
+          className: "relative w-full max-w-[400px] animate-[fade-in_0.15s_ease-in-out] space-y-2 rounded-2xl bg-white p-2 text-center",
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": c,
+          onClick: (w) => w.stopPropagation(),
+          children: [
+            /* @__PURE__ */ s(
+              Tt,
+              {
+                setView: n,
+                onToggleSettings: () => n(r === "settings" ? "start" : "settings"),
+                title: c,
+                view: r,
+                onClose: e
+              }
+            ),
+            _(l).with(
+              "disconnected",
+              () => _(r).with("start", () => /* @__PURE__ */ s(Rt, {})).with("settings", () => /* @__PURE__ */ s(Pr, { onBack: () => n("start") })).otherwise(() => /* @__PURE__ */ s(K, { state: r }))
+            ).with(le.union("connecting", "connected"), () => /* @__PURE__ */ s(jt, { onClose: e, onCopy: t || f })).otherwise(() => /* @__PURE__ */ s(K, { state: "unknown status" })),
+            /* @__PURE__ */ s(
+              "div",
+              {
+                className: Le(
+                  "absolute top-5 right-5 rounded-lg bg-blue-500 px-4 py-3 font-medium text-sm text-white transition-all",
+                  o ? "translate-x-0 opacity-100" : "translate-x-full opacity-0"
+                ),
+                children: "📋 Connection URL copied to clipboard!"
+              }
+            ),
+            /* @__PURE__ */ s(Et, {})
+          ]
+        }
+      )
+    }
+  );
+}, Jr = (e = "idle") => {
+  const [t, r] = y({
+    state: e
+  }), n = C(
+    (a, l) => {
+      r((c) => ({
+        ...c,
+        state: a,
+        ...l
+      }));
+    },
+    []
+  ), o = C((a) => {
+    r(a);
+  }, []), i = C(() => {
+    r({ state: "idle" });
+  }, []);
+  return {
+    connectionInfo: t,
+    updateState: n,
+    updateConnectionInfo: o,
+    reset: i
+  };
+}, Br = '/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-divide-x-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-blue-50:oklch(97% .014 254.604);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-slate-800:oklch(27.9% .041 260.031);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-900:oklch(21% .034 264.665);--color-neutral-100:oklch(97% 0 0);--color-neutral-200:oklch(92.2% 0 0);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5/2.25);--font-weight-medium:500;--font-weight-semibold:600;--tracking-wide:.025em;--radius-md:.375rem;--radius-lg:.5rem;--radius-2xl:1rem;--animate-spin:spin 1s linear infinite;--blur-sm:8px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing)*0)}.top-5{top:calc(var(--spacing)*5)}.top-full{top:100%}.right-5{right:calc(var(--spacing)*5)}.left-1\\/2{left:50%}.z-10{z-index:10}.z-\\[10000\\]{z-index:10000}.mx-auto{margin-inline:auto}.mt-2{margin-top:calc(var(--spacing)*2)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-8{height:calc(var(--spacing)*8)}.h-11{height:calc(var(--spacing)*11)}.h-\\[200px\\]{height:200px}.w-8{width:calc(var(--spacing)*8)}.w-\\[200px\\]{width:200px}.w-fit{width:fit-content}.w-full{width:100%}.max-w-\\[400px\\]{max-width:400px}.-translate-x-1\\/2{--tw-translate-x: -50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-x-0{--tw-translate-x:calc(var(--spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-x-full{--tw-translate-x:100%;translate:var(--tw-translate-x)var(--tw-translate-y)}.animate-\\[bg-in_0\\.15s_ease-in-out\\]{animation:.15s ease-in-out bg-in}.animate-\\[fade-in_0\\.15s_ease-in-out\\]{animation:.15s ease-in-out fade-in}.animate-spin{animation:var(--animate-spin)}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:calc(var(--spacing)*2)}.gap-4{gap:calc(var(--spacing)*4)}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}:where(.divide-x>:not(:last-child)){--tw-divide-x-reverse:0;border-inline-style:var(--tw-border-style);border-inline-start-width:calc(1px*var(--tw-divide-x-reverse));border-inline-end-width:calc(1px*calc(1 - var(--tw-divide-x-reverse)))}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-4{border-style:var(--tw-border-style);border-width:4px}.border-blue-500{border-color:var(--color-blue-500)}.border-gray-200{border-color:var(--color-gray-200)}.border-gray-300{border-color:var(--color-gray-300)}.border-neutral-200{border-color:var(--color-neutral-200)}.border-t-transparent{border-top-color:#0000}.bg-\\[\\#F4F5F6\\]{background-color:#f4f5f6}.bg-black\\/30{background-color:#0000004d}@supports (color:color-mix(in lab,red,red)){.bg-black\\/30{background-color:color-mix(in oklab,var(--color-black)30%,transparent)}}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-neutral-100{background-color:var(--color-neutral-100)}.bg-white{background-color:var(--color-white)}.p-1{padding:calc(var(--spacing)*1)}.p-1\\.5{padding:calc(var(--spacing)*1.5)}.p-2{padding:calc(var(--spacing)*2)}.p-4{padding:calc(var(--spacing)*4)}.p-6{padding:calc(var(--spacing)*6)}.px-1{padding-inline:calc(var(--spacing)*1)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.text-center{text-align:center}.text-left{text-align:left}.font-sans{font-family:var(--font-sans)}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-blue-600{color:var(--color-blue-600)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-900{color:var(--color-gray-900)}.text-slate-800{color:var(--color-slate-800)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow,.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-300{--tw-duration:.3s;transition-duration:.3s}@media (hover:hover){.group-hover\\:block:is(:where(.group):hover *){display:block}.group-hover\\:opacity-100:is(:where(.group):hover *){opacity:1}}.first\\:rounded-l-md:first-child{border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.last\\:rounded-r-md:last-child{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}@media (hover:hover){.hover\\:border-gray-400:hover{border-color:var(--color-gray-400)}.hover\\:bg-blue-600:hover{background-color:var(--color-blue-600)}.hover\\:bg-gray-200:hover{background-color:var(--color-gray-200)}.hover\\:bg-gray-300:hover{background-color:var(--color-gray-300)}.hover\\:bg-neutral-200:hover{background-color:var(--color-neutral-200)}}.focus\\:border-blue-500:focus{border-color:var(--color-blue-500)}.focus\\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\\:ring-blue-200:focus{--tw-ring-color:var(--color-blue-200)}.focus\\:outline-none:focus{--tw-outline-style:none;outline-style:none}}@keyframes fade-in{0%{transform:translateY(-2px)scale(.95)}to{transform:translateY(0)scale(1)}}@keyframes bg-in{0%{opacity:0;-webkit-backdrop-filter:blur();backdrop-filter:blur()}to{opacity:1;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}', Tr = async (e) => {
+  if (e) {
+    if (e.querySelector("style[data-openlv-modal]"))
+      return;
+    const r = document.createElement("style");
+    r.setAttribute("data-openlv-modal", "true"), r.textContent = Br, e.appendChild(r);
+  }
+};
+class Ze extends HTMLElement {
+  constructor(r, n) {
+    super();
+    F(this, "onClose");
+    F(this, "provider");
+    F(this, "storage");
+    F(this, "shadow");
+    F(this, "renderRequested", !1);
+    this.provider = r, this.storage = n, this.shadow = this.attachShadow({ mode: "open" }), Tr(this.shadow);
+  }
+  connectedCallback() {
+    this.requestRender();
+  }
+  disconnectedCallback() {
+    T(null, this.shadow);
+  }
+  showModal() {
+    this.style.display = "block";
+  }
+  hideModal() {
+    this.style.display = "none";
+  }
+  requestRender() {
+    this.renderRequested || (this.renderRequested = !0, queueMicrotask(() => {
+      this.renderRequested = !1, this.performRender();
+    }));
+  }
+  performRender() {
+    const r = {
+      onClose: this.onClose ?? (() => this.remove()),
+      provider: this.provider,
+      storage: this.storage
+    };
+    T(ot(St, r), this.shadow);
+  }
+}
+const Dr = (e = "openlv-modal") => {
+  if (typeof window > "u")
+    return e;
+  const t = window.customElements;
+  return t ? (t.get(e) || t.define(
+    e,
+    Ze
+  ), e) : (console.warn(
+    "OpenLV modal: custom elements are not supported in this environment."
+  ), e);
+}, Hr = (e, t) => {
+  const r = document.querySelector("openlv-modal");
+  if (r && r.remove(), !r) {
+    Dr();
+    const n = new Ze(e, t);
+    document.body.appendChild(n), n.showModal(), n.onClose = () => {
+      D("modal closed"), n.remove();
+    };
+  }
+};
+export {
+  Fr as ModalRoot,
+  Pt as OPENLV_ICON_128,
+  Ze as OpenLVModalElement,
+  Ze as default,
+  Dr as registerOpenLVModal,
+  Hr as triggerOpenModal,
+  Jr as useConnectionState
+};
+//# sourceMappingURL=index.js.map