cally 0.4.3 → 0.5.0

package/dist/cally.js

@@ -1,4 +1,4 @@
-class oe {
+class te {
   /**
    * @type {T}
    */
@@ -20,7 +20,7 @@ class oe {
    * @param {T} value
    */
   set current(t) {
-    this.#t != t && (this.#t = t, this.#e.forEach((s) => s(t)));
+    this.#t != t && (this.#t = t, this.#e.forEach((n) => n(t)));
   }
   /**
    * @type {import("hooks").Ref["on"]}
@@ -29,113 +29,113 @@ class oe {
     return this.#e.add(t), () => this.#e.delete(t);
   }
 }
-const Nt = (e) => new oe(e), Q = Symbol.for("atomico.hooks");
-globalThis[Q] = globalThis[Q] || {};
-let N = globalThis[Q];
-const re = Symbol.for("Atomico.suspense"), Pt = Symbol.for("Atomico.effect"), ie = Symbol.for("Atomico.layoutEffect"), Ot = Symbol.for("Atomico.insertionEffect"), O = (e, t, s) => {
-  const { i: n, hooks: o } = N.c, r = o[n] = o[n] || {};
-  return r.value = e(r.value), r.effect = t, r.tag = s, N.c.i++, o[n].value;
-}, ae = (e) => O((t = Nt(e)) => t), U = () => O((e = Nt(N.c.host)) => e), kt = () => N.c.update, ce = (e, t, s = 0) => {
-  let n = {}, o = !1;
-  const r = () => o, i = (l, c) => {
-    for (const h in n) {
-      const a = n[h];
-      a.effect && a.tag === l && (a.value = a.effect(a.value, c));
+const Ct = (e) => new te(e), X = Symbol.for("atomico.hooks");
+globalThis[X] = globalThis[X] || {};
+let N = globalThis[X];
+const ee = Symbol.for("Atomico.suspense"), Pt = Symbol.for("Atomico.effect"), ne = Symbol.for("Atomico.layoutEffect"), Nt = Symbol.for("Atomico.insertionEffect"), k = (e, t, n) => {
+  const { i: s, hooks: o } = N.c, r = o[s] = o[s] || {};
+  return r.value = e(r.value), r.effect = t, r.tag = n, N.c.i++, o[s].value;
+}, se = (e) => k((t = Ct(e)) => t), $ = () => k((e = Ct(N.c.host)) => e), kt = () => N.c.update, oe = (e, t, n = 0) => {
+  let s = {}, o = !1;
+  const r = () => o, c = (i, u) => {
+    for (const d in s) {
+      const l = s[d];
+      l.effect && l.tag === i && (l.value = l.effect(l.value, u));
     }
   };
-  return { load: (l) => {
-    N.c = { host: t, hooks: n, update: e, i: 0, id: s };
-    let c;
+  return { load: (i) => {
+    N.c = { host: t, hooks: s, update: e, i: 0, id: n };
+    let u;
     try {
-      o = !1, c = l();
-    } catch (h) {
-      if (h !== re)
-        throw h;
+      o = !1, u = i();
+    } catch (d) {
+      if (d !== ee)
+        throw d;
       o = !0;
     } finally {
       N.c = null;
     }
-    return c;
-  }, cleanEffects: (l) => (i(Ot, l), () => (i(ie, l), () => {
-    i(Pt, l);
+    return u;
+  }, cleanEffects: (i) => (c(Nt, i), () => (c(ne, i), () => {
+    c(Pt, i);
   })), isSuspense: r };
-}, k = Symbol.for;
-function Mt(e, t) {
-  const s = e.length;
-  if (s !== t.length)
+}, O = Symbol.for;
+function Ot(e, t) {
+  const n = e.length;
+  if (n !== t.length)
     return !1;
-  for (let n = 0; n < s; n++) {
-    let o = e[n], r = t[n];
+  for (let s = 0; s < n; s++) {
+    let o = e[s], r = t[s];
     if (o !== r)
       return !1;
   }
   return !0;
 }
-const S = (e) => typeof e == "function", R = (e) => typeof e == "object", { isArray: ue } = Array, V = (e, t) => (t ? e instanceof HTMLStyleElement : !0) && "hydrate" in (e?.dataset || {});
+const T = (e) => typeof e == "function", R = (e) => typeof e == "object", { isArray: re } = Array, G = (e, t) => (t ? e instanceof HTMLStyleElement : !0) && "hydrate" in (e?.dataset || {});
 function At(e, t) {
-  let s;
-  const n = (o) => {
+  let n;
+  const s = (o) => {
     let { length: r } = o;
-    for (let i = 0; i < r; i++) {
-      const f = o[i];
+    for (let c = 0; c < r; c++) {
+      const f = o[c];
       if (f && Array.isArray(f))
-        n(f);
+        s(f);
       else {
-        const u = typeof f;
-        if (f == null || u === "function" || u === "boolean")
+        const a = typeof f;
+        if (f == null || a === "function" || a === "boolean")
           continue;
-        u === "string" || u === "number" ? (s == null && (s = ""), s += f) : (s != null && (t(s), s = null), t(f));
+        a === "string" || a === "number" ? (n == null && (n = ""), n += f) : (n != null && (t(n), n = null), t(f));
       }
     }
   };
-  n(e), s != null && t(s);
+  s(e), n != null && t(n);
 }
-const Rt = (e, t, s) => (e.addEventListener(t, s), () => e.removeEventListener(t, s));
-class Ft {
+const Rt = (e, t, n) => (e.addEventListener(t, n), () => e.removeEventListener(t, n));
+class Mt {
   /**
    *
    * @param {HTMLElement} target
    * @param {string} message
    * @param {string} value
    */
-  constructor(t, s, n) {
-    this.message = s, this.target = t, this.value = n;
+  constructor(t, n, s) {
+    this.message = n, this.target = t, this.value = s;
   }
 }
-class It extends Ft {
+class Ft extends Mt {
 }
-class le extends Ft {
+class ce extends Mt {
 }
-const Y = "Custom", fe = null, de = { true: 1, "": 1, 1: 1 };
-function he(e, t, s, n, o) {
+const _ = "Custom", ie = null, ae = { true: 1, "": 1, 1: 1 };
+function le(e, t, n, s, o) {
   const {
     type: r,
-    reflect: i,
+    reflect: c,
     event: f,
-    value: u,
-    attr: l = me(t)
-  } = s?.name != Y && R(s) && s != fe ? s : { type: s }, c = r?.name === Y && r.map, h = u != null ? r == Function || !S(u) ? () => u : u : null;
+    value: a,
+    attr: i = ue(t)
+  } = n?.name != _ && R(n) && n != ie ? n : { type: n }, u = r?.name === _ && r.map, d = a != null ? r == Function || !T(a) ? () => a : a : null;
   Object.defineProperty(e, t, {
     configurable: !0,
     /**
      * @this {import("dom").AtomicoThisInternal}
      * @param {any} newValue
      */
-    set(a) {
-      const d = this[t];
-      h && r != Boolean && a == null && (a = h());
-      const { error: y, value: D } = (c ? be : ge)(
+    set(l) {
+      const m = this[t];
+      d && r != Boolean && l == null && (l = d());
+      const { error: p, value: y } = (u ? he : me)(
         r,
-        a
+        l
       );
-      if (y && D != null)
-        throw new It(
+      if (p && y != null)
+        throw new Ft(
           this,
           `The value defined for prop '${t}' must be of type '${r.name}'`,
-          D
+          y
         );
-      d != D && (this._props[t] = D ?? void 0, this.update(), f && xt(this, f), this.updated.then(() => {
-        i && (this._ignoreAttr = l, ye(this, r, l, this[t]), this._ignoreAttr = null);
+      m != y && (this._props[t] = y ?? void 0, this.update(), f && It(this, f), this.updated.then(() => {
+        c && (this._ignoreAttr = i, fe(this, r, i, this[t]), this._ignoreAttr = null);
       }));
     },
     /**
@@ -144,21 +144,21 @@ function he(e, t, s, n, o) {
     get() {
       return this._props[t];
     }
-  }), h && (o[t] = h()), n[l] = { prop: t, type: r };
+  }), d && (o[t] = d()), s[i] = { prop: t, type: r };
 }
-const xt = (e, { type: t, base: s = CustomEvent, ...n }) => e.dispatchEvent(new s(t, n)), me = (e) => e.replace(/([A-Z])/g, "-$1").toLowerCase(), ye = (e, t, s, n) => n == null || t == Boolean && !n ? e.removeAttribute(s) : e.setAttribute(
-  s,
-  t?.name === Y && t?.serialize ? t?.serialize(n) : R(n) ? JSON.stringify(n) : t == Boolean ? "" : n
-), pe = (e, t) => e == Boolean ? !!de[t] : e == Number ? Number(t) : e == String ? t : e == Array || e == Object ? JSON.parse(t) : e.name == Y ? t : (
+const It = (e, { type: t, base: n = CustomEvent, ...s }) => e.dispatchEvent(new n(t, s)), ue = (e) => e.replace(/([A-Z])/g, "-$1").toLowerCase(), fe = (e, t, n, s) => s == null || t == Boolean && !s ? e.removeAttribute(n) : e.setAttribute(
+  n,
+  t?.name === _ && t?.serialize ? t?.serialize(s) : R(s) ? JSON.stringify(s) : t == Boolean ? "" : s
+), de = (e, t) => e == Boolean ? !!ae[t] : e == Number ? Number(t) : e == String ? t : e == Array || e == Object ? JSON.parse(t) : e.name == _ ? t : (
   // TODO: If when defining reflect the prop can also be of type string?
   new e(t)
-), be = ({ map: e }, t) => {
+), he = ({ map: e }, t) => {
   try {
     return { value: e(t), error: !1 };
   } catch {
     return { value: t, error: !0 };
   }
-}, ge = (e, t) => e == null || t == null ? { value: t, error: !1 } : e != String && t === "" ? { value: void 0, error: !1 } : e == Object || e == Array || e == Symbol ? {
+}, me = (e, t) => e == null || t == null ? { value: t, error: !1 } : e != String && t === "" ? { value: void 0, error: !1 } : e == Object || e == Array || e == Symbol ? {
   value: t,
   error: {}.toString.call(t) !== `[object ${e.name}]`
 } : t instanceof e ? {
@@ -168,17 +168,17 @@ const xt = (e, { type: t, base: s = CustomEvent, ...n }) => e.dispatchEvent(new
   value: t,
   error: e == Number ? typeof t != "number" ? !0 : Number.isNaN(t) : e == String ? typeof t != "string" : typeof t != "boolean"
 } : { value: t, error: !0 };
-let De = 0;
-const we = (e) => {
+let ye = 0;
+const pe = (e) => {
   const t = (e?.dataset || {})?.hydrate || "";
-  return t || "c" + De++;
-}, $ = (e, t = HTMLElement) => {
-  const s = {}, n = {}, o = "prototype" in t && t.prototype instanceof Element, r = o ? t : "base" in t ? t.base : HTMLElement, { props: i, styles: f } = o ? e : t;
-  class u extends r {
+  return t || "c" + ye++;
+}, j = (e, t = HTMLElement) => {
+  const n = {}, s = {}, o = "prototype" in t && t.prototype instanceof Element, r = o ? t : "base" in t ? t.base : HTMLElement, { props: c, styles: f } = o ? e : t;
+  class a extends r {
     constructor() {
       super(), this._setup(), this._render = () => e({ ...this._props });
-      for (const c in n)
-        this[c] = n[c];
+      for (const u in s)
+        this[u] = s[u];
     }
     /**
      * @returns {import("core").Sheets[]}
@@ -190,37 +190,37 @@ const we = (e) => {
       if (this._props)
         return;
       this._props = {};
-      let c, h;
+      let u, d;
       this.mounted = new Promise(
-        (m) => this.mount = () => {
-          m(), c != this.parentNode && (h != c ? this.unmounted.then(this.update) : this.update()), c = this.parentNode;
+        (E) => this.mount = () => {
+          E(), u != this.parentNode && (d != u ? this.unmounted.then(this.update) : this.update()), u = this.parentNode;
         }
       ), this.unmounted = new Promise(
-        (m) => this.unmount = () => {
-          m(), (c != this.parentNode || !this.isConnected) && (a.cleanEffects(!0)()(), h = this.parentNode, c = null);
+        (E) => this.unmount = () => {
+          E(), (u != this.parentNode || !this.isConnected) && (l.cleanEffects(!0)()(), d = this.parentNode, u = null);
         }
       ), this.symbolId = this.symbolId || Symbol(), this.symbolIdParent = Symbol();
-      const a = ce(
+      const l = oe(
         () => this.update(),
         this,
-        we(this)
+        pe(this)
       );
-      let d, y = !0;
-      const D = V(this);
-      this.update = () => (d || (d = !0, this.updated = (this.updated || this.mounted).then(() => {
+      let m, p = !0;
+      const y = G(this);
+      this.update = () => (m || (m = !0, this.updated = (this.updated || this.mounted).then(() => {
         try {
-          const m = a.load(this._render), w = a.cleanEffects();
-          return m && //@ts-ignore
-          m.render(this, this.symbolId, D), d = !1, y && !a.isSuspense() && (y = !1, !D && Ee(this)), w();
+          const E = l.load(this._render), h = l.cleanEffects();
+          return E && //@ts-ignore
+          E.render(this, this.symbolId, y), m = !1, p && !l.isSuspense() && (p = !1, !y && be(this)), h();
         } finally {
-          d = !1;
+          m = !1;
         }
       }).then(
         /**
          * @param {import("internal/hooks.js").CleanUseEffects} [cleanUseEffect]
          */
-        (m) => {
-          m && m();
+        (E) => {
+          E && E();
         }
       )), this.updated), this.update();
     }
@@ -236,74 +236,74 @@ const we = (e) => {
      * @param {(string|null)} oldValue
      * @param {(string|null)} value
      */
-    attributeChangedCallback(c, h, a) {
-      if (s[c]) {
-        if (c === this._ignoreAttr || h === a)
+    attributeChangedCallback(u, d, l) {
+      if (n[u]) {
+        if (u === this._ignoreAttr || d === l)
           return;
-        const { prop: d, type: y } = s[c];
+        const { prop: m, type: p } = n[u];
         try {
-          this[d] = pe(y, a);
+          this[m] = de(p, l);
         } catch {
-          throw new le(
+          throw new ce(
             this,
-            `The value defined as attr '${c}' cannot be parsed by type '${y.name}'`,
-            a
+            `The value defined as attr '${u}' cannot be parsed by type '${p.name}'`,
+            l
           );
         }
       } else
-        super.attributeChangedCallback(c, h, a);
+        super.attributeChangedCallback(u, d, l);
     }
     static get props() {
-      return { ...super.props, ...i };
+      return { ...super.props, ...c };
     }
     static get observedAttributes() {
-      const c = super.observedAttributes || [];
-      for (const h in i)
-        he(this.prototype, h, i[h], s, n);
-      return Object.keys(s).concat(c);
+      const u = super.observedAttributes || [];
+      for (const d in c)
+        le(this.prototype, d, c[d], n, s);
+      return Object.keys(n).concat(u);
     }
   }
-  return u;
+  return a;
 };
-function Ee(e) {
-  const { styles: t } = e.constructor, { shadowRoot: s } = e;
-  if (s && t.length) {
-    const n = [];
+function be(e) {
+  const { styles: t } = e.constructor, { shadowRoot: n } = e;
+  if (n && t.length) {
+    const s = [];
     At(t, (o) => {
-      o && (o instanceof Element ? s.appendChild(o.cloneNode(!0)) : n.push(o));
-    }), n.length && (s.adoptedStyleSheets = n);
+      o && (o instanceof Element ? n.appendChild(o.cloneNode(!0)) : s.push(o));
+    }), s.length && (n.adoptedStyleSheets = s);
   }
 }
-const Ut = (e) => (t, s) => {
-  O(
+const Ut = (e) => (t, n) => {
+  k(
     /**
      * Clean the effect hook
      * @type {import("internal/hooks.js").CollectorEffect}
      */
-    ([n, o] = []) => ((o || !o) && (o && Mt(o, s) ? n = n || !0 : (S(n) && n(), n = null)), [n, s]),
+    ([s, o] = []) => ((o || !o) && (o && Ot(o, n) ? s = s || !0 : (T(s) && s(), s = null)), [s, n]),
     /**
      * @returns {any}
      */
-    ([n, o], r) => r ? (S(n) && n(), []) : [n || t(), o],
+    ([s, o], r) => r ? (T(s) && s(), []) : [s || t(), o],
     e
   );
-}, j = Ut(Pt), Se = Ut(Ot);
-class _t extends Array {
+}, nt = Ut(Pt), ge = Ut(Nt);
+class $t extends Array {
   /**
    *
    * @param {any} initialState
    * @param {(nextState: any, state:any[], mount: boolean )=>void} mapState
    */
-  constructor(t, s) {
-    let n = !0;
+  constructor(t, n) {
+    let s = !0;
     const o = (r) => {
       try {
-        s(r, this, n);
+        n(r, this, s);
       } finally {
-        n = !1;
+        s = !1;
       }
     };
-    super(void 0, o, s), o(t);
+    super(void 0, o, n), o(t);
   }
   /**
    * The following code allows a mutable approach to useState
@@ -318,45 +318,45 @@ class _t extends Array {
   //     this[2](nextState, this);
   // }
 }
-const it = (e) => {
+const st = (e) => {
   const t = kt();
-  return O(
-    (s = new _t(e, (n, o, r) => {
-      n = S(n) ? n(o[0]) : n, n !== o[0] && (o[0] = n, r || t());
-    })) => s
+  return k(
+    (n = new $t(e, (s, o, r) => {
+      s = T(s) ? s(o[0]) : s, s !== o[0] && (o[0] = s, r || t());
+    })) => n
   );
 }, P = (e, t) => {
-  const [s] = O(([n, o, r = 0] = []) => ((!o || o && !Mt(o, t)) && (n = e()), [n, t, r]));
-  return s;
+  const [n] = k(([s, o, r = 0] = []) => ((!o || o && !Ot(o, t)) && (s = e()), [s, t, r]));
+  return n;
 }, Lt = (e) => {
-  const { current: t } = U();
+  const { current: t } = $();
   if (!(e in t))
-    throw new It(
+    throw new Ft(
       t,
       `For useProp("${e}"), the prop does not exist on the host.`,
       e
     );
-  return O(
-    (s = new _t(t[e], (n, o) => {
-      n = S(n) ? n(t[e]) : n, t[e] = n;
-    })) => (s[0] = t[e], s)
+  return k(
+    (n = new $t(t[e], (s, o) => {
+      s = T(s) ? s(t[e]) : s, t[e] = s;
+    })) => (n[0] = t[e], n)
   );
-}, v = (e, t = {}) => {
-  const s = U();
-  return s[e] || (s[e] = (n = t.detail) => xt(s.current, {
+}, C = (e, t = {}) => {
+  const n = $();
+  return n[e] || (n[e] = (s = t.detail) => It(n.current, {
     type: e,
     ...t,
-    detail: n
-  })), s[e];
-}, tt = k("atomico/options");
-globalThis[tt] = globalThis[tt] || {
+    detail: s
+  })), n[e];
+}, Q = O("atomico/options");
+globalThis[Q] = globalThis[Q] || {
   sheet: !!document.adoptedStyleSheets
 };
-const Yt = globalThis[tt], ve = {
+const _t = globalThis[Q], Ee = {
   checked: 1,
   value: 1,
   selected: 1
-}, Te = {
+}, De = {
   list: 1,
   type: 1,
   size: 1,
@@ -366,24 +366,24 @@ const Yt = globalThis[tt], ve = {
   src: 1,
   href: 1,
   slot: 1
-}, Ce = {
+}, Se = {
   shadowDom: 1,
   staticNode: 1,
   cloneNode: 1,
   children: 1,
   key: 1
-}, L = {}, et = [];
-class nt extends Text {
+}, L = {}, V = [];
+class tt extends Text {
 }
-const Ne = k("atomico/id"), F = k("atomico/type"), J = k("atomico/ref"), $t = k("atomico/vnode"), Pe = () => {
+const we = O("atomico/id"), M = O("atomico/type"), H = O("atomico/ref"), jt = O("atomico/vnode"), ve = () => {
 };
-function Oe(e, t, s) {
-  return qt(this, e, t, s);
+function Te(e, t, n) {
+  return xt(this, e, t, n);
 }
-const jt = (e, t, ...s) => {
-  const n = t || L;
-  let { children: o } = n;
-  if (o = o ?? (s.length ? s : et), e === Pe)
+const Yt = (e, t, ...n) => {
+  const s = t || L;
+  let { children: o } = s;
+  if (o = o ?? (n.length ? n : V), e === ve)
     return o;
   const r = e ? e instanceof Node ? 1 : (
     //@ts-ignore
@@ -391,170 +391,170 @@ const jt = (e, t, ...s) => {
   ) : 0;
   if (r === !1 && e instanceof Function)
     return e(
-      o != et ? { children: o, ...n } : n
+      o != V ? { children: o, ...s } : s
     );
-  const i = Yt.render || Oe;
+  const c = _t.render || Te;
   return {
-    [F]: $t,
+    [M]: jt,
     type: e,
-    props: n,
+    props: s,
     children: o,
-    key: n.key,
+    key: s.key,
     // key for lists by keys
     // define if the node declares its shadowDom
-    shadow: n.shadowDom,
+    shadow: s.shadowDom,
     // allows renderings to run only once
-    static: n.staticNode,
+    static: s.staticNode,
     // defines whether the type is a childNode `1` or a constructor `2`
     raw: r,
     // defines whether to use the second parameter for document.createElement
-    is: n.is,
+    is: s.is,
     // clone the node if it comes from a reference
-    clone: n.cloneNode,
-    render: i
+    clone: s.cloneNode,
+    render: c
   };
 };
-function qt(e, t, s = Ne, n, o) {
+function xt(e, t, n = we, s, o) {
   let r;
-  if (t && t[s] && t[s].vnode == e || e[F] != $t)
+  if (t && t[n] && t[n].vnode == e || e[M] != jt)
     return t;
-  (e || !t) && (o = o || e.type == "svg", r = e.type != "host" && (e.raw == 1 ? (t && e.clone ? t[J] : t) != e.type : e.raw == 2 ? !(t instanceof e.type) : t ? t[J] || t.localName != e.type : !t), r && e.type != null && (e.raw == 1 && e.clone ? (n = !0, t = e.type.cloneNode(!0), t[J] = e.type) : t = e.raw == 1 ? e.type : e.raw == 2 ? new e.type() : o ? document.createElementNS(
+  (e || !t) && (o = o || e.type == "svg", r = e.type != "host" && (e.raw == 1 ? (t && e.clone ? t[H] : t) != e.type : e.raw == 2 ? !(t instanceof e.type) : t ? t[H] || t.localName != e.type : !t), r && e.type != null && (e.raw == 1 && e.clone ? (s = !0, t = e.type.cloneNode(!0), t[H] = e.type) : t = e.raw == 1 ? e.type : e.raw == 2 ? new e.type() : o ? document.createElementNS(
     "http://www.w3.org/2000/svg",
     e.type
   ) : document.createElement(
     e.type,
     e.is ? { is: e.is } : void 0
   )));
-  const i = t[s] ? t[s] : L, { vnode: f = L, cycle: u = 0 } = i;
-  let { fragment: l, handlers: c } = i;
-  const { children: h = et, props: a = L } = f;
-  if (c = r ? {} : c || {}, e.static && !r)
+  const c = t[n] ? t[n] : L, { vnode: f = L, cycle: a = 0 } = c;
+  let { fragment: i, handlers: u } = c;
+  const { children: d = V, props: l = L } = f;
+  if (u = r ? {} : u || {}, e.static && !r)
     return t;
   if (e.shadow && !t.shadowRoot && // @ts-ignore
-  t.attachShadow({ mode: "open", ...e.shadow }), e.props != a && Ae(t, a, e.props, c, o), e.children !== h) {
-    const d = e.shadow ? t.shadowRoot : t;
-    l = Me(
+  t.attachShadow({ mode: "open", ...e.shadow }), e.props != l && Ne(t, l, e.props, u, o), e.children !== d) {
+    const m = e.shadow ? t.shadowRoot : t;
+    i = Pe(
       e.children,
       /**
        * @todo for hydration use attribute and send childNodes
        */
-      l,
-      d,
-      s,
+      i,
+      m,
+      n,
       // add support to foreignObject, children will escape from svg
-      !u && n,
+      !a && s,
       o && e.type == "foreignObject" ? !1 : o
     );
   }
-  return t[s] = { vnode: e, handlers: c, fragment: l, cycle: u + 1 }, t;
+  return t[n] = { vnode: e, handlers: u, fragment: i, cycle: a + 1 }, t;
 }
-function ke(e, t) {
-  const s = new nt(""), n = new nt("");
+function Ce(e, t) {
+  const n = new tt(""), s = new tt("");
   let o;
-  if (e[t ? "prepend" : "append"](s), t) {
+  if (e[t ? "prepend" : "append"](n), t) {
     let { lastElementChild: r } = e;
     for (; r; ) {
-      const { previousElementSibling: i } = r;
-      if (V(r, !0) && !V(i, !0)) {
+      const { previousElementSibling: c } = r;
+      if (G(r, !0) && !G(c, !0)) {
         o = r;
         break;
       }
-      r = i;
+      r = c;
     }
   }
-  return o ? o.before(n) : e.append(n), {
-    markStart: s,
-    markEnd: n
+  return o ? o.before(s) : e.append(s), {
+    markStart: n,
+    markEnd: s
   };
 }
-function Me(e, t, s, n, o, r) {
-  e = e == null ? null : ue(e) ? e : [e];
-  const i = t || ke(s, o), { markStart: f, markEnd: u, keyes: l } = i;
-  let c;
-  const h = l && /* @__PURE__ */ new Set();
-  let a = f;
-  if (e && At(e, (d) => {
-    if (typeof d == "object" && !d[F])
+function Pe(e, t, n, s, o, r) {
+  e = e == null ? null : re(e) ? e : [e];
+  const c = t || Ce(n, o), { markStart: f, markEnd: a, keyes: i } = c;
+  let u;
+  const d = i && /* @__PURE__ */ new Set();
+  let l = f;
+  if (e && At(e, (m) => {
+    if (typeof m == "object" && !m[M])
       return;
-    const y = d[F] && d.key, D = l && y != null && l.get(y);
-    a != u && a === D ? h.delete(a) : a = a == u ? u : a.nextSibling;
-    const m = l ? D : a;
-    let w = m;
-    if (d[F])
-      w = qt(d, m, n, o, r);
+    const p = m[M] && m.key, y = i && p != null && i.get(p);
+    l != a && l === y ? d.delete(l) : l = l == a ? a : l.nextSibling;
+    const E = i ? y : l;
+    let h = E;
+    if (m[M])
+      h = xt(m, E, s, o, r);
     else {
-      const M = d + "";
-      !(w instanceof Text) || w instanceof nt ? w = new Text(M) : w.data != M && (w.data = M);
+      const v = m + "";
+      !(h instanceof Text) || h instanceof tt ? h = new Text(v) : h.data != v && (h.data = v);
     }
-    w != a && (l && h.delete(w), !m || l ? (s.insertBefore(w, a), l && a != u && h.add(a)) : m == u ? s.insertBefore(w, u) : (s.replaceChild(w, m), a = w)), y != null && (c = c || /* @__PURE__ */ new Map(), c.set(y, w));
-  }), a = a == u ? u : a.nextSibling, t && a != u)
-    for (; a != u; ) {
-      const d = a;
-      a = a.nextSibling, d.remove();
+    h != l && (i && d.delete(h), !E || i ? (n.insertBefore(h, l), i && l != a && d.add(l)) : E == a ? n.insertBefore(h, a) : (n.replaceChild(h, E), l = h)), p != null && (u = u || /* @__PURE__ */ new Map(), u.set(p, h));
+  }), l = l == a ? a : l.nextSibling, t && l != a)
+    for (; l != a; ) {
+      const m = l;
+      l = l.nextSibling, m.remove();
     }
-  return h && h.forEach((d) => d.remove()), i.keyes = c, i;
+  return d && d.forEach((m) => m.remove()), c.keyes = u, c;
 }
-function Ae(e, t, s, n, o) {
+function Ne(e, t, n, s, o) {
   for (const r in t)
-    !(r in s) && pt(e, r, t[r], null, o, n);
-  for (const r in s)
-    pt(e, r, t[r], s[r], o, n);
+    !(r in n) && yt(e, r, t[r], null, o, s);
+  for (const r in n)
+    yt(e, r, t[r], n[r], o, s);
 }
-function pt(e, t, s, n, o, r) {
-  if (t = t == "class" && !o ? "className" : t, s = s ?? null, n = n ?? null, t in e && ve[t] && (s = e[t]), !(n === s || Ce[t] || t[0] == "_"))
-    if (t[0] == "o" && t[1] == "n" && (S(n) || S(s)))
-      Re(e, t.slice(2), n, r);
+function yt(e, t, n, s, o, r) {
+  if (t = t == "class" && !o ? "className" : t, n = n ?? null, s = s ?? null, t in e && Ee[t] && (n = e[t]), !(s === n || Se[t] || t[0] == "_"))
+    if (t[0] == "o" && t[1] == "n" && (T(s) || T(n)))
+      ke(e, t.slice(2), s, r);
     else if (t == "ref")
-      n && (S(n) ? n(e) : n.current = e);
+      s && (T(s) ? s(e) : s.current = e);
     else if (t == "style") {
-      const { style: i } = e;
-      s = s || "", n = n || "";
-      const f = R(s), u = R(n);
+      const { style: c } = e;
+      n = n || "", s = s || "";
+      const f = R(n), a = R(s);
       if (f)
-        for (const l in s)
-          if (u)
-            !(l in n) && bt(i, l, null);
+        for (const i in n)
+          if (a)
+            !(i in s) && pt(c, i, null);
           else
             break;
-      if (u)
-        for (const l in n) {
-          const c = n[l];
-          f && s[l] === c || bt(i, l, c);
+      if (a)
+        for (const i in s) {
+          const u = s[i];
+          f && n[i] === u || pt(c, i, u);
         }
       else
-        i.cssText = n;
+        c.cssText = s;
     } else {
-      const i = t[0] == "$" ? t.slice(1) : t;
-      i === t && (!o && !Te[t] && t in e || S(n) || S(s)) ? e[t] = n ?? "" : n == null ? e.removeAttribute(i) : e.setAttribute(
-        i,
-        R(n) ? JSON.stringify(n) : n
+      const c = t[0] == "$" ? t.slice(1) : t;
+      c === t && (!o && !De[t] && t in e || T(s) || T(n)) ? e[t] = s ?? "" : s == null ? e.removeAttribute(c) : e.setAttribute(
+        c,
+        R(s) ? JSON.stringify(s) : s
       );
     }
 }
-function Re(e, t, s, n) {
-  if (n.handleEvent || (n.handleEvent = (o) => n[o.type].call(e, o)), s) {
-    if (!n[t]) {
-      const o = s.capture || s.once || s.passive ? Object.assign({}, s) : null;
-      e.addEventListener(t, n, o);
+function ke(e, t, n, s) {
+  if (s.handleEvent || (s.handleEvent = (o) => s[o.type].call(e, o)), n) {
+    if (!s[t]) {
+      const o = n.capture || n.once || n.passive ? Object.assign({}, n) : null;
+      e.addEventListener(t, s, o);
     }
-    n[t] = s;
+    s[t] = n;
   } else
-    n[t] && (e.removeEventListener(t, n), delete n[t]);
+    s[t] && (e.removeEventListener(t, s), delete s[t]);
 }
-function bt(e, t, s) {
-  let n = "setProperty";
-  s == null && (n = "removeProperty", s = null), ~t.indexOf("-") ? e[n](t, s) : e[t] = s;
+function pt(e, t, n) {
+  let s = "setProperty";
+  n == null && (s = "removeProperty", n = null), ~t.indexOf("-") ? e[s](t, n) : e[t] = n;
 }
-const gt = {};
-function q(e, ...t) {
-  const s = (e.raw || e).reduce(
-    (n, o, r) => n + o + (t[r] || ""),
+const bt = {};
+function Y(e, ...t) {
+  const n = (e.raw || e).reduce(
+    (s, o, r) => s + o + (t[r] || ""),
     ""
   );
-  return gt[s] = gt[s] || Fe(s);
+  return bt[n] = bt[n] || Oe(n);
 }
-function Fe(e) {
-  if (Yt.sheet) {
+function Oe(e) {
+  if (_t.sheet) {
     const t = new CSSStyleSheet();
     return t.replaceSync(e), t;
   } else {
@@ -562,52 +562,52 @@ function Fe(e) {
     return t.textContent = e, t;
   }
 }
-const Ie = jt("host", { style: "display: contents" }), Z = k("atomico/context"), xe = (e, t) => {
-  const s = U();
-  Se(
+const Ae = Yt("host", { style: "display: contents" }), K = O("atomico/context"), Re = (e, t) => {
+  const n = $();
+  ge(
     () => Rt(
-      s.current,
+      n.current,
       "ConnectContext",
       /**
        * @param {CustomEvent<import("context").DetailConnectContext>} event
        */
-      (n) => {
-        e === n.detail.id && (n.stopPropagation(), n.detail.connect(t));
+      (s) => {
+        e === s.detail.id && (s.stopPropagation(), s.detail.connect(t));
       }
     ),
     [e]
   );
-}, Ue = (e) => {
-  const t = v("ConnectContext", {
+}, Me = (e) => {
+  const t = C("ConnectContext", {
     bubbles: !0,
     composed: !0
-  }), s = () => {
+  }), n = () => {
     let r;
     return t({
       id: e,
-      connect(i) {
-        r = i;
+      connect(c) {
+        r = c;
       }
     }), r;
-  }, [n, o] = it(
-    s
+  }, [s, o] = st(
+    n
   );
-  return j(() => {
-    n || (e[Z] || (e[Z] = customElements.whenDefined(
+  return nt(() => {
+    s || (e[K] || (e[K] = customElements.whenDefined(
       new e().localName
-    )), e[Z].then(
-      () => o(s)
+    )), e[K].then(
+      () => o(n)
     ));
-  }, [e]), n;
-}, _e = (e) => {
-  const t = Ue(e), s = kt();
-  return j(() => {
+  }, [e]), s;
+}, Fe = (e) => {
+  const t = Me(e), n = kt();
+  return nt(() => {
     if (t)
-      return Rt(t, "UpdatedValue", s);
+      return Rt(t, "UpdatedValue", n);
   }, [t]), (t || e).value;
-}, Le = (e) => {
-  const t = $(
-    () => (xe(t, U().current), Ie),
+}, Ie = (e) => {
+  const t = j(
+    () => (Re(t, $().current), Ae),
     {
       props: {
         value: {
@@ -619,343 +619,254 @@ const Ie = jt("host", { style: "display: contents" }), Z = k("atomico/context"),
     }
   );
   return t.value = e, t;
-}, p = (e, t, s) => (t == null ? t = { key: s } : t.key = s, jt(e, t)), I = p, zt = q`*,*:before,*:after{box-sizing:border-box}button{padding:0;touch-action:manipulation}`, Bt = q`.vh{position:absolute;transform:scale(0)}`;
-function at() {
-  return g.from(/* @__PURE__ */ new Date());
-}
-function ct(e, t = 0) {
-  const s = e.toDate(), n = s.getUTCDay(), o = (n < t ? 7 : 0) + n - t;
-  return s.setUTCDate(s.getUTCDate() - o), g.from(s);
-}
-function Ht(e, t = 0) {
-  return ct(e, t).add({ days: 6 });
-}
-function ut(e) {
-  return g.from(new Date(Date.UTC(e.year, e.month, 0)));
-}
-function Wt(e, t) {
-  const s = e.toDate(), n = t.toDate();
-  return s < n ? -1 : s > n ? 1 : 0;
-}
-function z(e, t, s) {
-  return t && g.compare(e, t) < 0 ? t : s && g.compare(e, s) > 0 ? s : e;
-}
-function st(e, t, s) {
-  return z(e, t, s) === e;
+}, b = (e, t, n) => (t == null ? t = { key: n } : t.key = n, Yt(e, t)), F = b, Bt = Y`*,*:before,*:after{box-sizing:border-box}button{padding:0;touch-action:manipulation;cursor:pointer;user-select:none}`, zt = Y`.vh{position:absolute;transform:scale(0)}`;
+function ot() {
+  return D.from(/* @__PURE__ */ new Date());
 }
-function Ye(e, t) {
-  const s = { days: 1 }, n = [e];
-  for (; !e.equals(t); )
-    e = e.add(s), n.push(e);
-  return n;
-}
-function $e(e, t) {
-  const s = [];
-  for (let n = 0; n < e.length; n += t)
-    s.push(e.slice(n, n + t));
-  return s;
+function rt(e, t = 0) {
+  const n = w(e), s = n.getUTCDay(), o = (s < t ? 7 : 0) + s - t;
+  return n.setUTCDate(n.getUTCDate() - o), D.from(n);
 }
-function je(e, t = 0) {
-  const s = ct(e.toPlainDate(), t), n = Ht(ut(e), t);
-  return $e(Ye(s, n), 7);
+function qt(e, t = 0) {
+  return rt(e, t).add({ days: 6 });
 }
-const qe = /^(\d{4})-(0[1-9]|1[0-2])-(0[1-9]|[12][0-9]|3[0-1])$/, Kt = "years", Jt = "months", Zt = "days";
-function ze(e) {
-  if (Kt in e)
-    return { years: -e.years };
-  if (Jt in e)
-    return { months: -e.months };
-  if (Zt in e)
-    return { days: -e.days };
-  throw new TypeError();
+function Ht(e) {
+  return D.from(new Date(Date.UTC(e.year, e.month, 0)));
 }
-function Be(e, t) {
-  return g.from(new Date(Date.UTC(e.year, e.month - 1, t)));
+function x(e, t, n) {
+  return t && D.compare(e, t) < 0 ? t : n && D.compare(e, n) > 0 ? n : e;
 }
-function He(e, t) {
-  const s = new g(t, e.month, 1), n = ut(s), o = e.toDate();
-  return o.setUTCFullYear(t), z(g.from(o), s, n);
-}
-function We(e, t) {
-  const s = new g(e.year, t, 1), n = ut(s), o = e.toDate();
-  return o.setUTCMonth(t - 1), z(g.from(o), s, n);
+const Ue = { days: 1 };
+function $e(e, t = 0) {
+  let n = rt(e.toPlainDate(), t);
+  const s = qt(Ht(e), t), o = [];
+  for (; D.compare(n, s) < 0; ) {
+    const r = [];
+    for (let c = 0; c < 7; c++)
+      r.push(n), n = n.add(Ue);
+    o.push(r);
+  }
+  return o;
 }
-function Dt(e, t) {
-  return Zt in t ? Be(e, e.day + t.days) : Jt in t ? We(e, e.month + t.months) : Kt in t ? He(e, e.year + t.years) : e;
+function w(e) {
+  return new Date(Date.UTC(e.year, e.month - 1, e.day ?? 1));
 }
-const X = (e, t) => e.toString().padStart(t, "0");
-class g {
-  constructor(t, s, n) {
-    this.year = t, this.month = s, this.day = n;
+const Le = /^(\d{4})-(0[1-9]|1[0-2])-(0[1-9]|[12][0-9]|3[0-1])$/, J = (e, t) => e.toString().padStart(t, "0");
+class D {
+  constructor(t, n, s) {
+    this.year = t, this.month = n, this.day = s;
   }
+  // this is an incomplete implementation that only handles arithmetic on a single unit at a time.
+  // i didn't want to get into more complex arithmetic since it get tricky fast
+  // this is enough to serve my needs and will still be a drop-in replacement when actual Temporal API lands
   add(t) {
-    return Dt(this, t);
-  }
-  subtract(t) {
-    return Dt(this, ze(t));
+    const n = w(this);
+    if ("days" in t)
+      return n.setUTCDate(this.day + t.days), D.from(n);
+    let { year: s, month: o } = this;
+    "months" in t ? (o = this.month + t.months, n.setUTCMonth(o - 1)) : (s = this.year + t.years, n.setUTCFullYear(s));
+    const r = D.from(w({ year: s, month: o, day: 1 }));
+    return x(D.from(n), r, Ht(r));
   }
   toString() {
-    return `${X(this.year, 4)}-${X(this.month, 2)}-${X(this.day, 2)}`;
-  }
-  toDate() {
-    return new Date(Date.UTC(this.year, this.month - 1, this.day, 0, 0, 0));
+    return `${J(this.year, 4)}-${J(this.month, 2)}-${J(this.day, 2)}`;
   }
   toPlainYearMonth() {
-    return new C(this.year, this.month);
+    return new B(this.year, this.month);
   }
   equals(t) {
-    return this.year === t.year && this.month === t.month && this.day === t.day;
+    return D.compare(this, t) === 0;
   }
-  static compare(t, s) {
-    return Wt(t, s);
+  static compare(t, n) {
+    return t.year < n.year ? -1 : t.year > n.year ? 1 : t.month < n.month ? -1 : t.month > n.month ? 1 : t.day < n.day ? -1 : t.day > n.day ? 1 : 0;
   }
   static from(t) {
-    return typeof t == "string" ? this.fromString(t) : this.fromDate(t);
-  }
-  static fromString(t) {
-    const s = t.match(qe);
-    if (!s)
-      throw new TypeError(t);
-    const [, n, o, r] = s;
-    return new g(
-      parseInt(n, 10),
-      parseInt(o, 10),
-      parseInt(r, 10)
-    );
-  }
-  static fromDate(t) {
-    return new g(
+    if (typeof t == "string") {
+      const n = t.match(Le);
+      if (!n)
+        throw new TypeError(t);
+      const [, s, o, r] = n;
+      return new D(
+        parseInt(s, 10),
+        parseInt(o, 10),
+        parseInt(r, 10)
+      );
+    }
+    return new D(
       t.getUTCFullYear(),
       t.getUTCMonth() + 1,
       t.getUTCDate()
     );
   }
 }
-function wt(e) {
-  return (e.months ?? 0) + (e.years ?? 0) * 12;
-}
-function Et(e, t) {
-  const s = e.toDate();
-  return s.setUTCMonth(s.getUTCMonth() + t), new C(s.getUTCFullYear(), s.getUTCMonth() + 1);
-}
-class C {
-  constructor(t, s) {
-    this.year = t, this.month = s;
+class B {
+  constructor(t, n) {
+    this.year = t, this.month = n;
   }
   add(t) {
-    return Et(this, wt(t));
-  }
-  subtract(t) {
-    return Et(this, -wt(t));
-  }
-  toDate() {
-    return new Date(Date.UTC(this.year, this.month - 1, 1));
+    const n = w(this), s = (t.months ?? 0) + (t.years ?? 0) * 12;
+    return n.setUTCMonth(n.getUTCMonth() + s), new B(n.getUTCFullYear(), n.getUTCMonth() + 1);
   }
   equals(t) {
     return this.year === t.year && this.month === t.month;
   }
   toPlainDate() {
-    return new g(this.year, this.month, 1);
-  }
-  static compare(t, s) {
-    const n = t instanceof g ? t.toPlainYearMonth() : t, o = s instanceof g ? s.toPlainYearMonth() : s;
-    return Wt(n, o);
+    return new D(this.year, this.month, 1);
   }
 }
-function ot(e, t) {
+function et(e, t) {
   if (t)
     try {
       return e.from(t);
     } catch {
     }
 }
-function rt(e) {
-  const [t, s] = Lt(e);
-  return [P(() => ot(g, t), [t]), (r) => s(r.toString())];
+function I(e) {
+  const [t, n] = Lt(e);
+  return [P(() => et(D, t), [t]), (r) => n(r.toString())];
 }
-function Ke(e) {
+function _e(e) {
   if (e) {
-    const [t, s] = e.split("/"), n = ot(g, t), o = ot(g, s);
-    if (n && o)
-      return [n, o];
+    const [t, n] = e.split("/"), s = et(D, t), o = et(D, n);
+    if (s && o)
+      return [s, o];
   }
   return [];
 }
-function Je(e, t) {
-  return `${e}/${t}`;
+function je(e) {
+  const [t, n] = Lt(e);
+  return [P(() => _e(t), [t]), (r) => n(`${r[0]}/${r[1]}`)];
 }
-function Ze(e) {
-  const [t, s] = Lt(e);
-  return [P(() => Ke(t), [t]), (r) => s(Je(r[0], r[1]))];
-}
-function x(e, t) {
+function U(e, t) {
   return P(
     () => new Intl.DateTimeFormat(t, { timeZone: "UTC", ...e }),
     [t, e]
   );
 }
-function St(e, t, s) {
-  const n = x(e, s);
+function gt(e, t, n) {
+  const s = U(e, n);
   return P(() => {
     const o = [], r = /* @__PURE__ */ new Date();
-    for (var i = 0; i < 7; i++) {
+    for (var c = 0; c < 7; c++) {
       const f = (r.getDay() - t + 7) % 7;
-      o[f] = n.format(r), r.setDate(r.getDate() + 1);
+      o[f] = s.format(r), r.setDate(r.getDate() + 1);
     }
     return o;
-  }, [t, n]);
-}
-function Xe(e) {
-  let t = "";
-  for (const s in e)
-    e[s] && (t += ` ${s}`);
-  return t;
+  }, [t, s]);
 }
-const vt = (e) => e.target.matches(":dir(ltr)"), Ge = { month: "long", day: "numeric" }, Qe = { month: "long" }, Ve = { weekday: "narrow" }, tn = { weekday: "long" }, G = { bubbles: !0 };
-function en({ props: e, context: t }) {
-  const { offset: s } = e, { firstDayOfWeek: n, isDateDisallowed: o, min: r, max: i, dateWindow: f, locale: u } = t, l = at(), c = St(tn, n, u), h = St(Ve, n, u), a = x(Ge, u), d = x(Qe, u), { focusedDate: y } = f, D = P(
-    () => f.start.add({ months: s }),
-    [f, s]
-  ), m = P(
-    () => je(D, n),
-    [D, n]
-  ), w = v("focusday", G), M = v("selectday", G), te = v("hoverday", G);
-  function ft(b) {
-    w(z(b, r, i));
+const Et = (e, t, n) => x(e, t, n) === e, Dt = (e) => e.target.matches(":dir(ltr)"), Ye = { month: "long", day: "numeric" }, xe = { month: "long" }, Be = { weekday: "narrow" }, ze = { weekday: "long" }, Z = { bubbles: !0 };
+function qe({ props: e, context: t }) {
+  const { offset: n } = e, {
+    firstDayOfWeek: s,
+    isDateDisallowed: o,
+    min: r,
+    max: c,
+    page: f,
+    locale: a,
+    focusedDate: i
+  } = t, u = ot(), d = gt(ze, s, a), l = gt(Be, s, a), m = U(Ye, a), p = U(xe, a), y = P(
+    () => f.start.add({ months: n }),
+    [f, n]
+  ), E = P(
+    () => $e(y, s),
+    [y, s]
+  ), h = C("focusday", Z), v = C("selectday", Z), z = C("hoverday", Z);
+  function it(g) {
+    h(x(g, r, c));
   }
-  function ee(b) {
-    let E;
-    switch (b.key) {
+  function Xt(g) {
+    let S;
+    switch (g.key) {
       case "ArrowRight":
-        E = y.add({ days: vt(b) ? 1 : -1 });
+        S = i.add({ days: Dt(g) ? 1 : -1 });
         break;
       case "ArrowLeft":
-        E = y.add({ days: vt(b) ? -1 : 1 });
+        S = i.add({ days: Dt(g) ? -1 : 1 });
         break;
       case "ArrowDown":
-        E = y.add({ days: 7 });
+        S = i.add({ days: 7 });
         break;
       case "ArrowUp":
-        E = y.add({ days: -7 });
+        S = i.add({ days: -7 });
         break;
       case "PageUp":
-        E = y.add(b.shiftKey ? { years: -1 } : { months: -1 });
+        S = i.add(g.shiftKey ? { years: -1 } : { months: -1 });
         break;
       case "PageDown":
-        E = y.add(b.shiftKey ? { years: 1 } : { months: 1 });
+        S = i.add(g.shiftKey ? { years: 1 } : { months: 1 });
         break;
       case "Home":
-        E = ct(y, n);
+        S = rt(i, s);
         break;
       case "End":
-        E = Ht(y, n);
+        S = qt(i, s);
         break;
       default:
         return;
     }
-    ft(E), b.preventDefault();
+    it(S), g.preventDefault();
   }
-  function ne(b) {
-    const E = D.equals(b), se = b.equals(y), dt = b.equals(l), ht = b.toDate(), _ = o?.(ht), mt = !st(b, r, i);
-    let A = !1, yt = !1, B = !1, H = !1;
+  function Gt(g) {
+    const S = y.equals(g);
+    if (!S && !t.showOutsideDays)
+      return;
+    const Qt = g.equals(i), Vt = g.equals(u), at = w(g), q = o?.(at), lt = !Et(g, r, c);
+    let ut = "", A;
     if ("highlightedRange" in t) {
-      const [W, K] = t.highlightedRange;
-      yt = !0, B = W?.equals(b) ?? !1, H = K?.equals(b) ?? !1, A = W && K ? st(b, W, K) : !1;
+      const [ft, dt] = t.highlightedRange, ht = ft?.equals(g), mt = dt?.equals(g);
+      A = Et(g, ft, dt), ut = `${ht ? "range-start" : ""} ${mt ? "range-end" : ""} ${A && !ht && !mt ? "range-inner" : ""}`;
     } else
-      "value" in t && (A = t.value?.equals(b) ?? !1);
+      A = t.value?.equals(g);
     return {
-      part: Xe({
-        button: !0,
-        day: !0,
-        selected: E && A,
-        today: dt,
-        disallowed: _,
-        outside: !E,
-        "range-start": B,
-        "range-end": H,
-        "range-inner": yt && A && !B && !H
-      }),
-      tabindex: E && se ? 0 : -1,
-      disabled: mt,
-      "aria-disabled": _ ? "true" : void 0,
-      "aria-pressed": E && A,
-      "aria-current": dt ? "date" : void 0,
-      "aria-label": a.format(ht),
-      onkeydown: ee,
+      part: `button day ${S && A ? "selected" : ""} ${ut}`,
+      tabindex: S && Qt ? 0 : -1,
+      disabled: lt,
+      "aria-disabled": q ? "true" : void 0,
+      "aria-pressed": S && A,
+      "aria-current": Vt ? "date" : void 0,
+      "aria-label": m.format(at),
+      onkeydown: Xt,
       onclick() {
-        _ || M(b), ft(b);
+        q || v(g), it(g);
       },
       onmouseover() {
-        !_ && !mt && te(b);
+        !q && !lt && z(g);
       }
     };
   }
   return {
-    weeks: m,
-    yearMonth: D,
-    dayNamesLong: c,
-    dayNamesShort: h,
-    monthFormatter: d,
-    getDayProps: ne
+    weeks: E,
+    yearMonth: y,
+    daysLong: d,
+    daysShort: l,
+    formatter: p,
+    getDayProps: Gt
   };
 }
-class T {
-  constructor(t, s, n) {
-    this.start = t, this.duration = s, this.focusedDate = n, this.end = t.add({ months: s.months - 1 });
-  }
-  end;
-  contains(t) {
-    return C.compare(t, this.start) >= 0 && C.compare(t, this.end) <= 0;
-  }
-  adjust(t) {
-    const { start: s, duration: n } = this, o = C.compare(s, t) > 0;
-    let r = new T(s, n, t);
-    for (; !r.contains(t); )
-      r = new T(
-        o ? r.start.subtract(n) : r.start.add(n),
-        n,
-        t
-      );
-    return r;
-  }
-  next() {
-    return new T(
-      this.start.add(this.duration),
-      this.duration,
-      this.focusedDate.add(this.duration)
-    );
-  }
-  prev() {
-    return new T(
-      this.start.subtract(this.duration),
-      this.duration,
-      this.focusedDate.subtract(this.duration)
-    );
-  }
-}
-const Tt = at(), lt = Le({
-  firstDayOfWeek: 0,
+const W = ot(), ct = Ie({
+  firstDayOfWeek: 1,
   isDateDisallowed: () => !1,
-  dateWindow: new T(Tt.toPlainYearMonth(), { months: 1 }, Tt)
+  focusedDate: W,
+  page: { start: W.toPlainYearMonth(), end: W.toPlainYearMonth() }
 });
-customElements.define("calendar-month-ctx", lt);
-const nn = $(
+customElements.define("calendar-month-ctx", ct);
+const He = j(
   (e) => {
-    const t = _e(lt), s = ae(), n = en({ props: e, context: t });
+    const t = Fe(ct), n = se(), s = qe({ props: e, context: t });
     function o() {
-      s.current.querySelector("button[tabindex='0']")?.focus();
+      n.current.querySelector("button[tabindex='0']")?.focus();
     }
-    return /* @__PURE__ */ I("host", { shadowDom: !0, focus: o, children: [
-      /* @__PURE__ */ p("div", { id: "heading", part: "heading", children: n.monthFormatter.format(n.yearMonth.toDate()) }),
-      /* @__PURE__ */ I("table", { ref: s, "aria-labelledby": "heading", part: "table", children: [
-        /* @__PURE__ */ p("thead", { children: /* @__PURE__ */ p("tr", { part: "tr head", children: n.dayNamesLong.map((r, i) => /* @__PURE__ */ I("th", { part: "th", scope: "col", children: [
-          /* @__PURE__ */ p("span", { class: "vh", children: r }),
-          /* @__PURE__ */ p("span", { "aria-hidden": "true", children: n.dayNamesShort[i] })
+    return /* @__PURE__ */ F("host", { shadowDom: !0, focus: o, children: [
+      /* @__PURE__ */ b("div", { id: "h", part: "heading", children: s.formatter.format(w(s.yearMonth)) }),
+      /* @__PURE__ */ F("table", { ref: n, "aria-labelledby": "h", part: "table", children: [
+        /* @__PURE__ */ b("thead", { children: /* @__PURE__ */ b("tr", { part: "tr head", children: s.daysLong.map((r, c) => /* @__PURE__ */ F("th", { part: "th", scope: "col", children: [
+          /* @__PURE__ */ b("span", { class: "vh", children: r }),
+          /* @__PURE__ */ b("span", { "aria-hidden": "true", children: s.daysShort[c] })
         ] })) }) }),
-        /* @__PURE__ */ p("tbody", { children: n.weeks.map((r, i) => /* @__PURE__ */ p("tr", { part: "tr week", children: r.map((f, u) => {
-          const l = n.yearMonth.equals(f), c = t.showOutsideDays || l;
-          return /* @__PURE__ */ p("td", { part: "td", children: c && /* @__PURE__ */ p("button", { ...n.getDayProps(f), children: f.day }) }, u);
-        }) }, i)) })
+        /* @__PURE__ */ b("tbody", { children: s.weeks.map((r, c) => /* @__PURE__ */ b("tr", { part: "tr week", children: r.map((f, a) => {
+          const i = s.getDayProps(f);
+          return /* @__PURE__ */ b("td", { part: "td", children: i && /* @__PURE__ */ b("button", { ...i, children: f.day }) }, a);
+        }) }, c)) })
       ] })
     ] });
   },
@@ -967,51 +878,46 @@ const nn = $(
       }
     },
     styles: [
-      zt,
       Bt,
-      q`:host{--color-accent: black;--color-text-on-accent: white;display:flex;flex-direction:column;gap:.25rem;text-align:center;inline-size:fit-content}table{border-collapse:collapse;border-spacing:0;table-layout:fixed;inline-size:max-content;font-size:.875rem}th{font-weight:700;block-size:2.25rem}td{padding-inline:0;padding-block:1px}button{color:inherit;font-size:inherit;background:transparent;border:0;cursor:pointer;font-variant-numeric:tabular-nums;block-size:2.25rem;inline-size:2.25rem}button:hover:where(:not(:disabled)){background:#0000000d}button:is([aria-pressed=true],:focus-visible){background:var(--color-accent);color:var(--color-text-on-accent)}button:focus-visible{outline:1px solid var(--color-text-on-accent);outline-offset:-2px}button:disabled,:host::part(outside),:host::part(disallowed){cursor:default;opacity:.5}`
+      zt,
+      Y`:host{--color-accent: black;--color-text-on-accent: white;display:flex;flex-direction:column;gap:.25rem;text-align:center;inline-size:fit-content}table{border-collapse:collapse;font-size:.875rem}th{font-weight:700;block-size:2.25rem}td{padding-inline:0}button{color:inherit;font-size:inherit;background:transparent;border:0;font-variant-numeric:tabular-nums;block-size:2.25rem;inline-size:2.25rem}button:hover:where(:not(:disabled)){background:#0000000d}button:is([aria-pressed=true],:focus-visible){background:var(--color-accent);color:var(--color-text-on-accent)}button:focus-visible{outline:1px solid var(--color-text-on-accent);outline-offset:-2px}button:disabled,:host::part(outside),:host::part(disallowed){cursor:default;opacity:.5}`
     ]
   }
 );
-customElements.define("calendar-month", nn);
-function Xt(e) {
-  const t = e.dateWindow.start.toDate(), s = e.dateWindow.end.toDate();
-  return /* @__PURE__ */ I("div", { role: "group", "aria-labelledby": "label", part: "container", children: [
-    /* @__PURE__ */ p("div", { id: "label", class: "vh", "aria-live": "polite", "aria-atomic": "true", children: e.formatVerbose.formatRange(t, s) }),
-    /* @__PURE__ */ I("div", { class: "header", part: "header", children: [
-      /* @__PURE__ */ p(
-        "button",
-        {
-          part: `button previous ${e.previous ? "" : "disabled"}`,
-          onclick: e.previous,
-          "aria-disabled": e.previous ? null : "true",
-          children: /* @__PURE__ */ p("slot", { name: "previous", children: "Previous" })
-        }
-      ),
-      /* @__PURE__ */ p("div", { id: "heading", part: "heading", "aria-hidden": "true", children: e.format.formatRange(t, s) }),
-      /* @__PURE__ */ p(
-        "button",
-        {
-          part: `button next ${e.next ? "" : "disabled"}`,
-          onclick: e.next,
-          "aria-disabled": e.next ? null : "true",
-          children: /* @__PURE__ */ p("slot", { name: "next", children: "Next" })
-        }
-      )
+customElements.define("calendar-month", He);
+function St(e) {
+  return /* @__PURE__ */ b(
+    "button",
+    {
+      part: `button ${e.name} ${e.onclick ? "" : "disabled"}`,
+      onclick: e.onclick,
+      "aria-disabled": e.onclick ? null : "true",
+      children: /* @__PURE__ */ b("slot", { name: e.name, children: e.children })
+    }
+  );
+}
+function Kt(e) {
+  const t = w(e.page.start), n = w(e.page.end);
+  return /* @__PURE__ */ F("div", { role: "group", "aria-labelledby": "h", part: "container", children: [
+    /* @__PURE__ */ b("div", { id: "h", class: "vh", "aria-live": "polite", "aria-atomic": "true", children: e.formatVerbose.formatRange(t, n) }),
+    /* @__PURE__ */ F("div", { part: "header", children: [
+      /* @__PURE__ */ b(St, { name: "previous", onclick: e.previous, children: "Previous" }),
+      /* @__PURE__ */ b("div", { part: "heading", "aria-hidden": "true", children: e.format.formatRange(t, n) }),
+      /* @__PURE__ */ b(St, { name: "next", onclick: e.next, children: "Next" })
     ] }),
-    /* @__PURE__ */ p(
-      lt,
+    /* @__PURE__ */ b(
+      ct,
       {
         value: e,
         onselectday: e.onSelect,
         onfocusday: e.onFocus,
         onhoverday: e.onHover,
-        children: /* @__PURE__ */ p("slot", {})
+        children: /* @__PURE__ */ b("slot", {})
       }
     )
   ] });
 }
-const Gt = {
+const Jt = {
   value: {
     type: String,
     value: ""
@@ -1034,7 +940,7 @@ const Gt = {
   },
   showOutsideDays: {
     type: Boolean,
-    value: () => !1
+    value: !1
   },
   locale: {
     type: String,
@@ -1044,101 +950,129 @@ const Gt = {
   months: {
     type: Number,
     value: 1
+  },
+  focusedDate: {
+    type: String,
+    value: () => {
+    }
   }
-}, Qt = [
-  zt,
+}, Zt = [
   Bt,
-  q`:host{display:block;inline-size:fit-content}[role=group]{display:flex;flex-direction:column;gap:1em}.header{display:flex;align-items:center;justify-content:space-between}#heading{font-weight:700;font-size:1.25em}button{cursor:pointer;user-select:none;display:flex;align-items:center;justify-content:center}button[aria-disabled]{cursor:default;opacity:.4}`
-], sn = { year: "numeric" }, on = { year: "numeric", month: "long" };
-function Vt({ months: e, locale: t }) {
-  const [s] = rt("min"), [n] = rt("max"), o = v("focusday"), r = v("change"), [i, f] = it(() => {
-    const m = at(), w = e === 12 ? new C(m.year, 1) : m.toPlainYearMonth();
-    return new T(w, { months: e }, m);
-  });
-  function u(m) {
-    f(m), o(m.focusedDate.toDate());
-  }
-  function l(m) {
-    f(i.adjust(m));
+  zt,
+  Y`:host{display:block;inline-size:fit-content}[role=group]{display:flex;flex-direction:column;gap:1em}:host::part(header){display:flex;align-items:center;justify-content:space-between}:host::part(heading){font-weight:700;font-size:1.25em}button{display:flex;align-items:center;justify-content:center}button[aria-disabled]{cursor:default;opacity:.5}`
+], Ke = { year: "numeric" }, Je = { year: "numeric", month: "long" };
+function wt(e, t) {
+  return (t.year - e.year) * 12 + t.month - e.month;
+}
+const vt = (e, t) => (e = t === 12 ? new B(e.year, 1) : e, {
+  start: e,
+  end: e.add({ months: t - 1 })
+});
+function Wt({
+  months: e,
+  locale: t,
+  focusedDate: n,
+  setFocusedDate: s
+}) {
+  const [o] = I("min"), [r] = I("max"), c = C("focusday"), f = C("change"), a = P(
+    () => x(n ?? ot(), o, r),
+    [n, o, r]
+  ), [i, u] = st(
+    () => vt(a.toPlainYearMonth(), e)
+  ), d = (h) => {
+    const v = wt(i.start, h.toPlainYearMonth());
+    return v >= 0 && v < e;
+  };
+  nt(() => {
+    let h = i.start;
+    if (!d(a)) {
+      const v = wt(h, a.toPlainYearMonth()), z = Math.floor(v / e);
+      h = h.add({ months: z * e });
+    }
+    u(vt(h, e));
+  }, [a, e]);
+  const l = $();
+  function m() {
+    l.current.querySelectorAll("calendar-month").forEach((h) => h.focus());
   }
-  const c = U();
-  function h() {
-    c.current.querySelectorAll("calendar-month").forEach((m) => m.focus());
+  function p(h) {
+    s(h), c(w(h));
   }
-  const a = x(sn, t), d = x(on, t), y = n == null || !i.contains(n), D = s == null || !i.contains(s);
+  const y = U(Ke, t), E = U(Je, t);
   return {
-    format: a,
-    formatVerbose: d,
-    dateWindow: i,
-    dispatch: r,
-    handleFocus(m) {
-      m.stopPropagation(), l(m.detail), o(m.detail.toDate()), setTimeout(h);
+    format: y,
+    formatVerbose: E,
+    page: i,
+    focusedDate: a,
+    dispatch: f,
+    onFocus(h) {
+      h.stopPropagation(), p(h.detail), setTimeout(m);
     },
-    setFocusedDate: l,
-    min: s,
-    max: n,
-    next: y ? () => u(i.next()) : void 0,
-    previous: D ? () => u(i.prev()) : void 0,
-    focus: h
+    min: o,
+    max: r,
+    next: r == null || !d(r) ? () => p(a.add({ months: e })) : void 0,
+    previous: o == null || !d(o) ? () => p(a.add({ months: -e })) : void 0,
+    focus: m
   };
 }
-const rn = $(
+const Ze = j(
   (e) => {
-    const [t, s] = rt("value"), n = Vt(e);
-    j(() => {
-      t && n.setFocusedDate(t);
-    }, [t]);
-    function o(r) {
-      s(r.detail), n.dispatch();
+    const [t, n] = I("value"), [s = t, o] = I("focusedDate"), r = Wt({
+      ...e,
+      focusedDate: s,
+      setFocusedDate: o
+    });
+    function c(f) {
+      n(f.detail), r.dispatch();
     }
-    return /* @__PURE__ */ p("host", { shadowDom: !0, focus: n.focus, children: /* @__PURE__ */ p(
-      Xt,
+    return /* @__PURE__ */ b("host", { shadowDom: !0, focus: r.focus, children: /* @__PURE__ */ b(
+      Kt,
       {
         ...e,
-        ...n,
+        ...r,
         value: t,
-        onFocus: n.handleFocus,
-        onSelect: o
+        onSelect: c
       }
     ) });
   },
-  { props: Gt, styles: Qt }
+  { props: Jt, styles: Zt }
 );
-customElements.define("calendar-date", rn);
-const Ct = (e, t) => g.compare(e, t) < 0 ? [e, t] : [t, e], an = $(
+customElements.define("calendar-date", Ze);
+const Tt = (e, t) => D.compare(e, t) < 0 ? [e, t] : [t, e], We = j(
   (e) => {
-    const [t, s] = Ze("value"), n = Vt(e), o = v("rangestart"), r = v("rangeend"), [i, f] = it();
-    j(() => {
-      t.length && !st(n.dateWindow.focusedDate, t[0], t[1]) && n.setFocusedDate(t[1]);
-    }, [t]);
-    async function u(a) {
-      n.handleFocus(a), l(a);
+    const [t, n] = je("value"), [s = t[0], o] = I("focusedDate"), r = Wt({
+      ...e,
+      focusedDate: s,
+      setFocusedDate: o
+    }), c = C("rangestart"), f = C("rangeend"), [a, i] = st();
+    function u(p) {
+      r.onFocus(p), d(p);
     }
-    function l(a) {
-      a.stopPropagation(), f((d) => d && { ...d, second: a.detail });
+    function d(p) {
+      p.stopPropagation(), i((y) => y && { ...y, b: p.detail });
     }
-    function c(a) {
-      const d = a.detail;
-      a.stopPropagation(), i ? (s(Ct(i.first, d)), f(void 0), r(d.toDate()), n.dispatch()) : (f({ first: d, second: d }), o(d.toDate()));
+    function l(p) {
+      const y = p.detail;
+      p.stopPropagation(), a ? (n(Tt(a.a, y)), i(void 0), f(w(y)), r.dispatch()) : (i({ a: y, b: y }), c(w(y)));
     }
-    const h = i ? Ct(i.first, i.second) : t;
-    return /* @__PURE__ */ p("host", { shadowDom: !0, focus: n.focus, children: /* @__PURE__ */ p(
-      Xt,
+    const m = a ? Tt(a.a, a.b) : t;
+    return /* @__PURE__ */ b("host", { shadowDom: !0, focus: r.focus, children: /* @__PURE__ */ b(
+      Kt,
       {
         ...e,
-        ...n,
-        highlightedRange: h,
+        ...r,
+        highlightedRange: m,
         onFocus: u,
-        onHover: l,
-        onSelect: c
+        onHover: d,
+        onSelect: l
       }
     ) });
   },
-  { props: Gt, styles: Qt }
+  { props: Jt, styles: Zt }
 );
-customElements.define("calendar-range", an);
+customElements.define("calendar-range", We);
 export {
-  rn as CalendarDate,
-  nn as CalendarMonth,
-  an as CalendarRange
+  Ze as CalendarDate,
+  He as CalendarMonth,
+  We as CalendarRange
 };