@harmonics/lattice-ui 0.8.0 → 0.9.0

package/dist/elements-LJqjxdbt.js

@@ -0,0 +1,1129 @@
+import { A as e, D as t, E as n, M as r, N as i, O as a, P as o, S as s, T as c, a as l, c as u, d, f, g as p, h as m, j as h, k as g, l as _, m as v, n as y, o as ee, p as b, s as te, t as ne, u as re, v as ie, w as x, x as S, y as C } from "./woods-S4dnVPib.js";
+import { L as ae, S as oe, x as se, z as ce } from "./hexes-DwdbCYSF.js";
+//#region src/faceLattice.ts
+var w = Math.sqrt(3), T = (e) => `M${e.map((e) => `${Math.round(e.x * 100) / 100} ${Math.round(e.y * 100) / 100}`).join("L")}Z`;
+function le(e, t = {
+	x: 0,
+	y: 0
+}) {
+	let n = e.x - t.x, r = e.y - t.y, i = [
+		0,
+		60,
+		120
+	].map((e) => {
+		let t = e * Math.PI / 180;
+		return Math.abs(n * Math.cos(t) + r * Math.sin(t));
+	});
+	return Math.max(...i) / (w / 2);
+}
+var ue = /* @__PURE__ */ new Map();
+function de(e) {
+	let t = ue.get(e);
+	if (t) return t;
+	let n = 120 / e, r = n * w / 2, i = (e, t) => ({
+		x: r * t,
+		y: n * e + n / 2 * t
+	}), a = [];
+	for (let t = -2 * e; t <= 2 * e; t++) for (let n = -3 * e; n <= 3 * e; n++) for (let e of [0, 1]) {
+		let r = e === 0 ? [
+			i(n, t),
+			i(n, t + 1),
+			i(n + 1, t)
+		] : [
+			i(n, t + 1),
+			i(n + 1, t + 1),
+			i(n + 1, t)
+		], o = {
+			x: r.reduce((e, t) => e + t.x, 0) / 3 / 120,
+			y: r.reduce((e, t) => e + t.y, 0) / 3 / 120
+		};
+		le(o) < .999 && a.push({
+			corners: r,
+			mid: o,
+			i: n,
+			j: t,
+			k: e
+		});
+	}
+	return ue.set(e, a), a;
+}
+var E = 1 / 16, D = () => E * w / 2, fe = (e) => {
+	let t = Math.round(e.x / D()), n = Math.round((e.y - E / 2 * t) / E);
+	return {
+		x: D() * t,
+		y: E * n + E / 2 * t
+	};
+}, O = (e, t) => (n) => le(n, fe(e)) < Math.max(1, Math.round(t / E)) * E - 1e-6, k = (e, t, n) => (r) => ((r.x - e.x) / t) ** 2 + ((r.y - e.y) / n) ** 2 < 1, A = (e, t) => (n) => e.slice(1).some((r, i) => {
+	let a = e[i], o = r.x - a.x, s = r.y - a.y, c = Math.max(0, Math.min(1, ((n.x - a.x) * o + (n.y - a.y) * s) / (o * o + s * s)));
+	return Math.hypot(n.x - (a.x + c * o), n.y - (a.y + c * s)) < t;
+}), j = (e, t, n, r = 16) => Array.from({ length: r + 1 }, (i, a) => {
+	let o = a / r, s = 1 - o;
+	return {
+		x: s * s * e.x + 2 * s * o * t.x + o * o * n.x,
+		y: s * s * e.y + 2 * s * o * t.y + o * o * n.y
+	};
+}), M = (...e) => (t) => e.every((e) => e(t)), N = (e) => (t) => !e(t), P = (...e) => (t) => e.some((e) => e(t)), F = (e) => (t) => {
+	let n = e.map(fe);
+	return n.slice(1).some((e, r) => {
+		let i = n[r], a = e.x - i.x, o = e.y - i.y, s = ((t.x - i.x) * a + (t.y - i.y) * o) / (a * a + o * o);
+		if (s < 0 || s > 1) return !1;
+		let c = {
+			x: t.x - (i.x + s * a),
+			y: t.y - (i.y + s * o)
+		};
+		return (Math.abs(a) < 1e-9 ? c.x * Math.sign(i.x || 1) > 0 : c.y > 0) && Math.hypot(c.x, c.y) < D() * .999;
+	});
+}, pe = (e, t) => {
+	let n = t * Math.tan(Math.PI / 6);
+	return [
+		{
+			x: e.x - t,
+			y: e.y - n
+		},
+		e,
+		{
+			x: e.x + t,
+			y: e.y - n
+		}
+	];
+}, I = (e) => P(e(-1), e(1)), L = -.18, R = .34, z = (e) => ({
+	x: e * R,
+	y: L
+}), B = (e) => (t) => Math.hypot(t.x - e.x, t.y - e.y) < E * .58, V = (e, t, n = 0) => (r) => e({
+	x: r.x - n * D(),
+	y: r.y - t * E - n * E / 2
+}), H = (e, t, n = 0) => e.map(([e, r]) => [e, V(r, t, n)]), me = (e, t, n = 0) => e > 0 && (e + n) % t < .16, U = (e, t) => e % t / t, W = (e, t) => Math.floor(e / t) % 2, he = (e, t = .04) => F(pe({
+	x: e * R,
+	y: L + t
+}, .14)), ge = (e, t) => P(O({
+	x: e.x - .07 * t,
+	y: e.y - .04 * t
+}, .09 * t), O({
+	x: e.x + .07 * t,
+	y: e.y - .04 * t
+}, .09 * t), (n) => n.y > e.y - .04 * t && n.y < e.y + .2 * t && Math.abs(n.x - e.x) < .16 * t * (1 - (n.y - e.y + .04 * t) / (.24 * t))), G = [
+	{
+		name: "Happy",
+		idle: "Bobs, blinks, cheeks glow",
+		at: (e) => {
+			let t = me(e, 3.4, 1), n = e > 0 && U(e, 2.4) < .5 ? .11 : .09;
+			return H([
+				["ink", I((e) => t ? he(e) : O(z(e), .15))],
+				["glint", I((e) => t ? () => !1 : B({
+					x: e * R + .05,
+					y: -.22999999999999998
+				}))],
+				["ink", A(j({
+					x: -.4,
+					y: .2
+				}, {
+					x: 0,
+					y: .5
+				}, {
+					x: .4,
+					y: .2
+				}), .045)],
+				["blush", I((e) => O({
+					x: e * .6,
+					y: .1
+				}, n))]
+			], e > 0 && U(e, 1.2) < .5 ? -1 : 0);
+		}
+	},
+	{
+		name: "Laughing",
+		idle: "Shakes with each ha",
+		at: (e) => {
+			let t = e > 0 && U(e, 1.8) < .6 ? W(e, .12) : 0, n = t ? .04 : 0;
+			return H([
+				["ink", I((e) => A(j({
+					x: e * R - .13,
+					y: -.12
+				}, {
+					x: e * R,
+					y: -.36
+				}, {
+					x: e * R + .13,
+					y: -.12
+				}), .04))],
+				["ink", M(k({
+					x: 0,
+					y: .16
+				}, .42, .36 + n), (e) => e.y > .16)],
+				["tongue", M(k({
+					x: 0,
+					y: .16
+				}, .42, .36 + n), k({
+					x: 0,
+					y: .5 + n
+				}, .22, .12))],
+				["glint", M(k({
+					x: 0,
+					y: .16
+				}, .42, .36), (e) => e.y > .16 && e.y < .22)],
+				["blush", I((e) => O({
+					x: e * .62,
+					y: .06
+				}, .09))]
+			], -t);
+		}
+	},
+	{
+		name: "Sad",
+		idle: "A tear runs down; the lip trembles",
+		at: (e) => {
+			let t = me(e, 4.2, 2), n = .06 + (e > 0 ? U(e, 2) : 0) * .5, r = e > 0 ? W(e, .2) : 0;
+			return [
+				["ink", I((e) => t ? he(e) : O(z(e), .13))],
+				["glint", I((e) => t ? () => !1 : B({
+					x: e * R + .04,
+					y: -.22
+				}))],
+				["ink", I((e) => A([{
+					x: e * .52,
+					y: -.36
+				}, {
+					x: e * .2,
+					y: -.46
+				}], .035))],
+				["ink", V(A(j({
+					x: -.3,
+					y: .46
+				}, {
+					x: 0,
+					y: .18
+				}, {
+					x: .3,
+					y: .46
+				}), .04), r)],
+				["tear", P(O({
+					x: -.34,
+					y: n
+				}, .06), O({
+					x: -.34,
+					y: n + .12
+				}, .08))]
+			];
+		}
+	},
+	{
+		name: "Surprised",
+		idle: "Eyes dart; brows jump",
+		at: (e) => {
+			let t = e > 0 ? [
+				0,
+				-1,
+				0,
+				1
+			][Math.floor(U(e, 3.2) * 4)] : 0, n = e > 0 && U(e, 1.6) < .18 ? -1 : 0;
+			return [
+				["ink", I((e) => M(O(z(e), .19), N(O(z(e), .14))))],
+				["ink", I((e) => V(O(z(e), .07), 0, t))],
+				["ink", I((e) => V(A(j({
+					x: e * .52,
+					y: -.42
+				}, {
+					x: e * .34,
+					y: -.58
+				}, {
+					x: e * .16,
+					y: -.44
+				}), .035), n))],
+				["ink", M(O({
+					x: 0,
+					y: .36
+				}, .17), N(O({
+					x: 0,
+					y: .36
+				}, .09)))]
+			];
+		}
+	},
+	{
+		name: "Angry",
+		idle: "Fumes and shakes",
+		at: (e) => {
+			let t = e > 0 && U(e, 2) < .4 ? W(e, .07) ? 1 : -1 : 0, n = +(e > 0 && U(e, 2) > .5), r = e > 0 ? U(e, 1) : -1, i = [
+				["ink", I((e) => M(O(z(e), .15), (t) => t.y > -.26 + .4 * (-e * (t.x - e * R))))],
+				["ink", I((e) => V(A([{
+					x: e * .58,
+					y: -.44
+				}, {
+					x: e * .12,
+					y: -.28
+				}], .045), n))],
+				["ink", A(j({
+					x: -.32,
+					y: .42
+				}, {
+					x: 0,
+					y: .3
+				}, {
+					x: .32,
+					y: .42
+				}), .045)]
+			];
+			return r >= 0 && i.push(["tear", I((e) => O({
+				x: e * (.5 + r * .04),
+				y: -.46 - r * .14
+			}, .05 + r * .03))]), H(i, 0, t);
+		}
+	},
+	{
+		name: "Worried",
+		idle: "Sweats; glances about",
+		at: (e) => {
+			let t = e > 0 ? [
+				0,
+				-1,
+				-1,
+				0,
+				1,
+				1
+			][Math.floor(U(e, 3) * 6)] : 0, n = e > 0 ? U(e, 2.2) : 0, r = e > 0 && W(e, .3) ? -1 : 1;
+			return [
+				["ink", I((e) => V(O(z(e), .14), 0, t))],
+				["glint", I((e) => V(B({
+					x: e * R + .04,
+					y: -.22999999999999998
+				}), 0, t))],
+				["ink", I((e) => A([{
+					x: e * .54,
+					y: -.38
+				}, {
+					x: e * .16,
+					y: -.5
+				}], .035))],
+				["ink", A(Array.from({ length: 9 }, (e, t) => ({
+					x: -.4 + t * .1,
+					y: .36 + (t % 2 == 0 ? .04 : -.04) * r
+				})), .035)],
+				["tear", P(O({
+					x: .66,
+					y: -.46 + n * .3
+				}, .06), O({
+					x: .66,
+					y: -.34 + n * .3
+				}, .08))]
+			];
+		}
+	},
+	{
+		name: "Sleepy",
+		idle: "Breathes in its bubble",
+		at: (e) => {
+			let t = e > 0 ? U(e, 3) : .3, n = t > .92, r = .13 + Math.sin(Math.PI * Math.min(1, t / .92)) * .09, i = e > 0 ? U(e, 2.4) : 0, a = [
+				["ink", I((e) => {
+					let t = pe({
+						x: e * R,
+						y: -.13
+					}, .16), n = Math.tan(Math.PI / 6), r = (t, r) => {
+						let i = e * (R + t), a = -.13 - t * n;
+						return F([{
+							x: i,
+							y: a + .02
+						}, {
+							x: i,
+							y: a + .02 + r
+						}]);
+					};
+					return P(F(t), r(.04, .05), r(.09, .06), r(.14, .05));
+				})],
+				["blush", I((e) => O({
+					x: e * .56,
+					y: .16
+				}, .09))],
+				["ink", M(O({
+					x: 0,
+					y: .42
+				}, .12), N(O({
+					x: 0,
+					y: .42
+				}, .06)))],
+				["tear", P(O({
+					x: .42,
+					y: -.44 - i * .1
+				}, .04), O({
+					x: .5,
+					y: -.58 - i * .1
+				}, .06))]
+			];
+			return n || a.push(["tear", M(O({
+				x: .2,
+				y: .18
+			}, r), N(O({
+				x: .2,
+				y: .18
+			}, r - .06)))]), a;
+		}
+	},
+	{
+		name: "Wink",
+		idle: "Winks again",
+		at: (e) => {
+			let t = e > 0 && U(e, 2.6) > .7 && U(e, 2.6) < .85, n = e > 0 && U(e, 2.6) < .3 ? .11 : .09;
+			return [
+				["ink", O(z(-1), .15)],
+				["glint", B({
+					x: -.34 + .05,
+					y: -.22999999999999998
+				})],
+				t ? ["ink", O(z(1), .15)] : ["ink", A(j({
+					x: .19000000000000003,
+					y: L
+				}, {
+					x: R,
+					y: -.3
+				}, {
+					x: .49,
+					y: L
+				}), .04)],
+				["ink", A(j({
+					x: -.3,
+					y: .32
+				}, {
+					x: .06,
+					y: .5
+				}, {
+					x: .38,
+					y: .22
+				}), .045)],
+				["blush", O({
+					x: .6,
+					y: .1
+				}, n)]
+			];
+		}
+	},
+	{
+		name: "Smitten",
+		idle: "Hearts beat",
+		at: (e) => {
+			let t = e > 0 ? U(e, 1.1) : .9, n = t < .12 || t > .24 && t < .36 ? 1.3 : 1;
+			return [["blush", I((e) => ge({
+				x: e * R,
+				y: L
+			}, n))], ["ink", A(j({
+				x: -.34,
+				y: .24
+			}, {
+				x: 0,
+				y: .5
+			}, {
+				x: .34,
+				y: .24
+			}), .045)]];
+		}
+	}
+], _e = (e, t) => {
+	let n = "plate";
+	for (let [r, i] of e) i(t) && (n = r);
+	return n;
+}, ve = (e) => e.k === 0 ? "right" : "left";
+function ye(e, t, n) {
+	let r = de(t);
+	E = 1 / t;
+	let i = r.map((t) => _e(e, t.mid)), a = r.map(() => "top"), o = Math.max(1, Math.round(.035 / E)), s = (t, n) => _e(e, {
+		x: t.mid.x,
+		y: t.mid.y - n * E
+	});
+	return r.forEach((e, t) => {
+		let r = i[t];
+		if (n === "raised" && r === "plate") for (let n = 1; n <= o; n++) {
+			let r = s(e, n);
+			if (r !== "plate" && r !== "glint") {
+				i[t] = r, a[t] = ve(e);
+				break;
+			}
+		}
+		else if (n === "carved" && r !== "plate" && r !== "glint") {
+			for (let n = 1; n <= o; n++) if (s(e, n) === "plate") {
+				a[t] = ve(e);
+				break;
+			}
+		} else if (n === "cubes" && r !== "plate" && r !== "glint") {
+			let n = (e.k === 0 ? [
+				[e.i, e.j],
+				[e.i, e.j + 1],
+				[e.i + 1, e.j]
+			] : [
+				[e.i, e.j + 1],
+				[e.i + 1, e.j + 1],
+				[e.i + 1, e.j]
+			]).find(([e, t]) => ((t - e) % 3 + 3) % 3 == 0), r = {
+				x: w / 2 * E * n[1],
+				y: E * n[0] + E / 2 * n[1]
+			}, i = (Math.atan2(e.mid.x - r.x, -(e.mid.y - r.y)) * 180 / Math.PI + 360) % 360;
+			a[t] = i < 60 || i >= 300 ? "top" : i < 180 ? "right" : "left";
+		}
+	}), {
+		inks: i,
+		shades: a
+	};
+}
+function be(e, t, n) {
+	let r = /* @__PURE__ */ new Map();
+	return e.forEach((e, i) => {
+		let a = t[i], o = n?.[i] ?? "top", s = `${a}:${o}`, c = r.get(s) ?? {
+			ink: a,
+			shade: o,
+			d: []
+		};
+		c.d.push(T(e.corners)), r.set(s, c);
+	}), [...r.values()].map((e) => ({
+		ink: e.ink,
+		shade: e.shade,
+		d: e.d.join("")
+	}));
+}
+//#endregion
+//#region src/faceDrawing.tsx
+var xe = /*#__PURE__*/ s("<svg><path class=facet></svg>", !1, !0, !1), Se = 16, Ce = 1400, we = 300, Te = 100;
+function Ee(e, t) {
+	let n = (e) => ({
+		x: e.x,
+		y: e.y - t
+	}), [, , r, i, a] = e;
+	return {
+		shade: T([
+			a,
+			i,
+			n(i),
+			n(a)
+		]),
+		shadow: T([
+			i,
+			r,
+			n(r),
+			n(i)
+		]),
+		top: T(e.map(n))
+	};
+}
+var De = {
+	happy: "Happy",
+	content: "Happy",
+	asleep: "Sleepy",
+	sad: "Sad",
+	distressed: "Worried",
+	puzzled: "Surprised",
+	relieved: "Laughing"
+}, K = (e) => G.find((t) => t.name.toLowerCase() === e.trim().toLowerCase()), Oe = (e) => K(De[e]) ?? G[0], ke = K("Laughing");
+function Ae(e, t) {
+	let n = ye(e.at(t), Se, "raised");
+	return be(de(Se), n.inks, n.shades);
+}
+function je(e) {
+	let t = p(), n = () => t() || (e.still?.() ?? !1), [s, c] = h(!1), l;
+	a(r(e.pulse, (e, t) => {
+		t === void 0 || e === t || n() || (c(!0), clearTimeout(l), l = setTimeout(() => c(!1), Ce));
+	}));
+	let [u, d] = h(0);
+	a(() => {
+		if (n()) {
+			d(0);
+			return;
+		}
+		if (!(e.shown?.() ?? !0)) return;
+		let t = performance.now() - o(u) * 1e3, r = performance.now(), a = requestAnimationFrame(function e(n) {
+			n - r >= Te && (r = n, d((n - t) / 1e3)), a = requestAnimationFrame(e);
+		});
+		i(() => cancelAnimationFrame(a));
+	}), i(() => clearTimeout(l));
+	let f = g(() => s() ? ke : e.expression()), m = g(() => Ae(f(), u())), [_, v] = h(), y;
+	return a(r(f, (e, t) => {
+		t && !n() && (v(Ae(t, u())), clearTimeout(y), y = setTimeout(() => v(void 0), we));
+	})), i(() => clearTimeout(y)), {
+		face: m,
+		leaving: _
+	};
+}
+function Me(n) {
+	return t(c, {
+		get each() {
+			return n.drawing;
+		},
+		children: (t) => (() => {
+			var n = xe();
+			return e((e) => {
+				var r = t().ink, i = t().shade, a = t().d;
+				return r !== e.e && S(n, "data-ink", e.e = r), i !== e.t && S(n, "data-shade", e.t = i), a !== e.a && S(n, "d", e.a = a), e;
+			}, {
+				e: void 0,
+				t: void 0,
+				a: void 0
+			}), n;
+		})()
+	});
+}
+//#endregion
+//#region src/elements/face.css?inline
+var Ne = ".face .plate-top{fill:var(--color-tree-raised);stroke:color-mix(in srgb, var(--color-tree-wood-0) 60%, var(--sky));stroke-width:var(--tree-rule-width);stroke-linejoin:round}.face .plate-shade{fill:color-mix(in srgb, var(--color-tree-wood-0) 45%, var(--sky))}.face .plate-shadow{fill:color-mix(in srgb, var(--color-tree-wood-0) 70%, var(--sky))}.face .facet{--ink:color-mix(in srgb, var(--color-tree-wood-0) 40%, var(--color-tree-ink));fill:var(--ink);stroke:var(--ink);stroke-width:var(--tree-rule-width);stroke-linejoin:round;vector-effect:non-scaling-stroke}.face .facet[data-ink=plate]{fill:none;stroke:color-mix(in srgb, var(--color-tree-wood-0) 14%, var(--color-tree-raised))}.face .facet[data-ink=glint]{--ink:var(--color-tree-raised)}.face .facet[data-ink=blush]{--ink:color-mix(in srgb, var(--color-tree-alert) 55%, var(--color-tree-raised))}.face .facet[data-ink=tear]{--ink:var(--color-tree-wood-2)}.face .facet[data-ink=tongue]{--ink:color-mix(in srgb, var(--color-tree-alert) 75%, var(--color-tree-raised))}.face .facet[data-shade=left]{fill:color-mix(in srgb, var(--ink) 72%, var(--color-tree-ink));stroke:color-mix(in srgb, var(--ink) 72%, var(--color-tree-ink))}.face .facet[data-shade=right]{fill:color-mix(in srgb, var(--ink) 48%, var(--color-tree-ink));stroke:color-mix(in srgb, var(--ink) 48%, var(--color-tree-ink))}.face .facet[data-ink=ink][data-shade=top]{fill:color-mix(in srgb, var(--color-tree-wood-0) 70%, var(--color-tree-ink));stroke:color-mix(in srgb, var(--color-tree-wood-0) 70%, var(--color-tree-ink))}.face .facet[data-ink=ink][data-shade=left]{fill:color-mix(in srgb, var(--color-tree-wood-0) 35%, var(--color-tree-ink));stroke:color-mix(in srgb, var(--color-tree-wood-0) 35%, var(--color-tree-ink))}.face .facet[data-ink=ink][data-shade=right]{fill:var(--color-tree-ink);stroke:var(--color-tree-ink)}.face .face-leaving{animation:.3s ease-in forwards face-sink}@keyframes face-sink{to{opacity:0;transform:translateY(var(--space-tree-2))}}@media (prefers-reduced-motion:reduce){.face .face-leaving{animation:none}}", Pe = /*#__PURE__*/ s("<svg class=face part=face><path class=plate-shade></path><path class=plate-shadow></path><path class=plate-top></path><g transform=\"translate(0 -10)\"><g>"), Fe = /*#__PURE__*/ s("<svg><g class=face-leaving></svg>", !1, !0, !1), Ie = "lattice-face", Le = Object.keys(De), Re = (e) => Le.includes(e), q = 10, J = 2, Y = 120 * w / 2, X = Ee([
+	{
+		x: 0,
+		y: -120
+	},
+	{
+		x: Y,
+		y: -60
+	},
+	{
+		x: Y,
+		y: 60
+	},
+	{
+		x: 0,
+		y: 120
+	},
+	{
+		x: -Y,
+		y: 60
+	},
+	{
+		x: -Y,
+		y: -60
+	}
+], q), Z = {
+	x: -Y - J,
+	y: -120 - q - J,
+	width: 2 * (Y + J),
+	height: 240 + q + 4
+}, ze = m(`${Ne}\n.plate-top { vector-effect: non-scaling-stroke; }`), Be = class r extends d {
+	static observedAttributes = [
+		"mood",
+		"expression",
+		"pulse",
+		"still",
+		"size",
+		"label",
+		"decorative"
+	];
+	inputs = r.observedAttributes;
+	moodSignal = h("happy");
+	expressionSignal = h("");
+	pulseSignal = h(0);
+	stillSignal = h(!1);
+	sizeSignal = h(96);
+	labelSignal = h("");
+	decorativeSignal = h(!1);
+	get mood() {
+		return this.moodSignal[0]();
+	}
+	set mood(e) {
+		let t = String(e ?? "").toLowerCase();
+		this.moodSignal[1](Re(t) ? t : "happy");
+	}
+	get expression() {
+		return this.expressionSignal[0]();
+	}
+	set expression(e) {
+		this.expressionSignal[1](String(e ?? ""));
+	}
+	get pulse() {
+		return this.pulseSignal[0]();
+	}
+	set pulse(e) {
+		this.pulseSignal[1](v(e, 0));
+	}
+	get still() {
+		return this.stillSignal[0]();
+	}
+	set still(e) {
+		this.stillSignal[1](b(e));
+	}
+	get size() {
+		return this.sizeSignal[0]();
+	}
+	set size(e) {
+		this.sizeSignal[1](Math.max(1, v(e, 96)));
+	}
+	get label() {
+		return this.labelSignal[0]();
+	}
+	set label(e) {
+		this.labelSignal[1](String(e ?? ""));
+	}
+	get decorative() {
+		return this.decorativeSignal[0]();
+	}
+	set decorative(e) {
+		this.decorativeSignal[1](b(e));
+	}
+	attributeChangedCallback(e, t, n) {
+		e === "still" || e === "decorative" ? Reflect.set(this, e, n) : Reflect.set(this, e, n ?? "");
+	}
+	sheet() {
+		return ze();
+	}
+	draw() {
+		let r = g(() => K(this.expression) ?? Oe(this.mood)), [a, o] = h(!0);
+		if (typeof IntersectionObserver < "u") {
+			let e = new IntersectionObserver((e) => {
+				let t = e.at(-1);
+				t && o(t.isIntersecting);
+			});
+			e.observe(this), i(() => e.disconnect());
+		}
+		let { face: s, leaving: c } = je({
+			expression: r,
+			pulse: () => this.pulse,
+			still: () => this.still,
+			shown: a
+		}), l = () => this.label || `A ${r().name.toLowerCase()} face`, u = this;
+		return (() => {
+			var r = Pe(), i = r.firstChild, a = i.nextSibling, o = a.nextSibling, d = o.nextSibling, f = d.firstChild;
+			return C(d, t(n, {
+				get when() {
+					return c();
+				},
+				children: (e) => (() => {
+					var n = Fe();
+					return C(n, t(Me, { get drawing() {
+						return e();
+					} })), n;
+				})()
+			}), f), C(f, t(Me, { get drawing() {
+				return s();
+			} })), e((e) => {
+				var t = u.size, n = u.size * Z.height / Z.width, s = `${Z.x} ${Z.y} ${Z.width} ${Z.height}`, c = u.decorative ? void 0 : "img", d = u.decorative ? void 0 : l(), f = u.decorative ? "true" : void 0, p = X.shade, m = X.shadow, h = X.top;
+				return t !== e.e && S(r, "width", e.e = t), n !== e.t && S(r, "height", e.t = n), s !== e.a && S(r, "viewBox", e.a = s), c !== e.o && S(r, "role", e.o = c), d !== e.i && S(r, "aria-label", e.i = d), f !== e.n && S(r, "aria-hidden", e.n = f), p !== e.s && S(i, "d", e.s = p), m !== e.h && S(a, "d", e.h = m), h !== e.r && S(o, "d", e.r = h), e;
+			}, {
+				e: void 0,
+				t: void 0,
+				a: void 0,
+				o: void 0,
+				i: void 0,
+				n: void 0,
+				s: void 0,
+				h: void 0,
+				r: void 0
+			}), r;
+		})();
+	}
+}, Ve = (e) => f(Ie, Be, e), He = /*#__PURE__*/ s("<svg viewBox=\"0 0 16 16\"aria-hidden=true>"), Ue = /*#__PURE__*/ s("<svg><path></svg>", !1, !0, !1);
+function We(n) {
+	return (() => {
+		var r = He();
+		return C(r, t(x, {
+			get each() {
+				return re(n.name, n.small);
+			},
+			children: (t) => (() => {
+				var n = Ue();
+				return e((e) => {
+					var r = `${t.part} ${t.look}`, i = t.part, a = t.d;
+					return r !== e.e && S(n, "class", e.e = r), i !== e.t && S(n, "part", e.t = i), a !== e.a && S(n, "d", e.a = a), e;
+				}, {
+					e: void 0,
+					t: void 0,
+					a: void 0
+				}), n;
+			})()
+		})), e(() => S(r, "class", `mark mark-${n.name}${n.small ? " small" : ""}`)), r;
+	})();
+}
+//#endregion
+//#region src/elements/icon.css?inline
+var Ge = ":host{width:var(--lattice-icon-size,var(--space-tree-4));height:var(--lattice-icon-size,var(--space-tree-4));container-type:size}span{width:100%;height:100%;display:block}svg{width:100%;height:100%}.mark{fill:none;stroke:currentColor;stroke-width:1.3px;stroke-linejoin:miter}.mark .fill{fill:currentColor}.mark .heavy{stroke-width:1.6px}.mark.small{display:none}@container (width<24px){.mark{stroke-width:1.6px;display:none}.mark.small{display:block}.mark .heavy{stroke-width:2.2px}}", Ke = /*#__PURE__*/ s("<span part=icon>"), qe = /*#__PURE__*/ s("<span part=icon role=img>"), Je = "lattice-icon", Ye = [
+	"shears",
+	"done",
+	"note",
+	"turn",
+	"glue",
+	"apart",
+	"bin",
+	"name",
+	"split",
+	"search"
+], Xe = (e) => Object.hasOwn(_, e), Ze = m(Ge), Qe = class r extends d {
+	static observedAttributes = ["name", "label"];
+	inputs = r.observedAttributes;
+	nameSignal = h("shears");
+	labelSignal = h("");
+	get name() {
+		return this.nameSignal[0]();
+	}
+	set name(e) {
+		let t = String(e ?? "").toLowerCase();
+		this.nameSignal[1](Xe(t) ? t : "shears");
+	}
+	get label() {
+		return this.labelSignal[0]();
+	}
+	set label(e) {
+		this.labelSignal[1](String(e ?? ""));
+	}
+	attributeChangedCallback(e, t, n) {
+		Reflect.set(this, e, n ?? "");
+	}
+	sheet() {
+		return Ze();
+	}
+	draw() {
+		let r = () => {
+			let e = this;
+			return [t(We, { get name() {
+				return e.name;
+			} }), t(We, {
+				get name() {
+					return e.name;
+				},
+				small: !0
+			})];
+		}, i = this;
+		return t(n, {
+			get when() {
+				return i.label;
+			},
+			get fallback() {
+				return (() => {
+					var e = Ke();
+					return C(e, r), e;
+				})();
+			},
+			children: (t) => (() => {
+				var n = qe();
+				return C(n, r), e(() => S(n, "aria-label", t())), n;
+			})()
+		});
+	}
+}, $e = (e) => f(Je, Qe, e), et = /*#__PURE__*/ s("<svg class=\"shape woods\"part=shape><g class=faces></g><path class=seams></path><g class=ring part=ring>"), tt = /*#__PURE__*/ s("<svg><path></svg>", !1, !0, !1), nt = /*#__PURE__*/ s("<svg><line></svg>", !1, !0, !1), rt = "lattice-shape", it = (e) => Object.hasOwn(y, e), at = m(`${ne}\n${u}`), ot = 4, st = !1, ct = class n extends d {
+	static observedAttributes = [
+		"shape",
+		"parts",
+		"tone",
+		"lift",
+		"scale",
+		"label",
+		"pressable",
+		"pressed",
+		"disabled"
+	];
+	inputs = n.observedAttributes;
+	shapeSignal = h("cell");
+	partsSignal = h();
+	toneSignal = h(0);
+	liftSignal = h(8);
+	scaleSignal = h(1);
+	labelSignal = h("");
+	pressableSignal = h(!1);
+	pressedSignal = h();
+	disabledSignal = h(!1);
+	get shape() {
+		return this.shapeSignal[0]();
+	}
+	set shape(e) {
+		let t = String(e ?? "").toLowerCase();
+		this.shapeSignal[1](it(t) ? t : "cell");
+	}
+	made;
+	get parts() {
+		let e = [
+			this.partsSignal[0](),
+			this.shape,
+			this.tone
+		];
+		if (!this.made || e.some((e, t) => e !== this.made?.from[t])) {
+			let [t, n, r] = e, i = t === void 0 ? y[n](r) : ee(t, r);
+			this.made = {
+				from: e,
+				parts: i
+			};
+		}
+		return this.made.parts;
+	}
+	set parts(e) {
+		this.partsSignal[1](() => e === null || e === "" ? void 0 : e);
+	}
+	get tone() {
+		return this.toneSignal[0]();
+	}
+	set tone(e) {
+		this.toneSignal[1](te(v(e, 0)));
+	}
+	get lift() {
+		return this.liftSignal[0]();
+	}
+	set lift(e) {
+		this.liftSignal[1](Math.max(0, v(e, 8)));
+	}
+	get scale() {
+		return this.scaleSignal[0]();
+	}
+	set scale(e) {
+		let t = v(e, 1);
+		this.scaleSignal[1](t > 0 ? t : 1);
+	}
+	get label() {
+		return this.labelSignal[0]();
+	}
+	set label(e) {
+		this.labelSignal[1](String(e ?? ""));
+	}
+	get pressable() {
+		return this.pressableSignal[0]();
+	}
+	set pressable(e) {
+		let t = b(e);
+		this.pressableSignal[1](t), this.hasAttribute("pressable") !== t && this.toggleAttribute("pressable", t);
+	}
+	get pressed() {
+		return this.pressedSignal[0]() ?? !1;
+	}
+	set pressed(e) {
+		this.pressedSignal[1](e == null ? void 0 : b(e));
+	}
+	get disabled() {
+		return this.disabledSignal[0]();
+	}
+	set disabled(e) {
+		this.disabledSignal[1](b(e));
+	}
+	attributeChangedCallback(e, t, n) {
+		e === "parts" ? this.parts = n : e === "pressable" || e === "pressed" || e === "disabled" ? Reflect.set(this, e, n) : Reflect.set(this, e, n ?? "");
+	}
+	sheet() {
+		return at();
+	}
+	beAButton() {
+		let e = !1;
+		a(() => {
+			let t = this.pressable, n = this.disabled, r = this.pressedSignal[0](), i = (e, t) => {
+				t === void 0 ? this.removeAttribute(e) : this.getAttribute(e) !== t && this.setAttribute(e, t);
+			};
+			i("role", t ? "button" : void 0), i("aria-label", t && this.label ? this.label : void 0), i("aria-pressed", t && r !== void 0 ? String(r) : void 0), i("aria-disabled", t && n ? "true" : void 0), t && !n && !this.hasAttribute("tabindex") ? (this.setAttribute("tabindex", "0"), e = !0) : (!t || n) && e && (this.removeAttribute("tabindex"), e = !1), t && !this.label && !st && (st = !0, console.warn("<lattice-shape pressable> has no label: give it one, so it can be named"));
+		});
+	}
+	draw() {
+		this.beAButton();
+		let [n, r] = h(!1), [a, o] = h(!1), s = () => this.pressable && !this.disabled, u = () => {
+			s() && this.tell("press", {
+				shape: this.shape,
+				parts: this.parts
+			});
+		}, d = [
+			["click", () => u()],
+			["keydown", (e) => {
+				let { key: t, repeat: n } = e;
+				!s() || t !== "Enter" && t !== " " || (e.preventDefault(), t === " " ? o(!0) : n || u());
+			}],
+			["keyup", (e) => {
+				e.key === " " && a() && (o(!1), u());
+			}],
+			["pointerdown", () => s() && o(!0)],
+			["pointerup", () => o(!1)],
+			["pointerleave", () => o(!1)],
+			["blur", () => o(!1)]
+		];
+		for (let [e, t] of d) this.addEventListener(e, t);
+		i(() => {
+			for (let [e, t] of d) this.removeEventListener(e, t);
+		});
+		let f = () => this.pressable ? a() || this.pressed ? this.lift / 2 : n() && !this.disabled ? this.lift + ot : this.lift : this.lift, p = g(() => l(this.parts, f())), m = g(() => l(this.parts, this.pressable ? this.lift + ot : this.lift).box), _ = g(() => se(oe("shape", this.parts))), v = () => !this.pressable && this.label !== "", y = this;
+		return (() => {
+			var n = et(), i = n.firstChild, a = i.nextSibling, o = a.nextSibling;
+			return ie(i, "pointerleave", () => r(!1)), ie(i, "pointerenter", () => r(!0)), C(i, t(c, {
+				get each() {
+					return p().faces;
+				},
+				children: (t) => (() => {
+					var n = tt();
+					return e((e) => {
+						var r = `flat-${t().kind}`, i = t().tone, a = t().d;
+						return r !== e.e && S(n, "class", e.e = r), i !== e.t && S(n, "data-tone", e.t = i), a !== e.a && S(n, "d", e.a = a), e;
+					}, {
+						e: void 0,
+						t: void 0,
+						a: void 0
+					}), n;
+				})()
+			})), C(o, t(x, {
+				get each() {
+					return _();
+				},
+				children: ([t, n]) => (() => {
+					var r = nt();
+					return e((e) => {
+						var i = t.x, a = t.y, o = n.x, s = n.y;
+						return i !== e.e && S(r, "x1", e.e = i), a !== e.t && S(r, "y1", e.t = a), o !== e.a && S(r, "x2", e.a = o), s !== e.o && S(r, "y2", e.o = s), e;
+					}, {
+						e: void 0,
+						t: void 0,
+						a: void 0,
+						o: void 0
+					}), r;
+				})()
+			})), e((e) => {
+				var t = m().width * y.scale, r = m().height * y.scale, i = `${m().x} ${m().y} ${m().width} ${m().height}`, s = v() ? "img" : void 0, c = v() ? y.label : void 0, l = v() ? void 0 : "true", u = p().seams, d = `translate(0 ${-f()})`;
+				return t !== e.e && S(n, "width", e.e = t), r !== e.t && S(n, "height", e.t = r), i !== e.a && S(n, "viewBox", e.a = i), s !== e.o && S(n, "role", e.o = s), c !== e.i && S(n, "aria-label", e.i = c), l !== e.n && S(n, "aria-hidden", e.n = l), u !== e.s && S(a, "d", e.s = u), d !== e.h && S(o, "transform", e.h = d), e;
+			}, {
+				e: void 0,
+				t: void 0,
+				a: void 0,
+				o: void 0,
+				i: void 0,
+				n: void 0,
+				s: void 0,
+				h: void 0
+			}), n;
+		})();
+	}
+}, lt = (e) => f(rt, ct, e), ut = ":host{touch-action:none;cursor:crosshair;display:block;position:relative}:host([disabled]){cursor:auto;pointer-events:none}.trail{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.blade{fill:none;stroke:var(--color-tree-alert);stroke-width:var(--tree-rule-thick-width);stroke-linecap:round;stroke-linejoin:round}", dt = 220;
+function ft() {
+	let [e, t] = h([]), n, r = () => {
+		let i = performance.now();
+		t((e) => e.filter((e) => i - e.at < dt)), n = e().length > 0 ? requestAnimationFrame(r) : void 0;
+	};
+	return i(() => {
+		n !== void 0 && cancelAnimationFrame(n);
+	}), {
+		points: () => e().map((e) => `${e.p.x},${e.p.y}`).join(" "),
+		add: (e) => {
+			t((t) => [...t, {
+				p: e,
+				at: performance.now()
+			}]), n ??= requestAnimationFrame(r);
+		}
+	};
+}
+//#endregion
+//#region src/elements/shears.tsx
+var pt = /*#__PURE__*/ s("<svg class=trail part=trail aria-hidden=true><polyline class=blade>"), Q = "shears-pad", mt = m(ut), ht = class t extends d {
+	static observedAttributes = ["disabled"];
+	inputs = t.observedAttributes;
+	disabledSignal = h(!1);
+	get disabled() {
+		return this.disabledSignal[0]();
+	}
+	set disabled(e) {
+		this.disabledSignal[1](b(e));
+	}
+	attributeChangedCallback(e, t, n) {
+		this.disabled = n;
+	}
+	sheet() {
+		return mt();
+	}
+	draw() {
+		let t = ft(), n, o, s = (e) => {
+			let t = this.getBoundingClientRect();
+			return {
+				x: e.clientX - t.left,
+				y: e.clientY - t.top
+			};
+		}, c = (e) => {
+			if (!n || o === void 0) return;
+			let t = n, r = o;
+			n = void 0, o = void 0, this.hasPointerCapture(r) && this.releasePointerCapture(r), this.tell("strokeend", {
+				points: t,
+				cancelled: e
+			});
+		}, l = (e) => {
+			if (this.disabled || e.button !== 0 || n) return;
+			e.preventDefault(), o = e.pointerId, this.setPointerCapture(o);
+			let t = s(e);
+			n = [t], this.tell("stroke", {
+				points: [t],
+				point: t,
+				fresh: !0
+			});
+		}, u = (e) => {
+			if (!n || e.pointerId !== o) return;
+			let r = s(e);
+			n.push(r), t.add(r), this.tell("stroke", {
+				points: [...n],
+				point: r,
+				fresh: !1
+			});
+		}, d = (e) => (t) => {
+			t.pointerId === o && c(e);
+		}, f = [
+			["pointerdown", l],
+			["pointermove", u],
+			["pointerup", d(!1)],
+			["pointercancel", d(!0)],
+			["lostpointercapture", d(!0)]
+		];
+		for (let [e, t] of f) this.addEventListener(e, t);
+		return a(r(() => this.disabled, (e) => e && c(!0), { defer: !0 })), i(() => {
+			c(!0);
+			for (let [e, t] of f) this.removeEventListener(e, t);
+		}), (() => {
+			var n = pt(), r = n.firstChild;
+			return e(() => S(r, "points", t.points())), n;
+		})();
+	}
+}, gt = (e) => f(Q, ht, e), _t = ":host{background:var(--color-tree-sky);display:block;position:relative}:host([kind=earth]){background:var(--color-tree-earth)}.sky{width:100%;height:100%;position:absolute;inset:0;overflow:hidden}.line{fill:none;stroke:var(--color-tree-lattice-sky);stroke-width:var(--tree-rule-width)}:host([kind=earth]) .line{stroke:var(--color-tree-lattice-earth)}", vt = /*#__PURE__*/ s("<svg class=sky part=sky aria-hidden=true><defs><pattern patternUnits=userSpaceOnUse><path class=line></path></pattern></defs><rect width=100% height=100%>"), $ = "hex-sky", yt = m(_t), bt = 0, xt = class t extends d {
+	static observedAttributes = [
+		"kind",
+		"orient",
+		"scale",
+		"x",
+		"y"
+	];
+	inputs = t.observedAttributes;
+	kindSignal = h("sky");
+	orientSignal = h("pointy");
+	scaleSignal = h(1);
+	xSignal = h(0);
+	ySignal = h(0);
+	get kind() {
+		return this.kindSignal[0]();
+	}
+	set kind(e) {
+		this.kindSignal[1](String(e ?? "").toLowerCase() === "earth" ? "earth" : "sky");
+	}
+	get orient() {
+		return this.orientSignal[0]();
+	}
+	set orient(e) {
+		this.orientSignal[1](String(e ?? "").toLowerCase() === "flat" ? "flat" : "pointy");
+	}
+	get scale() {
+		return this.scaleSignal[0]();
+	}
+	set scale(e) {
+		let t = v(e, 1);
+		this.scaleSignal[1](t > 0 ? t : 1);
+	}
+	get x() {
+		return this.xSignal[0]();
+	}
+	set x(e) {
+		this.xSignal[1](v(e, 0));
+	}
+	get y() {
+		return this.ySignal[0]();
+	}
+	set y(e) {
+		this.ySignal[1](v(e, 0));
+	}
+	attributeChangedCallback(e, t, n) {
+		Reflect.set(this, e, n ?? "");
+	}
+	sheet() {
+		return yt();
+	}
+	draw() {
+		let t = `${$}-${++bt}`, n = this;
+		return (() => {
+			var r = vt(), i = r.firstChild, a = i.firstChild, o = a.firstChild, s = i.nextSibling;
+			return S(a, "id", t), S(s, "fill", `url(#${t})`), e((e) => {
+				var t = ae.width, r = ae.height, i = `translate(${n.x} ${n.y})${n.orient === "flat" ? " rotate(90)" : ""} scale(${n.scale})`, s = ce[n.kind];
+				return t !== e.e && S(a, "width", e.e = t), r !== e.t && S(a, "height", e.t = r), i !== e.a && S(a, "patternTransform", e.a = i), s !== e.o && S(o, "d", e.o = s), e;
+			}, {
+				e: void 0,
+				t: void 0,
+				a: void 0,
+				o: void 0
+			}), r;
+		})();
+	}
+}, St = (e) => f($, xt, e);
+//#endregion
+//#region src/elements/index.ts
+function Ct() {
+	Ve(), St(), lt(), gt(), $e();
+}
+//#endregion
+export { Le as _, Q as a, ct as c, Ye as d, Je as f, Be as g, Ie as h, St as i, rt as l, $e as m, xt as n, ht as o, Qe as p, $ as r, gt as s, Ct as t, lt as u, Ve as v, G as y };