@manyducks.co/dolla 3.3.0 → 4.0.0

package/dist/core/context.d.ts

@@ -1,5 +1,6 @@
 import type { Store } from "../types.js";
 import { ViewNode } from "./markup/nodes/view.js";
+import { Unwrapped } from "./signals.js";
 export type LifecycleListener = () => any;
 type ContextState = {
     isMounted: boolean;
@@ -13,7 +14,15 @@ export declare function mountContext(context: Context): void;
 export declare function unmountContext(context: Context): void;
 export declare function onMount(context: Context, fn: LifecycleListener): void;
 export declare function onCleanup(context: Context, fn: LifecycleListener): void;
+/**
+ * Creates an effect with auto-tracking for getters called within its callback.
+ */
 export declare function onEffect(context: Context, fn: () => void): void;
+/**
+ * Creates an effect that tracks getters in its `deps` array.
+ * Unwrapped values from `deps` are passed as arguments to the callback.
+ */
+export declare function onEffect<const T extends readonly any[]>(context: Context, fn: (...values: Unwrapped<T>) => void, deps: T): void;
 /**
  * Returns the parent element of the root we're mounted in.
  */

package/dist/core/root.d.ts

@@ -1,13 +1,11 @@
 import type { Renderable, View } from "../types.js";
 import { type Context } from "./context.js";
-export type CleanupCallback = () => void | Promise<void>;
 /**
- * Plugins run before the app is mounted. If they return a promise, mounting will be delayed until the promise resolves.
- * If a cleanup function is returned, it will be called before the app is unmounted. The cleanup function's promise will delay unmounting.
- *
- * Hooks can be used inside plugins.
+ * Plugins are simply functions that take a context object.
+ * A plugin can return a Promise to suspend app mounting.
+ * Hooks can be used to attach app lifecycle logic.
  */
-export type DollaPlugin = (context: Context) => Promise<CleanupCallback | void> | CleanupCallback | void;
+export type DollaPlugin = (context: Context) => any;
 export interface DollaRootOptions {
     /**
      * Adds additional view info to the DOM to help with debugging.

package/dist/core/signals.d.ts

@@ -74,7 +74,18 @@ export declare function createAtom<T>(initialValue: T): AtomAccessors<T>;
  */
 export declare function createSetter<T>(getter: Getter<T>, callback: (current: T) => T | void): Setter<T>;
 export declare function compose<T>(getter: T | ((previousValue?: T) => Getter<T> | T)): Getter<T>;
+export type Unwrapped<T> = {
+    [K in keyof T]: T[K] extends () => infer R ? R : T[K];
+};
+/**
+ * Creates an effect with auto-tracking for getters called within its callback.
+ */
 export declare function createEffect(fn: () => void): () => void;
+/**
+ * Creates an effect that tracks getters in its `deps` array.
+ * Unwrapped values from `deps` are passed as arguments to the callback.
+ */
+export declare function createEffect<const T extends readonly any[]>(fn: (...values: Unwrapped<T>) => void, deps?: T): () => void;
 /**
  * Unwraps a `MaybeGetter<T>` into a plain `T`.
  * Tracks the value if it is a getter.

package/dist/{core-BRSu5hVw.js → core-CHBZF6Mb.js}

@@ -314,25 +314,33 @@ function w(e) {
 		_getter: e
 	}) : () => e;
 }
-function T(e) {
-	let t = {
-		_fn: e,
+function _e(e) {
+	let t = this.map((e) => E(e));
+	return D(() => e(...t));
+}
+function T(e, t) {
+	let n = {
+		_fn: t ? _e.bind(t, e) : e,
 		_cleanup: void 0,
 		_subs: void 0,
 		_subsTail: void 0,
 		_deps: void 0,
 		_depsTail: void 0,
 		_flags: u.Watching | u.RecursedCheck
-	}, n = b(t);
-	n !== void 0 && _(t, n, 0);
+	}, r = b(n);
+	r !== void 0 && _(n, r, 0);
 	try {
-		let e = t._fn();
-		o(e) && (t._cleanup = e);
+		let e = n._fn();
+		o(e) && (n._cleanup = e);
 	} finally {
-		h = n, t._flags &= ~u.RecursedCheck;
+		h = r, n._flags &= ~u.RecursedCheck;
 	}
-	return he.bind(t);
+	return he.bind(n);
 }
+var [ve, ye] = C(5);
+T((e, t) => {
+	console.log("count is now", e);
+}, [ve, "on"]);
 function E(e) {
 	return o(e) ? e() : e;
 }
@@ -344,7 +352,7 @@ function D(e) {
 		b(t);
 	}
 }
-function _e(e) {
+function be(e) {
 	++f;
 	try {
 		e();
@@ -436,7 +444,7 @@ function k({ value: e, signal: t }) {
 		}
 	};
 }
-function ve(e) {
+function xe(e) {
 	let t = {
 		_currentValue: e?.initialValue,
 		_pendingValue: e?.initialValue,
@@ -454,9 +462,9 @@ function ve(e) {
 }
 //#endregion
 //#region src/core/markup/types.ts
-var ye = Symbol(), be = Symbol(), xe = Symbol(), A = class {
-	static [xe] = !0;
-	get [be]() {
+var Se = Symbol(), Ce = Symbol(), we = Symbol(), A = class {
+	static [we] = !0;
+	get [Ce]() {
 		return !0;
 	}
 }, j = class extends A {
@@ -477,7 +485,7 @@ var ye = Symbol(), be = Symbol(), xe = Symbol(), A = class {
 		e || this.#e.parentNode?.removeChild(this.#e);
 	}
 	move(e, t) {
-		Me(e, this.#e, t);
+		Fe(e, this.#e, t);
 	}
 };
 //#endregion
@@ -550,7 +558,7 @@ var N = class extends A {
 			a && (r = a);
 		}
 	}
-}, Se = Symbol("parentElement"), P = Symbol("debug"), F = Symbol("isSVG"), Ce = ["ref", "children"], we = class extends A {
+}, Te = Symbol("parentElement"), P = Symbol("debug"), F = Symbol("isSVG"), Ee = ["ref", "children"], De = class extends A {
 	#e;
 	#t;
 	#n;
@@ -560,7 +568,7 @@ var N = class extends A {
 	#o;
 	constructor(e, t, n) {
 		if (super(), this.#t = n, this.#n = e, t === "svg" ? (this.#n = K(e), this.#n[F] = !0, this.#r = !0) : this.#n[F] && t === "foreignObject" && (this.#n = K(e), this.#n[F] = !1, this.#r = !1), this.#n[F] ? this.#e = document.createElementNS("http://www.w3.org/2000/svg", t) : this.#e = document.createElement(t), this.#n[P]) {
-			let e = Le(this.#n);
+			let e = Be(this.#n);
 			e && (this.#e.dataset.view = e.context.name);
 		}
 	}
@@ -572,7 +580,7 @@ var N = class extends A {
 	}
 	mount(e, t) {
 		let r = this.isMounted();
-		if (!r && (this.#c(this.#e, n(Ce, this.#t)), this.#t.children)) {
+		if (!r && (this.#c(this.#e, n(Ee, this.#t)), this.#t.children)) {
 			this.#i = z(this.#n, this.#t.children);
 			for (let e of this.#i) e.mount(this.#e);
 		}
@@ -641,13 +649,13 @@ var N = class extends A {
 			n.forEach((e) => {
 				e(), this.#a.delete(e);
 			}), n.clear(), e.style.cssText = "";
-			let r = Ee(t);
+			let r = ke(t);
 			for (let [t, { value: i, priority: a }] of Object.entries(r)) if (o(i)) {
 				let r = O(i, (n) => {
-					n ? e.style.setProperty(t, Oe(n), a) : e.style.removeProperty(t);
+					n ? e.style.setProperty(t, je(n), a) : e.style.removeProperty(t);
 				});
 				this.#a.add(r), n.add(r);
-			} else i != null && e.style.setProperty(t, Oe(i), a);
+			} else i != null && e.style.setProperty(t, je(i), a);
 		};
 		o(t) ? this.#a.add(O(t, r)) : r(t);
 	}
@@ -656,7 +664,7 @@ var N = class extends A {
 			n.forEach((e) => {
 				e(), this.#a.delete(e);
 			}), n.clear(), I(e, "class", null);
-			let r = Te(t);
+			let r = Oe(t);
 			for (let [t, i] of Object.entries(r)) if (t !== "undefined") if (o(i)) {
 				let r = O(i, (n) => e.classList.toggle(t, !!n));
 				this.#a.add(r), n.add(r);
@@ -665,22 +673,22 @@ var N = class extends A {
 		o(t) ? this.#a.add(O(t, r)) : r(t);
 	}
 };
-function Te(e) {
-	return a(e) ? Object.fromEntries(e.split(" ").map((e) => [e, !0])) : i(e) ? Object.assign({}, ...e.filter(Boolean).map(Te)) : l(e) ? e : {};
+function Oe(e) {
+	return a(e) ? Object.fromEntries(e.split(" ").map((e) => [e, !0])) : i(e) ? Object.assign({}, ...e.filter(Boolean).map(Oe)) : l(e) ? e : {};
 }
-function Ee(e) {
+function ke(e) {
 	return a(e) ? Object.fromEntries(e.split(";").filter((e) => e.trim()).map((e) => {
 		let [t, n] = e.split(":");
-		return [De(t.trim()), {
+		return [Ae(t.trim()), {
 			value: n.replace("!important", "").trim(),
 			priority: n.includes("!important") ? "important" : ""
 		}];
-	})) : i(e) ? Object.assign({}, ...e.filter(Boolean).map(Ee)) : l(e) ? Object.fromEntries(Object.entries(e).map(([e, t]) => [e.startsWith("--") ? e : De(e), { value: t }])) : {};
+	})) : i(e) ? Object.assign({}, ...e.filter(Boolean).map(ke)) : l(e) ? Object.fromEntries(Object.entries(e).map(([e, t]) => [e.startsWith("--") ? e : Ae(e), { value: t }])) : {};
 }
-function De(e) {
+function Ae(e) {
 	return e.replace(/[A-Z]+(?![a-z])|[A-Z]/g, (e, t) => (t ? "-" : "") + e.toLowerCase());
 }
-function Oe(e) {
+function je(e) {
 	return c(e) ? `${e}px` : e;
 }
 function I(e, t, n) {
@@ -690,19 +698,19 @@ function I(e, t, n) {
 //#region src/core/markup/utils.ts
 function L(e, t) {
 	return {
-		[ye]: !0,
+		[Se]: !0,
 		type: e,
 		props: t
 	};
 }
-function ke(e) {
-	return e && e[ye];
+function Me(e) {
+	return e && e[Se];
 }
-function Ae(e) {
-	return e && e[be];
+function Ne(e) {
+	return e && e[Ce];
 }
-function je(e) {
-	return e && e[xe];
+function Pe(e) {
+	return e && e[we];
 }
 function R(e, t = K()) {
 	let n = z(t, e);
@@ -713,10 +721,10 @@ function z(e, ...t) {
 	function r(t) {
 		if (!(t == null || t === !1)) if (i(t)) for (let e = 0; e < t.length; e++) r(t[e]);
 		else if (a(t) || c(t)) n.push(new j(e, V(String(t))));
-		else if (ke(t)) {
+		else if (Me(t)) {
 			let { type: r, props: i } = t;
-			je(r) ? n.push(new r(e, ...i.args)) : o(r) ? n.push(new U(e, r, i)) : a(r) && n.push(new we(e, r, i));
-		} else Ae(t) ? n.push(t) : t instanceof Node ? n.push(new j(e, t)) : o(t) && n.push(new N(e, t));
+			Pe(r) ? n.push(new r(e, ...i.args)) : o(r) ? n.push(new U(e, r, i)) : a(r) && n.push(new De(e, r, i));
+		} else Ne(t) ? n.push(t) : t instanceof Node ? n.push(new j(e, t)) : o(t) && n.push(new N(e, t));
 	}
 	for (let e = 0; e < t.length; e++) r(t[e]);
 	return n;
@@ -727,7 +735,7 @@ function B(e, t, n) {
 function V(e) {
 	return document.createTextNode(e);
 }
-function Me(e, t, n) {
+function Fe(e, t, n) {
 	let r = n?.nextSibling ?? null;
 	if (e.moveBefore) try {
 		e.moveBefore(t, r);
@@ -740,13 +748,13 @@ function H(e, t, n) {
 }
 //#endregion
 //#region src/core/markup/nodes/view.ts
-var Ne = Symbol.for("ViewNode"), U = class extends A {
+var Ie = Symbol.for("ViewNode"), U = class extends A {
 	#e;
 	#t;
 	#n;
 	context;
 	constructor(e, t, n) {
-		super(), this.context = K(e), this.context[Ne] = this, this.context.name = t.name, this.#e = n, this.#t = t;
+		super(), this.context = K(e), this.context[Ie] = this, this.context.name = t.name, this.#e = n, this.#t = t;
 	}
 	getRoot() {
 		return this.#n?.getRoot();
@@ -773,12 +781,12 @@ function K(e) {
 	return Object.assign(Object.create(e ?? null), { isMounted: !1 });
 }
 function q(e) {
-	e.isMounted || (e.isMounted = !0, Pe(e, W));
+	e.isMounted || (e.isMounted = !0, Le(e, W));
 }
 function J(e) {
-	e.isMounted && (e.isMounted = !1, Pe(e, G));
+	e.isMounted && (e.isMounted = !1, Le(e, G));
 }
-function Pe(e, t) {
+function Le(e, t) {
 	if (Object.hasOwn(e, t)) {
 		for (let n of e[t]) n();
 		e[t].length = 0;
@@ -790,74 +798,71 @@ function Y(e, t) {
 function X(e, t) {
 	Object.hasOwn(e, G) ? e[G].push(t) : e[G] = [t];
 }
-function Fe(e, t) {
-	e.isMounted ? X(e, T(t)) : Y(e, () => {
-		X(e, T(t));
+function Re(e, t, n) {
+	e.isMounted ? X(e, T(t, n)) : Y(e, () => {
+		X(e, T(t, n));
 	});
 }
-function Ie(e) {
-	return e[Se];
+function ze(e) {
+	return e[Te];
 }
-function Le(e) {
-	return e[Ne];
+function Be(e) {
+	return e[Ie];
 }
 var Z = Symbol("Dolla.StoreId");
-function Re(e, t, ...n) {
+function Ve(e, t, ...n) {
 	t[Z] ??= Symbol(t.name), r(!Object.hasOwn(e, t[Z]), "Store was already provided on this context.");
 	let i = K(e);
 	return Y(e, () => q(i)), X(e, () => J(i)), i.name = t.name, e[t[Z]] = t.call(i, n[0], i);
 }
-function ze(e, t) {
+function He(e, t) {
 	let n = t[Z], i = n ? e[n] : void 0;
 	return r(i != null, `Store '${t.name}' is not provided by this context.`), i;
 }
 //#endregion
 //#region src/core/root.ts
-function Be(e, t) {
+function Ue(e, t) {
 	let n = a(e) ? document.querySelector(e) : e;
 	r(n, "Element cannot be null.");
 	let i = K();
 	i.name = "dolla:root";
-	let s = [], c = [];
-	i[Se] = n, i[P] = !!t?.debug;
-	let l = null, u = {
-		plugin: d,
-		mount: f,
-		unmount: p
+	let s = [];
+	i[Te] = n, i[P] = !!t?.debug;
+	let c = null, l = {
+		plugin: u,
+		mount: d,
+		unmount: f
 	};
-	function d(e) {
-		return s.push(e), u;
+	function u(e) {
+		return s.push(e), l;
 	}
-	async function f(e) {
-		if (i.isMounted) return;
-		let t = await Promise.all(s.map((e) => e(i)));
-		for (let e of t) o(e) && c.push(e);
-		l = o(e) ? new U(i, e, {}) : R(e, i), l?.mount(n), q(i);
+	async function d(e) {
+		i.isMounted || (await Promise.all(s.map((e) => e(i))), c = o(e) ? new U(i, e, {}) : R(e, i), c?.mount(n), q(i));
 	}
-	async function p() {
-		i.isMounted && (l?.unmount(!1), l = null, J(i), await Promise.all(c.map((e) => e())), c.length = 0);
+	async function f() {
+		i.isMounted && (c?.unmount(!1), c = null, J(i));
 	}
-	return u;
+	return l;
 }
 //#endregion
 //#region src/core/debug.ts
-var Ve = () => {}, He = {
+var We = () => {}, Ge = {
 	trace: 1,
 	info: 1,
 	log: 2,
 	warn: 3,
 	error: 4,
 	silent: 5
-}, Ue = 1, We = (e) => !e.startsWith("dolla:"), Ge = (e) => {
-	Ue = He[e] || 1;
-}, Ke = (e) => {
-	We = e;
+}, Ke = 1, qe = (e) => !e.startsWith("dolla:"), Je = (e) => {
+	Ke = Ge[e] || 1;
+}, Ye = (e) => {
+	qe = e;
 }, Q = globalThis.console || {};
-function qe(e, ...t) {
+function Xe(e, ...t) {
 	let n = e.name, r, i = (e, i) => {
-		if (i < Ue || !We(n) || !Q[e]) return Ve;
+		if (i < Ke || !qe(n) || !Q[e]) return We;
 		if (!r) {
-			let e = "%c" + n, i = [`color:${Ye(n)};font-weight:bold`];
+			let e = "%c" + n, i = [`color:${Qe(n)};font-weight:bold`];
 			for (let [n, r] of t) e += `%c[${n}: %c${r}%c]`, i.push("color:#777", "color:#aaa", "color:#777");
 			r = [e, ...i];
 		}
@@ -881,18 +886,18 @@ function qe(e, ...t) {
 		}
 	};
 }
-function Je(e, ...t) {
+function Ze(e, ...t) {
 	let n = K();
-	return n.name = e, qe(n, ...t);
+	return n.name = e, Xe(n, ...t);
 }
-function Ye(e) {
+function Qe(e) {
 	let t = 0;
 	for (let n = 0; n < e.length; n++) t = (t + e.charCodeAt(n) * 10) % 360;
 	return `oklch(0.68 0.15 ${t}deg)`;
 }
 //#endregion
 //#region src/core/markup/nodes/portal.ts
-var Xe = class extends A {
+var $e = class extends A {
 	#e = V("");
 	#t;
 	#n;
@@ -914,9 +919,9 @@ var Xe = class extends A {
 		this.isMounted() && (e || this.#e.parentNode?.removeChild(this.#e), this.#i?.isMounted() && this.#i.unmount(!1));
 	}
 	move(e, t) {
-		Me(e, this.#e, t);
+		Fe(e, this.#e, t);
 	}
-}, Ze = class extends A {
+}, et = class extends A {
 	#e = V("");
 	#t;
 	#n;
@@ -954,7 +959,7 @@ var Xe = class extends A {
 		if (!this.isMounted()) return;
 		if (e.length === 0) return this._cleanup(!1);
 		let t = /* @__PURE__ */ new Map();
-		_e(() => {
+		be(() => {
 			let n = new Set(e.map((e, t) => this.#r(e, t)));
 			for (let [e, t] of this.#o.entries()) n.has(e) || t._node.unmount(!1);
 			for (let r = 0; r < e.length; r++) {
@@ -983,31 +988,31 @@ var Xe = class extends A {
 };
 //#endregion
 //#region src/core/markup/helpers.ts
-function Qe(e, t, n) {
-	return o(e) ? L(Ze, { args: [
+function tt(e, t, n) {
+	return o(e) ? L(et, { args: [
 		e,
 		t,
 		n
 	] }) : Array.from(e).map((e, t) => n(() => e, () => t));
 }
-function $e(e, t, n) {
+function nt(e, t, n) {
 	return o(e) ? L(N, { args: [w(() => e() ? t : n)] }) : e ? t : n;
 }
-function et(e, t, n) {
-	return $e(e, t, n);
+function rt(e, t, n) {
+	return nt(e, t, n);
 }
-function tt(e, t, n) {
-	return $e(e, n, t);
+function it(e, t, n) {
+	return nt(e, n, t);
 }
-function nt(e, t) {
-	return L(Xe, { args: [t, e] });
+function at(e, t) {
+	return L($e, { args: [t, e] });
 }
 //#endregion
 //#region src/core/markup/html.ts
 var $ = /* @__PURE__ */ function(e) {
 	return e[e.Slash = 0] = "Slash", e[e.Text = 1] = "Text", e[e.Whitespace = 2] = "Whitespace", e[e.TagName = 3] = "TagName", e[e.Comment = 4] = "Comment", e[e.PropSet = 5] = "PropSet", e[e.PropAppend = 6] = "PropAppend", e;
 }($ || {});
-function rt(e, ...t) {
+function ot(e, ...t) {
 	let n = [e, ...t], r = $.Text, i = "", a = "", o = [0], s = "", c = (e) => {
 		r === $.Text && (e || (i = i.replace(/^\s*\n\s*|\s*\n\s*$/g, ""))) ? o.push(e ? n[e] : i) : r === $.TagName && (e || i) ? (o[1] = e ? n[e] : i, r = $.Whitespace) : r === $.Whitespace && i === "..." && e ? o[2] = Object.assign(o[2] || {}, n[e]) : r === $.Whitespace && i && !e ? (o[2] = o[2] || {})[i] = !0 : r >= $.PropSet && (r === $.PropSet ? ((o[2] = o[2] || {})[s] = e ? i ? i + n[e] : n[e] : i, r = $.PropAppend) : (e || i) && (o[2][s] += e ? i + n[e] : i)), i = "";
 	};
@@ -1042,13 +1047,13 @@ function rt(e, ...t) {
 }
 //#endregion
 //#region src/core/ref.ts
-function it() {
+function st() {
 	let e;
 	return ((...t) => t.length ? (e = t[0], () => {
 		e = void 0;
 	}) : e);
 }
 //#endregion
-export { ge as A, t as B, R as C, w as D, _e as E, r as F, i as I, o as L, D as M, O as N, C as O, E as P, l as R, L as S, N as T, X as _, tt as a, U as b, qe as c, Be as d, Re as f, ze as g, Ie as h, Qe as i, ve as j, T as k, Ke as l, Le as m, rt as n, et as o, K as p, nt as r, Je as s, it as t, Ge as u, Fe as v, P as w, H as x, Y as y, a as z };
+export { ge as A, t as B, R as C, w as D, be as E, r as F, i as I, o as L, D as M, O as N, C as O, E as P, l as R, L as S, N as T, X as _, it as a, U as b, Xe as c, Ue as d, Ve as f, He as g, ze as h, tt as i, xe as j, T as k, Ye as l, Be as m, ot as n, rt as o, K as p, at as r, Ze as s, st as t, Je as u, Re as v, P as w, H as x, Y as y, a as z };
 
-//# sourceMappingURL=core-BRSu5hVw.js.map
+//# sourceMappingURL=core-CHBZF6Mb.js.map