@tempots/ui
Version:
Provides a higher level of renderables to help fast development with Tempo.
1,873 lines (1,872 loc) • 61.3 kB
JavaScript
import { getWindow as st, prop as M, makeProviderMark as Ft, computedOf as Mt, Signal as ce, Use as ct, html as Et, on as le, Value as C, attr as Nt, Empty as Pt, OneOfType as ue, WithElement as _, OnDispose as N, Fragment as Y, Portal as fe, renderableOfTNode as he, When as de, previousSignal as He, effectOf as We, WithBrowserCtx as Fe, WithCtx as Me, Provide as Ne, OneOfTuple as me, Prop as Ve } from "@tempots/dom";
import { delayed as pe, AsyncResult as R, nearEqual as mt, interval as $e } from "@tempots/std";
const ze = (t) => {
const e = t.split("/").pop();
if (e == null || e.startsWith(".")) return;
const n = e.split(".") || [];
return n.length > 1 ? "." + n.pop() : void 0;
}, Be = (t, e) => {
const n = ze(e);
return n != null && (t.length === 0 || !t.some((o) => n == o));
}, _e = (t, e, n, o) => {
let s = t.target;
for (; s != null && !(s instanceof HTMLAnchorElement); )
s = s.parentElement;
if (s == null)
return !0;
const i = s;
if (t.button !== 0 || t.ctrlKey || t.metaKey || i.target !== "_self" && i.target !== "" || i.getAttribute("download") != null)
return !0;
const { pathname: r, search: a, hash: c } = i;
if (o) {
const l = r + a + c, u = i.getAttribute("href");
if (!u?.startsWith("#") && u !== l)
return !0;
}
return e ? !1 : Be(n, r);
}, Ue = (t, e = {
ignoreUrlWithExtension: !0,
allowedExtensions: [],
ignoreExternalUrl: !0
}) => {
const n = e.ignoreUrlWithExtension === !0 && Array.isArray(e.allowedExtensions) ? e.allowedExtensions.map(
(o) => o.startsWith(".") ? o : "." + o
) : [];
return (o) => {
_e(
o,
e.ignoreUrlWithExtension ?? !0,
n,
e.ignoreExternalUrl ?? !0
) || t() && o.preventDefault();
};
}, Ke = (t, e) => t.pathname === e.pathname && JSON.stringify(t.search) === JSON.stringify(e.search) && t.hash === e.hash, Lt = (t, e) => {
const n = new URL(t, e ?? st()?.location.toString()), o = Object.fromEntries(n.searchParams?.entries() ?? []);
let s = n.hash;
return s.startsWith("#") && (s = s.substring(1)), {
pathname: n.pathname,
search: o,
hash: s === "" ? void 0 : s
};
}, et = (t) => {
const n = new URLSearchParams(t.search).toString(), o = t.hash;
return `${t.pathname}${n ? `?${n}` : ""}${o ? `#${o}` : ""}`;
}, je = (t) => {
document.startViewTransition ? document.startViewTransition(t) : t();
}, jt = () => {
const t = st(), e = t?.location.hash ?? "";
return {
pathname: t?.location.pathname ?? "",
search: Object.fromEntries(
new URLSearchParams(t?.location.search ?? "").entries()
),
hash: e.startsWith("#") ? e.substring(1) || void 0 : e === "" ? void 0 : e
};
}, It = (t) => {
if (t?.scroll !== "auto")
return;
const e = st();
e && e.requestAnimationFrame(
() => e.scrollTo({ top: 0, left: 0, behavior: "auto" })
);
}, Yt = (t, e) => {
e?.viewTransition ? je(t) : t();
}, Ie = () => {
const t = M(jt(), Ke), e = st(), n = () => {
t.set(jt());
};
e?.addEventListener("popstate", n), e?.addEventListener("hashchange", n);
const o = (c, l, u) => {
Yt(() => {
if (e) {
const h = et(c), g = l?.state ?? {};
u === "replaceState" || l?.replace ? e.history.replaceState(g, "", h) : e.history.pushState(g, "", h);
}
t.set(c);
}, l), It(l);
}, s = (c, l) => {
Yt(() => {
e?.history.go(c);
}, l), It(l);
};
return {
location: t,
commit: o,
go: s,
back: (c) => s(-1, c),
forward: (c) => s(1, c),
resolve: (c) => Lt(c),
dispose: () => {
e?.removeEventListener("popstate", n), e?.removeEventListener("hashchange", n), t.dispose();
}
};
}, Ye = (t) => t.startsWith("http://") || t.startsWith("https://") || t.startsWith("//"), qe = (t) => {
const e = t.container.currentURL, n = e.iso(
(r) => Lt(r, e.value),
(r) => {
if (Ye(r.pathname))
return et(r);
const a = new URL(r.pathname, e.value), c = a.origin + a.pathname;
return et({ ...r, pathname: c });
}
);
return {
location: n,
dispose: () => {
n.dispose();
},
commit: (r, a, c) => {
n.set(r);
},
go: (r, a) => {
},
// eslint-disable-next-line @typescript-eslint/no-unused-vars
back: (r) => {
},
// eslint-disable-next-line @typescript-eslint/no-unused-vars
forward: (r) => {
},
resolve: (r) => Lt(r, e.value)
};
}, it = (t) => ({
pathname: t.pathname,
search: { ...t.search },
hash: t.hash ?? void 0
}), kt = (t) => {
if (t == null) return;
const e = `${t}`;
return e === "" ? void 0 : e;
}, ge = (t, e) => {
const n = { ...t };
for (const [o, s] of Object.entries(e))
s == null ? delete n[o] : n[o] = s;
return n;
}, Xe = (t, e) => {
const n = e?.includeSearch ?? !0, o = e?.includeHash ?? !0, s = e?.ignoreSearchParams ?? [];
let i;
if (!n)
i = {};
else if (s.length === 0)
i = { ...t.search };
else {
const r = new Set(s);
i = {};
for (const [a, c] of Object.entries(t.search))
r.has(a) || (i[a] = c);
}
return {
pathname: t.pathname,
search: i,
hash: o ? t.hash : void 0
};
}, qt = (t, e, n) => {
const o = Xe(t, n);
return typeof e == "string" ? et(o) === e : e instanceof RegExp ? ((e.global || e.sticky) && (e.lastIndex = 0), e.test(et(o))) : e(o);
};
class Qe {
constructor(e) {
this.current = e;
}
get location() {
return this.current;
}
setLocation(e) {
return this.current = it(e), this;
}
setPathname(e) {
return this.current = {
...this.current,
pathname: e
}, this;
}
setHash(e) {
const n = kt(e);
if (n == null) {
const { hash: o, ...s } = this.current;
this.current = s;
} else
this.current = {
...this.current,
hash: n
};
return this;
}
clearHash() {
const { hash: e, ...n } = this.current;
return this.current = n, this;
}
setSearch(e) {
return this.current = {
...this.current,
search: ge(this.current.search, e)
}, this;
}
setSearchParam(e, n) {
return this.setSearch({ [e]: n });
}
updateSearch(e) {
return this.current = {
...this.current,
search: { ...e({ ...this.current.search }) }
}, this;
}
}
const Je = (t, e) => t?.replace ? "replaceState" : e, Ge = (t) => {
const e = t.location, n = e.map(et), o = e.map((p) => p.pathname), s = e.map((p) => ({ ...p.search })), i = e.map((p) => p.hash), r = (p, x) => qt(t.location.value, p, x), a = (p, x) => Mt(
e,
p
)(
(S, P) => qt(S, P, x)
), c = (p, x, S) => {
const P = it({
...p,
hash: kt(p.hash ?? void 0)
});
t.commit(P, x, S);
}, l = (p, x) => {
const S = Je(x, "pushState");
c(p, x, S);
}, u = (p, x) => {
const S = p(it(t.location.value));
l(S, x);
}, h = (p, x) => {
const S = t.resolve(p);
l(S, x);
}, g = (p, x) => {
const S = { ...x, replace: !0 };
h(p, S);
}, f = (p, x) => {
t.go(p, x);
}, d = (p) => {
t.back(p);
}, y = (p) => {
t.forward(p);
}, m = (p, x) => u((S) => ({ ...S, pathname: p }), x), v = (p, x) => u((S) => {
const P = { ...S }, K = kt(p);
return K == null ? delete P.hash : P.hash = K, P;
}, x), b = (p) => v(void 0, p), w = (p, x) => u(
(S) => ({
...S,
search: ge(S.search, p)
}),
x
);
return {
handle: {
location: e,
url: n,
pathname: o,
search: s,
hash: i,
setLocation: l,
updateLocation: u,
navigate: h,
replace: g,
go: f,
back: d,
forward: y,
setPathname: m,
setHash: v,
clearHash: b,
setSearch: w,
setSearchParam: (p, x, S) => w({ [p]: x }, S),
updateSearch: (p, x) => u(
(S) => ({
...S,
search: { ...p({ ...S.search }) }
}),
x
),
queryParam: (p) => e.map((x) => x.search[p]),
run: (p, x) => {
const S = new Qe(
it(t.location.value)
);
p(S), l(it(S.location), x);
},
match: r,
matchSignal: a
},
dispose: () => {
t.dispose(), n.dispose(), o.dispose(), s.dispose(), i.dispose();
}
};
}, Ze = (t) => {
if (t.isBrowser())
return Ie();
if (t.isHeadless())
return qe(t);
throw new Error("Unknown context");
}, Vt = {
mark: Ft("Location"),
create: (t, e) => {
const n = Ze(e), { handle: o, dispose: s } = Ge(n);
return {
value: o,
dispose: s
};
}
}, tn = (t, ...e) => {
if (typeof t == "string" || ce.is(t))
return tn({ href: t }, ...e);
const { href: n, state: o, scroll: s, viewTransition: i, replace: r, ...a } = t;
return ct(Vt, (c) => Et.a(
le.click(
Ue(() => {
let l = !1;
const u = {};
return o !== void 0 && (u.state = o, l = !0), s !== void 0 && (u.scroll = s, l = !0), i !== void 0 && (u.viewTransition = i, l = !0), r !== void 0 && (u.replace = r, l = !0), c.navigate(
C.get(n),
l ? u : void 0
), !0;
}, a)
),
Nt.href(n),
...e
/* c8 ignore next 2 */
));
}, yo = {
mark: Ft("Appearance"),
create: () => {
const t = en();
return {
value: t,
dispose: t.dispose
};
}
};
function en() {
const t = st(), e = t != null && t.matchMedia != null ? t.matchMedia("(prefers-color-scheme: dark)") : void 0, n = e?.matches ?? !1, o = M(n ? "dark" : "light"), s = (i) => o.set(i.matches ? "dark" : "light");
return e?.addEventListener("change", s), o.onDispose(() => e?.removeEventListener("change", s)), o;
}
const we = (t, e) => {
if (typeof e == "function")
return we(t, { success: e });
const n = e.failure ?? ((r) => r.map((a) => `Error: ${a}`)), o = e.success, s = e.loading ?? (() => Pt), i = e.notAsked ?? (() => Pt);
return ue(C.toSignal(t), {
AsyncSuccess: (r) => o(r.$.value),
AsyncFailure: (r) => n(r.$.error),
Loading: (r) => s(r.map((a) => a.previousValue)),
NotAsked: i
});
}, xo = (t = 10) => _((e) => N(pe(() => e?.focus(), t))), bo = (t = 10) => _((e) => {
const n = pe(() => e.select(), t);
return N(n);
});
function So(t) {
const e = Object.entries(t);
return Y(
...e.map(
([n, o]) => Nt.class(C.map(o, (s) => s ? n : void 0))
)
);
}
const Oo = _((t) => {
const e = t.style.getPropertyValue(":empty");
return t.style.setProperty(":empty", "display:none"), N((n) => {
n && t.style.setProperty(":empty", e);
});
}), Ao = (t) => fe("head > title", Nt.innerText(t)), nn = {
partial: {
root: null,
rootMargin: "0px",
threshold: 0
},
full: {
root: null,
rootMargin: "0px",
threshold: 1
}
}, gt = {
partial: /* @__PURE__ */ new Map(),
full: /* @__PURE__ */ new Map()
}, at = {
partial: null,
full: null
};
function on(t) {
return at[t] == null && (at[t] = new IntersectionObserver((e) => {
e.forEach((n) => {
gt[t].get(n.target)?.set(n.isIntersecting);
});
}, nn[t])), at[t];
}
const sn = ({ mode: t = "partial", once: e = !1 }, n) => {
const o = M(!1);
return Y(
_((s) => {
const i = typeof IntersectionObserver < "u" ? on(t) : null;
gt[t].set(s, o), i?.observe(s);
function r() {
i?.unobserve(s), gt[t].delete(s), gt[t].size === 0 && (at[t]?.disconnect(), at[t] = null);
}
let a = null;
return e && (a = o.on((c) => {
c && r();
})), N(() => {
o.dispose(), r(), a?.();
});
}),
he(n(o))
);
}, Ro = (t, e, n) => sn(t, (o) => de(o, e, n ?? (() => Pt)));
function rn(t) {
return _((e) => {
const n = (o) => {
e.contains(o.target) || t(o);
};
return document.addEventListener("click", n), N(() => {
document.removeEventListener("click", n);
});
});
}
const Z = (t, e) => t === void 0 || t === e, Xt = (t, e) => t === void 0 || t === e;
function an(t, e) {
return typeof t == "string" ? e.key === t : Xt(t.key, e.key) && Xt(t.code, e.code) && Z(t.ctrlKey, e.ctrlKey) && Z(t.altKey, e.altKey) && Z(t.shiftKey, e.shiftKey) && Z(t.metaKey, e.metaKey) && Z(t.repeat, e.repeat) && Z(
t.commandOrControlKey,
e.metaKey || e.ctrlKey
);
}
function ve({
allowedKeys: t,
handler: e
}) {
return _((n) => {
const o = (s) => {
if (n.contains(s.target)) {
for (const i of t)
if (an(i, s)) {
e(s);
break;
}
}
};
return document.addEventListener("keydown", o), N(() => {
document.removeEventListener("keydown", o);
});
});
}
function Eo(t) {
return ve({ allowedKeys: ["Enter"], handler: t });
}
function Po(t) {
return ve({ allowedKeys: ["Escape"], handler: t });
}
const cn = ({
mutate: t,
convertError: e,
onSuccess: n,
onError: o,
onSettled: s
}) => {
let i;
const r = M(R.notAsked), a = r.map(
(d) => R.isSuccess(d) ? d.value : void 0
), c = r.map(
(d) => R.isFailure(d) ? d.error : void 0
), l = r.map((d) => R.isLoading(d)), u = () => {
i?.abort(), i = void 0;
};
return {
status: r,
value: a,
error: c,
pending: l,
execute: async (d, y) => {
u(), i = new AbortController();
const m = i.signal, v = r.get(), b = y?.optimisticValue ?? (y?.optimisticFromRequest != null ? y.optimisticFromRequest(d) : void 0);
b != null ? r.set(R.loading(b)) : r.set(R.loading(R.getOrUndefined(v)));
try {
const w = await t({ request: d, abortSignal: m, previous: v });
i = void 0, r.set(R.success(w)), n?.(w, d);
} catch (w) {
i = void 0, r.set(R.failure(e(w))), o?.(e(w), d);
}
s?.(r.get(), d);
},
cancel: (d) => {
u(), r.set(d ?? R.notAsked);
},
dispose: () => {
i?.abort(), i = void 0, r.dispose();
}
};
}, ln = (t, e) => {
const { status: n, dispose: o, execute: s, cancel: i, pending: r, error: a, value: c } = t, { content: l } = e, u = He(c);
return Y(
N(o),
l({
previous: u,
execute: s,
cancel: i,
pending: r,
error: a,
value: c,
status: n
})
);
}, Lo = ({
mutate: t,
convertError: e = (r) => r,
onSuccess: n,
onError: o,
onSettled: s,
content: i
}) => {
const r = cn({
mutate: t,
convertError: e,
onSuccess: n,
onError: o,
onSettled: s
});
return ln(r, { content: i });
}, nt = Math.min, Q = Math.max, wt = Math.round, pt = Math.floor, V = (t) => ({
x: t,
y: t
}), un = {
left: "right",
right: "left",
bottom: "top",
top: "bottom"
}, fn = {
start: "end",
end: "start"
};
function Tt(t, e, n) {
return Q(t, nt(e, n));
}
function ft(t, e) {
return typeof t == "function" ? t(e) : t;
}
function J(t) {
return t.split("-")[0];
}
function ht(t) {
return t.split("-")[1];
}
function ye(t) {
return t === "x" ? "y" : "x";
}
function $t(t) {
return t === "y" ? "height" : "width";
}
const hn = /* @__PURE__ */ new Set(["top", "bottom"]);
function I(t) {
return hn.has(J(t)) ? "y" : "x";
}
function zt(t) {
return ye(I(t));
}
function dn(t, e, n) {
n === void 0 && (n = !1);
const o = ht(t), s = zt(t), i = $t(s);
let r = s === "x" ? o === (n ? "end" : "start") ? "right" : "left" : o === "start" ? "bottom" : "top";
return e.reference[i] > e.floating[i] && (r = vt(r)), [r, vt(r)];
}
function mn(t) {
const e = vt(t);
return [Ct(t), e, Ct(e)];
}
function Ct(t) {
return t.replace(/start|end/g, (e) => fn[e]);
}
const Qt = ["left", "right"], Jt = ["right", "left"], pn = ["top", "bottom"], gn = ["bottom", "top"];
function wn(t, e, n) {
switch (t) {
case "top":
case "bottom":
return n ? e ? Jt : Qt : e ? Qt : Jt;
case "left":
case "right":
return e ? pn : gn;
default:
return [];
}
}
function vn(t, e, n, o) {
const s = ht(t);
let i = wn(J(t), n === "start", o);
return s && (i = i.map((r) => r + "-" + s), e && (i = i.concat(i.map(Ct)))), i;
}
function vt(t) {
return t.replace(/left|right|bottom|top/g, (e) => un[e]);
}
function yn(t) {
return {
top: 0,
right: 0,
bottom: 0,
left: 0,
...t
};
}
function xe(t) {
return typeof t != "number" ? yn(t) : {
top: t,
right: t,
bottom: t,
left: t
};
}
function yt(t) {
const {
x: e,
y: n,
width: o,
height: s
} = t;
return {
width: o,
height: s,
top: n,
left: e,
right: e + o,
bottom: n + s,
x: e,
y: n
};
}
function Gt(t, e, n) {
let {
reference: o,
floating: s
} = t;
const i = I(e), r = zt(e), a = $t(r), c = J(e), l = i === "y", u = o.x + o.width / 2 - s.width / 2, h = o.y + o.height / 2 - s.height / 2, g = o[a] / 2 - s[a] / 2;
let f;
switch (c) {
case "top":
f = {
x: u,
y: o.y - s.height
};
break;
case "bottom":
f = {
x: u,
y: o.y + o.height
};
break;
case "right":
f = {
x: o.x + o.width,
y: h
};
break;
case "left":
f = {
x: o.x - s.width,
y: h
};
break;
default:
f = {
x: o.x,
y: o.y
};
}
switch (ht(e)) {
case "start":
f[r] -= g * (n && l ? -1 : 1);
break;
case "end":
f[r] += g * (n && l ? -1 : 1);
break;
}
return f;
}
const xn = async (t, e, n) => {
const {
placement: o = "bottom",
strategy: s = "absolute",
middleware: i = [],
platform: r
} = n, a = i.filter(Boolean), c = await (r.isRTL == null ? void 0 : r.isRTL(e));
let l = await r.getElementRects({
reference: t,
floating: e,
strategy: s
}), {
x: u,
y: h
} = Gt(l, o, c), g = o, f = {}, d = 0;
for (let y = 0; y < a.length; y++) {
const {
name: m,
fn: v
} = a[y], {
x: b,
y: w,
data: A,
reset: O
} = await v({
x: u,
y: h,
initialPlacement: o,
placement: g,
strategy: s,
middlewareData: f,
rects: l,
platform: r,
elements: {
reference: t,
floating: e
}
});
u = b ?? u, h = w ?? h, f = {
...f,
[m]: {
...f[m],
...A
}
}, O && d <= 50 && (d++, typeof O == "object" && (O.placement && (g = O.placement), O.rects && (l = O.rects === !0 ? await r.getElementRects({
reference: t,
floating: e,
strategy: s
}) : O.rects), {
x: u,
y: h
} = Gt(l, g, c)), y = -1);
}
return {
x: u,
y: h,
placement: g,
strategy: s,
middlewareData: f
};
};
async function be(t, e) {
var n;
e === void 0 && (e = {});
const {
x: o,
y: s,
platform: i,
rects: r,
elements: a,
strategy: c
} = t, {
boundary: l = "clippingAncestors",
rootBoundary: u = "viewport",
elementContext: h = "floating",
altBoundary: g = !1,
padding: f = 0
} = ft(e, t), d = xe(f), m = a[g ? h === "floating" ? "reference" : "floating" : h], v = yt(await i.getClippingRect({
element: (n = await (i.isElement == null ? void 0 : i.isElement(m))) == null || n ? m : m.contextElement || await (i.getDocumentElement == null ? void 0 : i.getDocumentElement(a.floating)),
boundary: l,
rootBoundary: u,
strategy: c
})), b = h === "floating" ? {
x: o,
y: s,
width: r.floating.width,
height: r.floating.height
} : r.reference, w = await (i.getOffsetParent == null ? void 0 : i.getOffsetParent(a.floating)), A = await (i.isElement == null ? void 0 : i.isElement(w)) ? await (i.getScale == null ? void 0 : i.getScale(w)) || {
x: 1,
y: 1
} : {
x: 1,
y: 1
}, O = yt(i.convertOffsetParentRelativeRectToViewportRelativeRect ? await i.convertOffsetParentRelativeRectToViewportRelativeRect({
elements: a,
rect: b,
offsetParent: w,
strategy: c
}) : b);
return {
top: (v.top - O.top + d.top) / A.y,
bottom: (O.bottom - v.bottom + d.bottom) / A.y,
left: (v.left - O.left + d.left) / A.x,
right: (O.right - v.right + d.right) / A.x
};
}
const bn = (t) => ({
name: "arrow",
options: t,
async fn(e) {
const {
x: n,
y: o,
placement: s,
rects: i,
platform: r,
elements: a,
middlewareData: c
} = e, {
element: l,
padding: u = 0
} = ft(t, e) || {};
if (l == null)
return {};
const h = xe(u), g = {
x: n,
y: o
}, f = zt(s), d = $t(f), y = await r.getDimensions(l), m = f === "y", v = m ? "top" : "left", b = m ? "bottom" : "right", w = m ? "clientHeight" : "clientWidth", A = i.reference[d] + i.reference[f] - g[f] - i.floating[d], O = g[f] - i.reference[f], T = await (r.getOffsetParent == null ? void 0 : r.getOffsetParent(l));
let E = T ? T[w] : 0;
(!E || !await (r.isElement == null ? void 0 : r.isElement(T))) && (E = a.floating[w] || i.floating[d]);
const U = A / 2 - O / 2, p = E / 2 - y[d] / 2 - 1, x = nt(h[v], p), S = nt(h[b], p), P = x, K = E - y[d] - S, L = E / 2 - y[d] / 2 + U, X = Tt(P, L, K), B = !c.arrow && ht(s) != null && L !== X && i.reference[d] / 2 - (L < P ? x : S) - y[d] / 2 < 0, D = B ? L < P ? L - P : L - K : 0;
return {
[f]: g[f] + D,
data: {
[f]: X,
centerOffset: L - X - D,
...B && {
alignmentOffset: D
}
},
reset: B
};
}
}), Sn = function(t) {
return t === void 0 && (t = {}), {
name: "flip",
options: t,
async fn(e) {
var n, o;
const {
placement: s,
middlewareData: i,
rects: r,
initialPlacement: a,
platform: c,
elements: l
} = e, {
mainAxis: u = !0,
crossAxis: h = !0,
fallbackPlacements: g,
fallbackStrategy: f = "bestFit",
fallbackAxisSideDirection: d = "none",
flipAlignment: y = !0,
...m
} = ft(t, e);
if ((n = i.arrow) != null && n.alignmentOffset)
return {};
const v = J(s), b = I(a), w = J(a) === a, A = await (c.isRTL == null ? void 0 : c.isRTL(l.floating)), O = g || (w || !y ? [vt(a)] : mn(a)), T = d !== "none";
!g && T && O.push(...vn(a, y, d, A));
const E = [a, ...O], U = await be(e, m), p = [];
let x = ((o = i.flip) == null ? void 0 : o.overflows) || [];
if (u && p.push(U[v]), h) {
const L = dn(s, r, A);
p.push(U[L[0]], U[L[1]]);
}
if (x = [...x, {
placement: s,
overflows: p
}], !p.every((L) => L <= 0)) {
var S, P;
const L = (((S = i.flip) == null ? void 0 : S.index) || 0) + 1, X = E[L];
if (X && (!(h === "alignment" ? b !== I(X) : !1) || // We leave the current main axis only if every placement on that axis
// overflows the main axis.
x.every((H) => I(H.placement) === b ? H.overflows[0] > 0 : !0)))
return {
data: {
index: L,
overflows: x
},
reset: {
placement: X
}
};
let B = (P = x.filter((D) => D.overflows[0] <= 0).sort((D, H) => D.overflows[1] - H.overflows[1])[0]) == null ? void 0 : P.placement;
if (!B)
switch (f) {
case "bestFit": {
var K;
const D = (K = x.filter((H) => {
if (T) {
const j = I(H.placement);
return j === b || // Create a bias to the `y` side axis due to horizontal
// reading directions favoring greater width.
j === "y";
}
return !0;
}).map((H) => [H.placement, H.overflows.filter((j) => j > 0).reduce((j, De) => j + De, 0)]).sort((H, j) => H[1] - j[1])[0]) == null ? void 0 : K[0];
D && (B = D);
break;
}
case "initialPlacement":
B = a;
break;
}
if (s !== B)
return {
reset: {
placement: B
}
};
}
return {};
}
};
}, On = /* @__PURE__ */ new Set(["left", "top"]);
async function An(t, e) {
const {
placement: n,
platform: o,
elements: s
} = t, i = await (o.isRTL == null ? void 0 : o.isRTL(s.floating)), r = J(n), a = ht(n), c = I(n) === "y", l = On.has(r) ? -1 : 1, u = i && c ? -1 : 1, h = ft(e, t);
let {
mainAxis: g,
crossAxis: f,
alignmentAxis: d
} = typeof h == "number" ? {
mainAxis: h,
crossAxis: 0,
alignmentAxis: null
} : {
mainAxis: h.mainAxis || 0,
crossAxis: h.crossAxis || 0,
alignmentAxis: h.alignmentAxis
};
return a && typeof d == "number" && (f = a === "end" ? d * -1 : d), c ? {
x: f * u,
y: g * l
} : {
x: g * l,
y: f * u
};
}
const Rn = function(t) {
return t === void 0 && (t = 0), {
name: "offset",
options: t,
async fn(e) {
var n, o;
const {
x: s,
y: i,
placement: r,
middlewareData: a
} = e, c = await An(e, t);
return r === ((n = a.offset) == null ? void 0 : n.placement) && (o = a.arrow) != null && o.alignmentOffset ? {} : {
x: s + c.x,
y: i + c.y,
data: {
...c,
placement: r
}
};
}
};
}, En = function(t) {
return t === void 0 && (t = {}), {
name: "shift",
options: t,
async fn(e) {
const {
x: n,
y: o,
placement: s
} = e, {
mainAxis: i = !0,
crossAxis: r = !1,
limiter: a = {
fn: (m) => {
let {
x: v,
y: b
} = m;
return {
x: v,
y: b
};
}
},
...c
} = ft(t, e), l = {
x: n,
y: o
}, u = await be(e, c), h = I(J(s)), g = ye(h);
let f = l[g], d = l[h];
if (i) {
const m = g === "y" ? "top" : "left", v = g === "y" ? "bottom" : "right", b = f + u[m], w = f - u[v];
f = Tt(b, f, w);
}
if (r) {
const m = h === "y" ? "top" : "left", v = h === "y" ? "bottom" : "right", b = d + u[m], w = d - u[v];
d = Tt(b, d, w);
}
const y = a.fn({
...e,
[g]: f,
[h]: d
});
return {
...y,
data: {
x: y.x - n,
y: y.y - o,
enabled: {
[g]: i,
[h]: r
}
}
};
}
};
};
function bt() {
return typeof window < "u";
}
function rt(t) {
return Se(t) ? (t.nodeName || "").toLowerCase() : "#document";
}
function k(t) {
var e;
return (t == null || (e = t.ownerDocument) == null ? void 0 : e.defaultView) || window;
}
function z(t) {
var e;
return (e = (Se(t) ? t.ownerDocument : t.document) || window.document) == null ? void 0 : e.documentElement;
}
function Se(t) {
return bt() ? t instanceof Node || t instanceof k(t).Node : !1;
}
function W(t) {
return bt() ? t instanceof Element || t instanceof k(t).Element : !1;
}
function $(t) {
return bt() ? t instanceof HTMLElement || t instanceof k(t).HTMLElement : !1;
}
function Zt(t) {
return !bt() || typeof ShadowRoot > "u" ? !1 : t instanceof ShadowRoot || t instanceof k(t).ShadowRoot;
}
const Pn = /* @__PURE__ */ new Set(["inline", "contents"]);
function dt(t) {
const {
overflow: e,
overflowX: n,
overflowY: o,
display: s
} = F(t);
return /auto|scroll|overlay|hidden|clip/.test(e + o + n) && !Pn.has(s);
}
const Ln = /* @__PURE__ */ new Set(["table", "td", "th"]);
function kn(t) {
return Ln.has(rt(t));
}
const Tn = [":popover-open", ":modal"];
function St(t) {
return Tn.some((e) => {
try {
return t.matches(e);
} catch {
return !1;
}
});
}
const Cn = ["transform", "translate", "scale", "rotate", "perspective"], Dn = ["transform", "translate", "scale", "rotate", "perspective", "filter"], Hn = ["paint", "layout", "strict", "content"];
function Bt(t) {
const e = _t(), n = W(t) ? F(t) : t;
return Cn.some((o) => n[o] ? n[o] !== "none" : !1) || (n.containerType ? n.containerType !== "normal" : !1) || !e && (n.backdropFilter ? n.backdropFilter !== "none" : !1) || !e && (n.filter ? n.filter !== "none" : !1) || Dn.some((o) => (n.willChange || "").includes(o)) || Hn.some((o) => (n.contain || "").includes(o));
}
function Wn(t) {
let e = q(t);
for (; $(e) && !ot(e); ) {
if (Bt(e))
return e;
if (St(e))
return null;
e = q(e);
}
return null;
}
function _t() {
return typeof CSS > "u" || !CSS.supports ? !1 : CSS.supports("-webkit-backdrop-filter", "none");
}
const Fn = /* @__PURE__ */ new Set(["html", "body", "#document"]);
function ot(t) {
return Fn.has(rt(t));
}
function F(t) {
return k(t).getComputedStyle(t);
}
function Ot(t) {
return W(t) ? {
scrollLeft: t.scrollLeft,
scrollTop: t.scrollTop
} : {
scrollLeft: t.scrollX,
scrollTop: t.scrollY
};
}
function q(t) {
if (rt(t) === "html")
return t;
const e = (
// Step into the shadow DOM of the parent of a slotted node.
t.assignedSlot || // DOM Element detected.
t.parentNode || // ShadowRoot detected.
Zt(t) && t.host || // Fallback.
z(t)
);
return Zt(e) ? e.host : e;
}
function Oe(t) {
const e = q(t);
return ot(e) ? t.ownerDocument ? t.ownerDocument.body : t.body : $(e) && dt(e) ? e : Oe(e);
}
function lt(t, e, n) {
var o;
e === void 0 && (e = []), n === void 0 && (n = !0);
const s = Oe(t), i = s === ((o = t.ownerDocument) == null ? void 0 : o.body), r = k(s);
if (i) {
const a = Dt(r);
return e.concat(r, r.visualViewport || [], dt(s) ? s : [], a && n ? lt(a) : []);
}
return e.concat(s, lt(s, [], n));
}
function Dt(t) {
return t.parent && Object.getPrototypeOf(t.parent) ? t.frameElement : null;
}
function Ae(t) {
const e = F(t);
let n = parseFloat(e.width) || 0, o = parseFloat(e.height) || 0;
const s = $(t), i = s ? t.offsetWidth : n, r = s ? t.offsetHeight : o, a = wt(n) !== i || wt(o) !== r;
return a && (n = i, o = r), {
width: n,
height: o,
$: a
};
}
function Ut(t) {
return W(t) ? t : t.contextElement;
}
function tt(t) {
const e = Ut(t);
if (!$(e))
return V(1);
const n = e.getBoundingClientRect(), {
width: o,
height: s,
$: i
} = Ae(e);
let r = (i ? wt(n.width) : n.width) / o, a = (i ? wt(n.height) : n.height) / s;
return (!r || !Number.isFinite(r)) && (r = 1), (!a || !Number.isFinite(a)) && (a = 1), {
x: r,
y: a
};
}
const Mn = /* @__PURE__ */ V(0);
function Re(t) {
const e = k(t);
return !_t() || !e.visualViewport ? Mn : {
x: e.visualViewport.offsetLeft,
y: e.visualViewport.offsetTop
};
}
function Nn(t, e, n) {
return e === void 0 && (e = !1), !n || e && n !== k(t) ? !1 : e;
}
function G(t, e, n, o) {
e === void 0 && (e = !1), n === void 0 && (n = !1);
const s = t.getBoundingClientRect(), i = Ut(t);
let r = V(1);
e && (o ? W(o) && (r = tt(o)) : r = tt(t));
const a = Nn(i, n, o) ? Re(i) : V(0);
let c = (s.left + a.x) / r.x, l = (s.top + a.y) / r.y, u = s.width / r.x, h = s.height / r.y;
if (i) {
const g = k(i), f = o && W(o) ? k(o) : o;
let d = g, y = Dt(d);
for (; y && o && f !== d; ) {
const m = tt(y), v = y.getBoundingClientRect(), b = F(y), w = v.left + (y.clientLeft + parseFloat(b.paddingLeft)) * m.x, A = v.top + (y.clientTop + parseFloat(b.paddingTop)) * m.y;
c *= m.x, l *= m.y, u *= m.x, h *= m.y, c += w, l += A, d = k(y), y = Dt(d);
}
}
return yt({
width: u,
height: h,
x: c,
y: l
});
}
function Kt(t, e) {
const n = Ot(t).scrollLeft;
return e ? e.left + n : G(z(t)).left + n;
}
function Ee(t, e, n) {
n === void 0 && (n = !1);
const o = t.getBoundingClientRect(), s = o.left + e.scrollLeft - (n ? 0 : (
// RTL <body> scrollbar.
Kt(t, o)
)), i = o.top + e.scrollTop;
return {
x: s,
y: i
};
}
function Vn(t) {
let {
elements: e,
rect: n,
offsetParent: o,
strategy: s
} = t;
const i = s === "fixed", r = z(o), a = e ? St(e.floating) : !1;
if (o === r || a && i)
return n;
let c = {
scrollLeft: 0,
scrollTop: 0
}, l = V(1);
const u = V(0), h = $(o);
if ((h || !h && !i) && ((rt(o) !== "body" || dt(r)) && (c = Ot(o)), $(o))) {
const f = G(o);
l = tt(o), u.x = f.x + o.clientLeft, u.y = f.y + o.clientTop;
}
const g = r && !h && !i ? Ee(r, c, !0) : V(0);
return {
width: n.width * l.x,
height: n.height * l.y,
x: n.x * l.x - c.scrollLeft * l.x + u.x + g.x,
y: n.y * l.y - c.scrollTop * l.y + u.y + g.y
};
}
function $n(t) {
return Array.from(t.getClientRects());
}
function zn(t) {
const e = z(t), n = Ot(t), o = t.ownerDocument.body, s = Q(e.scrollWidth, e.clientWidth, o.scrollWidth, o.clientWidth), i = Q(e.scrollHeight, e.clientHeight, o.scrollHeight, o.clientHeight);
let r = -n.scrollLeft + Kt(t);
const a = -n.scrollTop;
return F(o).direction === "rtl" && (r += Q(e.clientWidth, o.clientWidth) - s), {
width: s,
height: i,
x: r,
y: a
};
}
function Bn(t, e) {
const n = k(t), o = z(t), s = n.visualViewport;
let i = o.clientWidth, r = o.clientHeight, a = 0, c = 0;
if (s) {
i = s.width, r = s.height;
const l = _t();
(!l || l && e === "fixed") && (a = s.offsetLeft, c = s.offsetTop);
}
return {
width: i,
height: r,
x: a,
y: c
};
}
function _n(t, e) {
const n = G(t, !0, e === "fixed"), o = n.top + t.clientTop, s = n.left + t.clientLeft, i = $(t) ? tt(t) : V(1), r = t.clientWidth * i.x, a = t.clientHeight * i.y, c = s * i.x, l = o * i.y;
return {
width: r,
height: a,
x: c,
y: l
};
}
function te(t, e, n) {
let o;
if (e === "viewport")
o = Bn(t, n);
else if (e === "document")
o = zn(z(t));
else if (W(e))
o = _n(e, n);
else {
const s = Re(t);
o = {
x: e.x - s.x,
y: e.y - s.y,
width: e.width,
height: e.height
};
}
return yt(o);
}
function Pe(t, e) {
const n = q(t);
return n === e || !W(n) || ot(n) ? !1 : F(n).position === "fixed" || Pe(n, e);
}
function Un(t, e) {
const n = e.get(t);
if (n)
return n;
let o = lt(t, [], !1).filter((a) => W(a) && rt(a) !== "body"), s = null;
const i = F(t).position === "fixed";
let r = i ? q(t) : t;
for (; W(r) && !ot(r); ) {
const a = F(r), c = Bt(r);
!c && a.position === "fixed" && (s = null), (i ? !c && !s : !c && a.position === "static" && !!s && ["absolute", "fixed"].includes(s.position) || dt(r) && !c && Pe(t, r)) ? o = o.filter((u) => u !== r) : s = a, r = q(r);
}
return e.set(t, o), o;
}
function Kn(t) {
let {
element: e,
boundary: n,
rootBoundary: o,
strategy: s
} = t;
const r = [...n === "clippingAncestors" ? St(e) ? [] : Un(e, this._c) : [].concat(n), o], a = r[0], c = r.reduce((l, u) => {
const h = te(e, u, s);
return l.top = Q(h.top, l.top), l.right = nt(h.right, l.right), l.bottom = nt(h.bottom, l.bottom), l.left = Q(h.left, l.left), l;
}, te(e, a, s));
return {
width: c.right - c.left,
height: c.bottom - c.top,
x: c.left,
y: c.top
};
}
function jn(t) {
const {
width: e,
height: n
} = Ae(t);
return {
width: e,
height: n
};
}
function In(t, e, n) {
const o = $(e), s = z(e), i = n === "fixed", r = G(t, !0, i, e);
let a = {
scrollLeft: 0,
scrollTop: 0
};
const c = V(0);
function l() {
c.x = Kt(s);
}
if (o || !o && !i)
if ((rt(e) !== "body" || dt(s)) && (a = Ot(e)), o) {
const f = G(e, !0, i, e);
c.x = f.x + e.clientLeft, c.y = f.y + e.clientTop;
} else s && l();
i && !o && s && l();
const u = s && !o && !i ? Ee(s, a) : V(0), h = r.left + a.scrollLeft - c.x - u.x, g = r.top + a.scrollTop - c.y - u.y;
return {
x: h,
y: g,
width: r.width,
height: r.height
};
}
function Rt(t) {
return F(t).position === "static";
}
function ee(t, e) {
if (!$(t) || F(t).position === "fixed")
return null;
if (e)
return e(t);
let n = t.offsetParent;
return z(t) === n && (n = n.ownerDocument.body), n;
}
function Le(t, e) {
const n = k(t);
if (St(t))
return n;
if (!$(t)) {
let s = q(t);
for (; s && !ot(s); ) {
if (W(s) && !Rt(s))
return s;
s = q(s);
}
return n;
}
let o = ee(t, e);
for (; o && kn(o) && Rt(o); )
o = ee(o, e);
return o && ot(o) && Rt(o) && !Bt(o) ? n : o || Wn(t) || n;
}
const Yn = async function(t) {
const e = this.getOffsetParent || Le, n = this.getDimensions, o = await n(t.floating);
return {
reference: In(t.reference, await e(t.floating), t.strategy),
floating: {
x: 0,
y: 0,
width: o.width,
height: o.height
}
};
};
function qn(t) {
return F(t).direction === "rtl";
}
const Xn = {
convertOffsetParentRelativeRectToViewportRelativeRect: Vn,
getDocumentElement: z,
getClippingRect: Kn,
getOffsetParent: Le,
getElementRects: Yn,
getClientRects: $n,
getDimensions: jn,
getScale: tt,
isElement: W,
isRTL: qn
};
function ke(t, e) {
return t.x === e.x && t.y === e.y && t.width === e.width && t.height === e.height;
}
function Qn(t, e) {
let n = null, o;
const s = z(t);
function i() {
var a;
clearTimeout(o), (a = n) == null || a.disconnect(), n = null;
}
function r(a, c) {
a === void 0 && (a = !1), c === void 0 && (c = 1), i();
const l = t.getBoundingClientRect(), {
left: u,
top: h,
width: g,
height: f
} = l;
if (a || e(), !g || !f)
return;
const d = pt(h), y = pt(s.clientWidth - (u + g)), m = pt(s.clientHeight - (h + f)), v = pt(u), w = {
rootMargin: -d + "px " + -y + "px " + -m + "px " + -v + "px",
threshold: Q(0, nt(1, c)) || 1
};
let A = !0;
function O(T) {
const E = T[0].intersectionRatio;
if (E !== c) {
if (!A)
return r();
E ? r(!1, E) : o = setTimeout(() => {
r(!1, 1e-7);
}, 1e3);
}
E === 1 && !ke(l, t.getBoundingClientRect()) && r(), A = !1;
}
try {
n = new IntersectionObserver(O, {
...w,
// Handle <iframe>s
root: s.ownerDocument
});
} catch {
n = new IntersectionObserver(O, w);
}
n.observe(t);
}
return r(!0), i;
}
function Jn(t, e, n, o) {
o === void 0 && (o = {});
const {
ancestorScroll: s = !0,
ancestorResize: i = !0,
elementResize: r = typeof ResizeObserver == "function",
layoutShift: a = typeof IntersectionObserver == "function",
animationFrame: c = !1
} = o, l = Ut(t), u = s || i ? [...l ? lt(l) : [], ...lt(e)] : [];
u.forEach((v) => {
s && v.addEventListener("scroll", n, {
passive: !0
}), i && v.addEventListener("resize", n);
});
const h = l && a ? Qn(l, n) : null;
let g = -1, f = null;
r && (f = new ResizeObserver((v) => {
let [b] = v;
b && b.target === l && f && (f.unobserve(e), cancelAnimationFrame(g), g = requestAnimationFrame(() => {
var w;
(w = f) == null || w.observe(e);
})), n();
}), l && !c && f.observe(l), f.observe(e));
let d, y = c ? G(t) : null;
c && m();
function m() {
const v = G(t);
y && !ke(y, v) && n(), y = v, d = requestAnimationFrame(m);
}
return n(), () => {
var v;
u.forEach((b) => {
s && b.removeEventListener("scroll", n), i && b.removeEventListener("resize", n);
}), h?.(), (v = f) == null || v.disconnect(), f = null, c && cancelAnimationFrame(d);
};
}
const Gn = Rn, Zn = En, ne = Sn, to = bn, eo = (t, e, n) => {
const o = /* @__PURE__ */ new Map(), s = {
platform: Xn,
...n
}, i = {
...s.platform,
_c: o
};
return xn(t, e, {
...s,
platform: i
});
}, ko = [
"top",
"top-start",
"top-end",
"right",
"right-start",
"right-end",
"bottom",
"bottom-start",
"bottom-end",
"left",
"left-start",
"left-end"
], To = (t, e = { isOpen: !1 }) => {
const n = [];
let o = null;
const s = C.deriveProp(e.isOpen);
function i(a) {
o = a, s.set(!0);
}
function r() {
s.set(!1), n.forEach((a) => a()), n.length = 0;
}
return Y(
t(i, r),
de(
s,
() => Y(
o?.onClickOutside != null ? rn(o.onClickOutside) : null,
_(
(a) => fe(
"body",
Et.div(
_((c) => {
c.style.position = "absolute";
const l = typeof o?.target == "string" ? a.querySelector(
o.target
) : o?.target ?? a;
if (l == null)
throw new Error(`Target not found: ${o?.target}`);
let u = null;
const h = C.toSignal(o?.mainAxisOffset ?? 0), g = C.toSignal(
o?.crossAxisOffset ?? 0
), f = C.toSignal(
/* c8 ignore next 3 */
o?.placement ?? "top"
), d = C.toSignal(
o?.arrowPadding ?? 0
), y = o?.arrow, m = M({
centerOffset: 0,
alignmentOffset: 0,
containerWidth: 0,
containerHeight: 0,
x: void 0,
y: void 0
});
async function v() {
const w = [
ne(),
Gn({
mainAxis: h.get(),
crossAxis: g.get()
}),
Zn(),
ne()
];
y != null && u != null && w.push(
to({
element: u,
padding: d.get()
})
);
const A = await eo(l, c, {
placement: f.get(),
strategy: "absolute",
middleware: w
}), { x: O, y: T, middlewareData: E } = A;
if (c.style.top = `${T}px`, c.style.left = `${O}px`, u != null && E.arrow != null) {
const {
x: U,
y: p,
centerOffset: x,
alignmentOffset: S
} = E.arrow;
m.set({
x: U,
y: p,
centerOffset: x,
alignmentOffset: S,
containerWidth: c.offsetWidth,
containerHeight: c.offsetHeight
});
}
}
const b = We(
h,
g,
f
)(v);
return Y(
o?.content,
o?.arrow != null ? Et.div(
o?.arrow(
Mt(
m,
f
)(
(w, A) => ({
...w,
placement: A
})
)
),
_((w) => {
u = w, v();
})
) : null,
// arrowSignal is automatically disposed by the scope
N(
Jn(l, c, v),
b
)
);
})
)
)
)
)
)
);
}, no = ({
request: t,
load: e,
convertError: n,
onSuccess: o,
onError: s,
onSettled: i
}) => {
let r;
const a = M(R.notAsked), c = a.map(
(m) => R.isSuccess(m) ? m.value : void 0
), l = a.map(
(m) => R.isFailure(m) ? m.error : void 0
), u = a.map((m) => R.isLoading(m)), h = () => {
r?.abort(), r = void 0;
}, g = (m) => {
h(), a.set(m ?? R.notAsked);
}, f = async (m) => {
h(), r = new AbortController();
const v = r.signal, b = a.get();
a.set(R.loading(R.getOrUndefined(b)));
try {
const w = await e({ request: m, abortSignal: v, previous: b });
await Promise.resolve(), r = void 0, a.set(R.success(w)), o?.(w, m);
} catch (w) {
r = void 0, a.set(R.failure(n(w))), s?.(n(w), m);
}
i?.(a.get(), m);
}, d = () => f(C.get(t)), y = () => {
r?.abort(), r = void 0, a.dispose();
};
return a.onDispose(C.on(t, f)), {
status: a,
value: c,
error: l,
loading: u,
cancel: g,
reload: d,
dispose: y
};
}, oo = (t, e) => {
const { status: n, dispose: o, reload: s } = t, { pending: i, failure: r, success: a } = e;
return Y(
N(o),
we(n, {
loading: i != null ? (c) => i({ previous: c, reload: s, cancel: t.cancel }) : void 0,
failure: r != null ? (c) => r({ error: c, reload: s }) : void 0,
success: (c) => a({ value: c, reload: s })
})
);
}, Co = ({
request: t,
load: e,
convertError: n = (l) => l,
onSuccess: o,
onError: s,
onSettled: i,
success: r,
pending: a,
failure: c
}) => {
const l = no({
request: t,
load: e,
convertError: n,
onSuccess: o,
onError: s,
onSettled: i
});
return oo(l, { success: r, pending: a, failure: c });
}, so = (t, e) => {
if (typeof e == "function")
return so(t, { success: e });
const n = e.failure ?? ((s) => (s.on(console.error), s.map((i) => `Error: ${i}`))), o = e.success;
return ue(C.toSignal(t), {
Success: (s) => o(s.$.value),
Failure: (s) => n(s.$.error)
});
}, Do = () => le.focus((t) => t.target?.select());
class At {
/**
* Creates a new Rect instance.
*
* @param left - The x-coordinate of the left edge
* @param top - The y-coordinate of the top edge
* @param width - The width of the rectangle
* @param height - The height of the rectangle
*
* @example
* ```typescript
* const rect = new Rect(10, 20, 100, 50);
* console.log(rect.left); // 10
* console.log(rect.top); // 20
* console.log(rect.width); // 100
* console.log(rect.height); // 50
* ```
*/
constructor(e, n, o, s, i, r) {
this.left = e, this.top = n, this.width = o, this.height = s, this.localLeft = i, this.localTop = r;
}
/**
* Creates a new Rect instance using an object with optional properties.
*
* This factory method provides a convenient way to create rectangles with
* default values for any unspecified properties.
*
* @param options - Object containing rectangle properties
* @param options.left - The x-coordinate of the left edge (default: 0)
* @param options.top - The y-coordinate of the top edge (default: 0)
* @param options.width - The width of the rectangle (default: 0)
* @param options.height - The height of the rectangle (default: 0)
* @returns A new Rect instance
*
* @example
* ```typescript
* // Create a rectangle at origin with no size
* const emptyRect = Rect.of({});
*
* // Create a rectangle with only position
* const positioned = Rect.of({ left: 10, top: 20 });
*
* // Create a rectangle with all properties
* const fullRect = Rect.of({ left: 10, top: 20, width: 100, height: 50 });
* ```
*/
static of({
left: e = 0,
top: n = 0,
width: o = 0,
height: s = 0,
localLeft: i = 0,
localTop: r = 0
}) {
return new At(e, n, o, s, i, r);
}
/**
* Gets the x-coordinate of the right edge of the rectangle.
*
* @returns The right edge position (left + width)
*
* @example
* ```typescript
* const rect = new Rect(10, 20, 100, 50);
* console.log(rect.right); // 110
* ```
*/
get right() {
return this.left + this.width;
}
/**
* Gets the y-coordinate of the bottom edge of the rectangle.
*
* @returns The bottom edge position (top + height)
*
* @example
* ```typescript
* const rect = new Rect(10, 20, 100, 50);
* console.log(rect.bottom); // 70
* ```
*/
get bottom() {
return this.top + this.height;
}
/**
* Gets the center point of the rectangle.
*
* @returns An object with x and y coordinates of the center point
*
* @example
* ```typescript
* const rect = new Rect(10, 20, 100, 50);
* const center = rect.center;
* console.log(center.x); // 60 (left + width/2)
* console.log(center.y); // 45 (top + height/2)
* ```
*/
get center() {
return {
x: this.left + this.width / 2,
y: this.top + this.height / 2
};
}
/**
* Gets the center point of the rectangle relative to the parent.
*
* @returns An object with x and y coordinates of the center point
*
* @example
* ```typescript
* const rect = new Rect(10, 20, 100, 50, 5, 10);
* const localCenter = rect.localCenter;
* console.log(localCenter.x); // 55 (localLeft + width/2)
* console.log(localCenter.y); // 65 (localTop + height/2)
* ```
*/
get localCenter() {
return {
x: this.localLeft + this.width / 2,
y: this.localTop + this.height / 2
};
}
/**
* Gets the bottom edge of the rectangle relative to the parent.
*
* @returns The bottom edge position (localTop + height)
*
* @example
* ```typescript
* const rect = new Rect(10, 20, 100, 50, 5, 10);
* console.log(rect.localBottom); // 60 (localTop + height)
* ```
*/
get localBottom() {
return this.localTop + this.height;
}
/**
* Gets the right edge of the rectangle relative to the parent.
*
* @returns The right edge position (localLeft + width)
*
* @example
* ```typescript
* const rect = new Rect(10, 20, 100, 50, 5, 10);
* console.log(rect.localRight); // 105 (localLeft + width)
* ```
*/
get localRight() {
return this.localLeft + this.width;
}
/**
* Gets the size dimensions of the rectangle.
*
* @returns An object containing width and height properties
*
* @example
* ```typescript
* const rect = new Rect(10, 20, 100, 50);
* const size = rect.size;