@harmonics/lattice-ui 0.5.1 → 0.7.0

package/dist/elements-DdyLdkzr.js

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