react-pebble 0.1.1 → 0.2.0

package/dist/lib/index.js

@@ -1,9 +1,9 @@
 import { PLATFORMS as e, SCREEN as t, _setPlatform as n } from "./platform.js";
-import { ButtonRegistry as r, PebbleAppContext as i, useApp as a, useButton as o, useFormattedTime as s, useInterval as c, useListNavigation as l, useLongButton as u, useTime as d } from "./hooks.js";
-import { ActionBar as f, Badge as p, Card as m, Circle as h, Group as g, Image as _, Line as v, Rect as y, StatusBar as b, Text as x, Window as S } from "./components.js";
-import { render as C } from "preact";
+import { ButtonRegistry as r, Easing as i, PebbleAppContext as a, lerp as o, useAccelerometer as s, useAnimation as c, useApp as l, useBattery as u, useButton as d, useCompass as f, useConnection as p, useFetch as m, useFormattedTime as h, useInterval as g, useKVStorage as _, useListNavigation as v, useLocalStorage as y, useLongButton as b, useTime as x, useWebSocket as S } from "./hooks.js";
+import { ActionBar as ee, Badge as te, Card as ne, Circle as re, Column as C, Group as ie, Image as w, Line as ae, Rect as oe, Row as T, StatusBar as E, Text as D, Window as O } from "./components.js";
+import { render as k } from "preact";
 //#region src/pebble-dom.ts
-var w = new Set([
+var A = new Set([
 	"pbl-root",
 	"pbl-rect",
 	"pbl-circle",
@@ -13,10 +13,10 @@ var w = new Set([
 	"pbl-group",
 	"pbl-statusbar",
 	"pbl-actionbar"
-]), T = 1;
-function E(e) {
+]), j = 1;
+function M(e) {
 	return {
-		id: T++,
+		id: j++,
 		type: e,
 		props: {},
 		children: [],
@@ -26,45 +26,45 @@ function E(e) {
 		_dirty: !0
 	};
 }
-function D(e) {
+function N(e) {
 	return {
-		id: T++,
+		id: j++,
 		type: "#text",
 		value: e,
 		parent: null
 	};
 }
-function O(e, t) {
-	t.parent && A(t.parent, t), t.parent = e, e.children.push(t);
+function P(e, t) {
+	t.parent && I(t.parent, t), t.parent = e, e.children.push(t);
 }
-function k(e, t, n) {
-	t.parent && A(t.parent, t), t.parent = e;
+function F(e, t, n) {
+	t.parent && I(t.parent, t), t.parent = e;
 	let r = e.children.indexOf(n);
 	r >= 0 ? e.children.splice(r, 0, t) : e.children.push(t);
 }
-function A(e, t) {
+function I(e, t) {
 	e.children = e.children.filter((e) => e !== t), t.parent = null;
 }
-function j(e, t, n) {
+function L(e, t, n) {
 	n === void 0 ? delete e.props[t] : e.props[t] = n;
 }
-function M(e, t) {
+function R(e, t) {
 	e.value = t;
 }
-function N(e) {
-	return e.type === "#text" ? e.value : e.children.map(N).join("");
+function z(e) {
+	return e.type === "#text" ? e.value : e.children.map(z).join("");
 }
-function P(e, t, n = 0) {
-	if (t(e, n), e.type !== "#text") for (let r of e.children) P(r, t, n + 1);
+function B(e, t, n = 0) {
+	if (t(e, n), e.type !== "#text") for (let r of e.children) B(r, t, n + 1);
 }
-function F(e) {
+function V(e) {
 	let t = e;
 	for (; t.parent;) t = t.parent;
 	return t;
 }
 //#endregion
 //#region src/pebble-output.ts
-var I = {
+var H = {
 	black: {
 		r: 0,
 		g: 0,
@@ -125,37 +125,37 @@ var I = {
 		g: 64,
 		b: 64
 	}
-}, L = {
+}, U = {
 	gothic14: {
-		family: "Bitham-Black",
+		family: "Gothic",
 		size: 14
 	},
 	gothic14Bold: {
-		family: "Bitham-Black",
+		family: "Gothic-Bold",
 		size: 14
 	},
 	gothic18: {
-		family: "Bitham-Black",
+		family: "Gothic",
 		size: 18
 	},
 	gothic18Bold: {
-		family: "Bitham-Black",
+		family: "Gothic-Bold",
 		size: 18
 	},
 	gothic24: {
-		family: "Bitham-Black",
+		family: "Gothic",
 		size: 24
 	},
 	gothic24Bold: {
-		family: "Bitham-Black",
+		family: "Gothic-Bold",
 		size: 24
 	},
 	gothic28: {
-		family: "Bitham-Black",
+		family: "Gothic",
 		size: 28
 	},
 	gothic28Bold: {
-		family: "Bitham-Black",
+		family: "Gothic-Bold",
 		size: 28
 	},
 	bitham30Black: {
@@ -163,31 +163,71 @@ var I = {
 		size: 30
 	},
 	bitham42Bold: {
-		family: "Bitham-Black",
+		family: "Bitham-Bold",
 		size: 42
 	},
 	bitham42Light: {
-		family: "Bitham-Black",
+		family: "Bitham-Light",
 		size: 42
 	},
 	bitham34MediumNumbers: {
-		family: "Bitham-Black",
+		family: "Bitham",
 		size: 34
 	},
 	bitham42MediumNumbers: {
-		family: "Bitham-Black",
+		family: "Bitham",
+		size: 42
+	},
+	robotoCondensed21: {
+		family: "Roboto-Condensed",
+		size: 21
+	},
+	roboto21: {
+		family: "Roboto",
+		size: 21
+	},
+	droid28: {
+		family: "Droid-Serif",
+		size: 28
+	},
+	leco20: {
+		family: "LECO",
+		size: 20
+	},
+	leco26: {
+		family: "LECO",
+		size: 26
+	},
+	leco28: {
+		family: "LECO",
+		size: 28
+	},
+	leco32: {
+		family: "LECO",
+		size: 32
+	},
+	leco36: {
+		family: "LECO",
+		size: 36
+	},
+	leco38: {
+		family: "LECO",
+		size: 38
+	},
+	leco42: {
+		family: "LECO",
 		size: 42
 	}
-}, R = "gothic18";
-function z(e, t) {
+}, W = "gothic18";
+function G(e, t) {
 	let n = e[t];
 	return typeof n == "number" ? n : 0;
 }
-function B(e, t) {
+function K(e, t) {
 	let n = e[t];
 	return typeof n == "string" ? n : void 0;
 }
-var V = class {
+var q = class {
 	poco;
 	colorCache = /* @__PURE__ */ new Map();
 	fontCache = /* @__PURE__ */ new Map();
@@ -203,13 +243,13 @@ var V = class {
 	getColor(e) {
 		let t = e ?? "black", n = this.colorCache.get(t);
 		if (n !== void 0) return n;
-		let r = I[t] ?? I.white, i = this.poco.makeColor(r.r, r.g, r.b);
+		let r = H[t] ?? H.white, i = this.poco.makeColor(r.r, r.g, r.b);
 		return this.colorCache.set(t, i), i;
 	}
 	getFont(e) {
-		let t = e ?? R, n = this.fontCache.get(t);
+		let t = e ?? W, n = this.fontCache.get(t);
 		if (n !== void 0) return n;
-		let r = L[t] ?? L[R], i = this.poco.Font, a = new i(r.family, r.size);
+		let r = U[t] ?? U[W], i = this.poco.Font, a = new i(r.family, r.size);
 		return this.fontCache.set(t, a), a;
 	}
 	renderChildren(e, t, n) {
@@ -218,65 +258,148 @@ var V = class {
 	renderNode(e, t, n) {
 		let r = e.props;
 		if (r._hidden) return;
-		let i = z(r, "x") + t, a = z(r, "y") + n;
+		let i = G(r, "x") + t, a = G(r, "y") + n;
 		switch (e.type) {
 			case "pbl-rect": {
-				let t = z(r, "w") || z(r, "width"), n = z(r, "h") || z(r, "height"), o = B(r, "fill"), s = B(r, "stroke");
-				if (o && this.poco.fillRectangle(this.getColor(o), i, a, t, n), s) {
-					let e = z(r, "strokeWidth") || 1, o = this.getColor(s);
+				let t = G(r, "w") || G(r, "width"), n = G(r, "h") || G(r, "height"), o = K(r, "fill"), s = K(r, "stroke"), c = G(r, "borderRadius");
+				if (c > 0) {
+					if (o && this.fillRoundRect(this.getColor(o), i, a, t, n, c), s) {
+						let e = G(r, "strokeWidth") || 1;
+						this.strokeRoundRect(this.getColor(s), i, a, t, n, c, e);
+					}
+				} else if (o && this.poco.fillRectangle(this.getColor(o), i, a, t, n), s) {
+					let e = G(r, "strokeWidth") || 1, o = this.getColor(s);
 					this.poco.fillRectangle(o, i, a, t, e), this.poco.fillRectangle(o, i, a + n - e, t, e), this.poco.fillRectangle(o, i, a, e, n), this.poco.fillRectangle(o, i + t - e, a, e, n);
 				}
 				this.renderChildren(e, i, a);
 				break;
 			}
 			case "pbl-text": {
-				let t = N(e);
+				let t = z(e);
 				if (!t) break;
-				let n = z(r, "w") || z(r, "width") || this.poco.width - i, o = this.getFont(B(r, "font")), s = this.getColor(B(r, "color") ?? "white"), c = B(r, "align") ?? "left", l = i;
-				if (c === "center" || c === "right") {
-					let e = this.poco.getTextWidth(t, o);
-					l = c === "center" ? i + Math.floor((n - e) / 2) : i + n - e;
+				let n = G(r, "w") || G(r, "width") || this.poco.width - i, o = G(r, "h") || G(r, "height") || 0, s = this.getFont(K(r, "font")), c = this.getColor(K(r, "color") ?? "white"), l = K(r, "align") ?? "left", u = s.height || 16, d = this.wrapText(t, s, n), f = a;
+				for (let e of d) {
+					if (o > 0 && f - a + u > o) break;
+					let t = i;
+					if (l === "center" || l === "right") {
+						let r = this.poco.getTextWidth(e, s);
+						t = l === "center" ? i + Math.floor((n - r) / 2) : i + n - r;
+					}
+					this.poco.drawText(e, s, c, t, f), f += u;
 				}
-				this.poco.drawText(t, o, s, l, a);
 				break;
 			}
 			case "pbl-line": {
-				let e = z(r, "x2") + t, o = z(r, "y2") + n, s = this.getColor(B(r, "color") ?? B(r, "stroke") ?? "white"), c = z(r, "strokeWidth") || 1;
+				let e = G(r, "x2") + t, o = G(r, "y2") + n, s = this.getColor(K(r, "color") ?? K(r, "stroke") ?? "white"), c = G(r, "strokeWidth") || 1;
 				if (i === e) {
 					let e = Math.min(a, o), t = Math.abs(o - a) || 1;
 					this.poco.fillRectangle(s, i, e, c, t);
 				} else if (a === o) {
 					let t = Math.min(i, e), n = Math.abs(e - i) || 1;
 					this.poco.fillRectangle(s, t, a, n, c);
+				} else this.drawDiagonalLine(s, i, a, e, o, c);
+				break;
+			}
+			case "pbl-circle": {
+				let e = G(r, "r") || G(r, "radius");
+				if (e <= 0) break;
+				let t = K(r, "fill"), n = K(r, "stroke"), o = G(r, "strokeWidth") || 1;
+				if (t) {
+					let n = this.getColor(t);
+					this.fillCircle(n, i + e, a + e, e);
+				}
+				if (n) {
+					let t = this.getColor(n);
+					this.strokeCircle(t, i + e, a + e, e, o);
 				}
 				break;
 			}
-			case "pbl-circle": break;
 			case "pbl-image": {
 				let e = r.bitmap;
-				e && this.poco.drawBitmap(e, i, a);
+				if (e) {
+					let t = G(r, "rotation"), n = G(r, "scale");
+					if (t || n && n !== 1) {
+						let r = e, o = this.poco;
+						o.drawBitmapWithTransform ? o.drawBitmapWithTransform(r, i, a, t, n || 1) : this.poco.drawBitmap(r, i, a);
+					} else this.poco.drawBitmap(e, i, a);
+				}
 				break;
 			}
 			case "pbl-group":
 				this.renderChildren(e, i, a);
 				break;
-			case "pbl-statusbar":
-			case "pbl-actionbar": break;
+			case "pbl-statusbar": {
+				let e = K(r, "backgroundColor") ?? "black", t = K(r, "color") ?? "white", n = this.poco.width;
+				this.poco.fillRectangle(this.getColor(e), 0, 0, n, 16);
+				let i = this.getFont("gothic14"), a = /* @__PURE__ */ new Date(), o = `${a.getHours().toString().padStart(2, "0")}:${a.getMinutes().toString().padStart(2, "0")}`, s = this.poco.getTextWidth(o, i);
+				this.poco.drawText(o, i, this.getColor(t), Math.floor((n - s) / 2), 1);
+				let c = K(r, "separator") ?? "none";
+				if (c === "line") this.poco.fillRectangle(this.getColor(t), 0, 15, n, 1);
+				else if (c === "dotted") for (let e = 0; e < n; e += 3) this.poco.fillRectangle(this.getColor(t), e, 15, 1, 1);
+				break;
+			}
+			case "pbl-actionbar": {
+				let e = K(r, "backgroundColor") ?? "darkGray", t = this.poco.width - 30, n = this.poco.height;
+				this.poco.fillRectangle(this.getColor(e), t, 0, 30, n);
+				let i = this.getColor("white"), a = t + 15;
+				this.poco.fillRectangle(i, a - 3, Math.floor(n / 6) - 3, 6, 6), this.poco.fillRectangle(i, a - 3, Math.floor(n / 2) - 3, 6, 6), this.poco.fillRectangle(i, a - 3, Math.floor(n * 5 / 6) - 3, 6, 6);
+				break;
+			}
 			case "pbl-root":
 				this.renderChildren(e, t, n);
 				break;
 		}
 	}
+	fillCircle(e, t, n, r) {
+		let { poco: i } = this, a = r, o = 0, s = 1 - r, c = -1, l = -1;
+		for (; a >= o;) n + o !== c && (i.fillRectangle(e, t - a, n + o, a * 2 + 1, 1), c = n + o), n - o !== l && o !== 0 && (i.fillRectangle(e, t - a, n - o, a * 2 + 1, 1), l = n - o), n + a !== c && (i.fillRectangle(e, t - o, n + a, o * 2 + 1, 1), c = n + a), n - a !== l && (i.fillRectangle(e, t - o, n - a, o * 2 + 1, 1), l = n - a), o++, s < 0 ? s += 2 * o + 1 : (a--, s += 2 * (o - a) + 1);
+	}
+	strokeCircle(e, t, n, r, i) {
+		let { poco: a } = this, o = r, s = 0, c = 1 - r;
+		for (; o >= s;) a.fillRectangle(e, t + o, n + s, i, i), a.fillRectangle(e, t - o, n + s, i, i), a.fillRectangle(e, t + o, n - s, i, i), a.fillRectangle(e, t - o, n - s, i, i), a.fillRectangle(e, t + s, n + o, i, i), a.fillRectangle(e, t - s, n + o, i, i), a.fillRectangle(e, t + s, n - o, i, i), a.fillRectangle(e, t - s, n - o, i, i), s++, c < 0 ? c += 2 * s + 1 : (o--, c += 2 * (s - o) + 1);
+	}
+	drawDiagonalLine(e, t, n, r, i, a) {
+		let { poco: o } = this, s = Math.abs(r - t), c = Math.abs(i - n), l = t < r ? 1 : -1, u = n < i ? 1 : -1, d = s - c, f = t, p = n;
+		for (; o.fillRectangle(e, f, p, a, a), !(f === r && p === i);) {
+			let e = 2 * d;
+			e > -c && (d -= c, f += l), e < s && (d += s, p += u);
+		}
+	}
+	fillRoundRect(e, t, n, r, i, a) {
+		let { poco: o } = this, s = Math.min(a, Math.floor(r / 2), Math.floor(i / 2));
+		o.fillRectangle(e, t, n + s, r, i - s * 2), o.fillRectangle(e, t + s, n, r - s * 2, s), o.fillRectangle(e, t + s, n + i - s, r - s * 2, s), this.fillQuarterCircles(e, t + s, n + s, t + r - s - 1, n + i - s - 1, s);
+	}
+	strokeRoundRect(e, t, n, r, i, a, o) {
+		let { poco: s } = this, c = Math.min(a, Math.floor(r / 2), Math.floor(i / 2));
+		s.fillRectangle(e, t + c, n, r - c * 2, o), s.fillRectangle(e, t + c, n + i - o, r - c * 2, o), s.fillRectangle(e, t, n + c, o, i - c * 2), s.fillRectangle(e, t + r - o, n + c, o, i - c * 2), this.strokeQuarterCircles(e, t + c, n + c, t + r - c - 1, n + i - c - 1, c, o);
+	}
+	fillQuarterCircles(e, t, n, r, i, a) {
+		let { poco: o } = this, s = a, c = 0, l = 1 - a;
+		for (; s >= c;) o.fillRectangle(e, t - s, n - c, s, 1), o.fillRectangle(e, t - c, n - s, c, 1), o.fillRectangle(e, r + 1, n - c, s, 1), o.fillRectangle(e, r + 1, n - s, c, 1), o.fillRectangle(e, t - s, i + c, s, 1), o.fillRectangle(e, t - c, i + s, c, 1), o.fillRectangle(e, r + 1, i + c, s, 1), o.fillRectangle(e, r + 1, i + s, c, 1), c++, l < 0 ? l += 2 * c + 1 : (s--, l += 2 * (c - s) + 1);
+	}
+	strokeQuarterCircles(e, t, n, r, i, a, o) {
+		let { poco: s } = this, c = a, l = 0, u = 1 - a;
+		for (; c >= l;) s.fillRectangle(e, t - c, n - l, o, o), s.fillRectangle(e, t - l, n - c, o, o), s.fillRectangle(e, r + c, n - l, o, o), s.fillRectangle(e, r + l, n - c, o, o), s.fillRectangle(e, t - c, i + l, o, o), s.fillRectangle(e, t - l, i + c, o, o), s.fillRectangle(e, r + c, i + l, o, o), s.fillRectangle(e, r + l, i + c, o, o), l++, u < 0 ? u += 2 * l + 1 : (c--, u += 2 * (l - c) + 1);
+	}
+	wrapText(e, t, n) {
+		if (this.poco.getTextWidth(e, t) <= n) return [e];
+		let r = e.split(" "), i = [], a = "";
+		for (let e of r) {
+			let r = a ? `${a} ${e}` : e;
+			this.poco.getTextWidth(r, t) <= n ? a = r : (a && i.push(a), a = e);
+		}
+		return a && i.push(a), i;
+	}
 };
-function H(e) {
-	return e && e in I ? e : "black";
+function se(e) {
+	return e && e in H ? e : "black";
 }
-function U(e) {
-	return e && e in L ? e : R;
+function ce(e) {
+	return e && e in U ? e : W;
 }
 //#endregion
 //#region src/pebble-dom-shim.ts
-function W(e) {
+function J(e) {
 	let t = e.childNodes;
 	e.firstChild = t[0] ?? null;
 	for (let n = 0; n < t.length; n++) {
@@ -284,10 +407,10 @@ function W(e) {
 		r.parentNode = e, r.nextSibling = t[n + 1] ?? null;
 	}
 }
-function G(e) {
+function Y(e) {
 	let t = e;
-	if (!w.has(t)) throw Error(`react-pebble: unknown element tag "${e}"`);
-	let n = E(t);
+	if (!A.has(t)) throw Error(`react-pebble: unknown element tag "${e}"`);
+	let n = M(t);
 	return {
 		nodeType: 1,
 		nodeName: e.toUpperCase(),
@@ -300,41 +423,41 @@ function G(e) {
 		firstChild: null,
 		nextSibling: null,
 		appendChild(e) {
-			return e.parentNode && e.parentNode.removeChild(e), this.childNodes.push(e), O(n, e._pbl), W(this), e;
+			return e.parentNode && e.parentNode.removeChild(e), this.childNodes.push(e), P(n, e._pbl), J(this), e;
 		},
 		insertBefore(e, t) {
 			if (e.parentNode && e.parentNode.removeChild(e), t === null) return this.appendChild(e);
 			let r = this.childNodes.indexOf(t);
-			return r < 0 ? this.appendChild(e) : (this.childNodes.splice(r, 0, e), k(n, e._pbl, t._pbl), W(this), e);
+			return r < 0 ? this.appendChild(e) : (this.childNodes.splice(r, 0, e), F(n, e._pbl, t._pbl), J(this), e);
 		},
 		removeChild(e) {
 			let t = this.childNodes.indexOf(e);
-			return t >= 0 && this.childNodes.splice(t, 1), A(n, e._pbl), e.parentNode = null, e.nextSibling = null, W(this), e;
+			return t >= 0 && this.childNodes.splice(t, 1), I(n, e._pbl), e.parentNode = null, e.nextSibling = null, J(this), e;
 		},
 		remove() {
 			this.parentNode && this.parentNode.removeChild(this);
 		},
 		setAttribute(e, t) {
-			this.attributes[e] = t, j(n, e, t);
+			this.attributes[e] = t, L(n, e, t);
 		},
 		removeAttribute(e) {
-			delete this.attributes[e], j(n, e, void 0);
+			delete this.attributes[e], L(n, e, void 0);
 		},
 		getAttribute(e) {
 			return this.attributes[e];
 		},
 		addEventListener(e, t) {
 			let r = `on${e[0]?.toUpperCase()}${e.slice(1)}`;
-			this.attributes[r] = t, j(n, r, t);
+			this.attributes[r] = t, L(n, r, t);
 		},
 		removeEventListener(e, t) {
 			let r = `on${e[0]?.toUpperCase()}${e.slice(1)}`;
-			delete this.attributes[r], j(n, r, void 0);
+			delete this.attributes[r], L(n, r, void 0);
 		}
 	};
 }
-function K(e) {
-	let t = D(e), n = {
+function le(e) {
+	let t = N(e), n = {
 		nodeType: 3,
 		nodeName: "#text",
 		_pbl: t,
@@ -351,54 +474,54 @@ function K(e) {
 			return t.value;
 		},
 		set(e) {
-			M(t, e);
+			R(t, e);
 		}
 	}), Object.defineProperty(n, "nodeValue", {
 		get() {
 			return t.value;
 		},
 		set(e) {
-			M(t, e);
+			R(t, e);
 		}
 	}), Object.defineProperty(n, "textContent", {
 		get() {
 			return t.value;
 		},
 		set(e) {
-			M(t, e);
+			R(t, e);
 		}
 	}), n;
 }
-var q = {
-	createElement: G,
-	createElementNS: (e, t) => G(t),
-	createTextNode: K
+var X = {
+	createElement: Y,
+	createElementNS: (e, t) => Y(t),
+	createTextNode: le
 };
-function J() {
-	let e = G("pbl-root");
-	return e.ownerDocument = q, e;
+function ue() {
+	let e = Y("pbl-root");
+	return e.ownerDocument = X, e;
 }
 //#endregion
 //#region src/pebble-reconciler.ts
-typeof document > "u" && (globalThis.document = q);
-function Y() {
-	let e = J();
+typeof document > "u" && (globalThis.document = X);
+function Z() {
+	let e = ue();
 	return {
 		shimRoot: e,
 		pblRoot: e._pbl
 	};
 }
-function X(e, t) {
-	C(e, t.shimRoot);
+function Q(e, t) {
+	k(e, t.shimRoot);
 }
-function Z(e) {
-	C(null, e.shimRoot);
+function $(e) {
+	k(null, e.shimRoot);
 }
-var Q = {
-	createContainer: Y,
-	updateContainer: X,
-	unmountContainer: Z
-}, $ = class {
+var de = {
+	createContainer: Z,
+	updateContainer: Q,
+	unmountContainer: $
+}, fe = class {
 	width;
 	height;
 	Font;
@@ -512,7 +635,7 @@ var Q = {
 		return Math.round(e.length * n * .6);
 	}
 };
-function ee(e, t) {
+function pe(e, t) {
 	return typeof screen < "u" && screen && t ? {
 		poco: new t(screen),
 		info: {
@@ -522,7 +645,7 @@ function ee(e, t) {
 			screenHeight: screen.height
 		}
 	} : {
-		poco: new $(200, 228, e),
+		poco: new fe(200, 228, e),
 		info: {
 			isReal: !1,
 			platform: "mock",
@@ -531,7 +654,7 @@ function ee(e, t) {
 		}
 	};
 }
-function te() {
+function me() {
 	if (typeof watch > "u" || !watch) return () => void 0;
 	let e = (e) => {
 		if (typeof e != "string") return;
@@ -548,25 +671,25 @@ function te() {
 		typeof watch > "u" || !watch || (watch.removeEventListener("button", t), watch.removeEventListener("buttonClick", t), watch.removeEventListener("longClick", n));
 	};
 }
-function ne(e) {
+function he(e) {
 	typeof Promise < "u" ? Promise.resolve().then(e) : setTimeout(e, 0);
 }
-function re(e, t = {}) {
-	let n = [], r = Y(), { poco: i, info: a } = ee(n, t.poco), o = new V(i), s = !1, c = () => {
+function ge(e, t = {}) {
+	let n = [], r = Z(), { poco: i, info: a } = pe(n, t.poco), o = new q(i), s = !1, c = () => {
 		s = !1, n.length = 0, o.render(r.pblRoot, { backgroundColor: t.backgroundColor });
 	}, l = () => {
-		s || (s = !0, ne(c));
+		s || (s = !0, he(c));
 	}, u = t, d = u._commit ?? u.__c, f = (e, t) => {
 		d && d(e, t), l();
 	};
-	u._commit = f, u.__c = f, X(e, r), c();
-	let p = te();
+	u._commit = f, u.__c = f, Q(e, r), c();
+	let p = me();
 	return {
 		update(e) {
-			X(e, r), l();
+			Q(e, r), l();
 		},
 		unmount() {
-			Z(r), u._commit = d, u.__c = d, p();
+			$(r), u._commit = d, u.__c = d, p();
 		},
 		get platform() {
 			return a;
@@ -580,6 +703,6 @@ function re(e, t = {}) {
 	};
 }
 //#endregion
-export { f as ActionBar, p as Badge, r as ButtonRegistry, I as COLOR_PALETTE, m as Card, h as Circle, w as ELEMENT_TYPES, L as FONT_PALETTE, g as Group, _ as Image, v as Line, e as PLATFORMS, i as PebbleAppContext, V as PocoRenderer, y as Rect, t as SCREEN, b as StatusBar, x as Text, S as Window, n as _setPlatform, O as appendChildNode, E as createNode, D as createTextNode, F as findRoot, N as getTextContent, k as insertBeforeNode, Q as reconciler, A as removeChildNode, re as render, H as resolveColorName, U as resolveFontName, j as setAttribute, M as setTextNodeValue, a as useApp, o as useButton, s as useFormattedTime, c as useInterval, l as useListNavigation, u as useLongButton, d as useTime, P as walkTree };
+export { ee as ActionBar, te as Badge, r as ButtonRegistry, H as COLOR_PALETTE, ne as Card, re as Circle, C as Column, A as ELEMENT_TYPES, i as Easing, U as FONT_PALETTE, ie as Group, w as Image, ae as Line, e as PLATFORMS, a as PebbleAppContext, q as PocoRenderer, oe as Rect, T as Row, t as SCREEN, E as StatusBar, D as Text, O as Window, n as _setPlatform, P as appendChildNode, M as createNode, N as createTextNode, V as findRoot, z as getTextContent, F as insertBeforeNode, o as lerp, de as reconciler, I as removeChildNode, ge as render, se as resolveColorName, ce as resolveFontName, L as setAttribute, R as setTextNodeValue, s as useAccelerometer, c as useAnimation, l as useApp, u as useBattery, d as useButton, f as useCompass, p as useConnection, m as useFetch, h as useFormattedTime, g as useInterval, _ as useKVStorage, v as useListNavigation, y as useLocalStorage, b as useLongButton, x as useTime, S as useWebSocket, B as walkTree };
 
 //# sourceMappingURL=index.js.map