@ersbeth/picoflow 0.2.4 → 1.0.1

package/test/array.test.ts

@@ -1,620 +1,600 @@
 import { describe, expect, test, vi } from "vitest";
-import { type FlowState, array, effect, state } from "#package";
+import { array, effect, type FlowState, state } from "#package";
 
 describe("array", () => {
-    test("is initialized", () => {
-        const $array = array([state(1), state(2), state(3)]);
+	test("is initialized", () => {
+		const $array = array([state(1), state(2), state(3)]);
 
-        expect($array.get().map((state) => state.get())).toEqual([1, 2, 3]);
-    });
-
-    test("is updated (set)", () => {
-        const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
-        expect($array.get().map((state) => state.get())).toEqual([0, 1, 2]);
-
-        $array.set([state(1), state(2), state(3)]);
-        expect($array.get().map((state) => state.get())).toEqual([1, 2, 3]);
-    });
-
-    test("is updated (setItem)", () => {
-        const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
-        expect($array.get().map((state) => state.get())).toEqual([0, 1, 2]);
-
-        $array.setItem(0, state(1));
-        expect($array.get().map((state) => state.get())).toEqual([1, 1, 2]);
-
-        $array.setItem(1, state(2));
-        expect($array.get().map((state) => state.get())).toEqual([1, 2, 2]);
-
-        $array.setItem(2, state(3));
-        expect($array.get().map((state) => state.get())).toEqual([1, 2, 3]);
-    });
-
-    test("is updated (push/pop)", () => {
-        const $array = array<FlowState<number>>();
-        expect($array.get()).toEqual([]);
-
-        $array.push(state(0));
-        expect($array.get().map((state) => state.get())).toEqual([0]);
-
-        $array.push(state(1));
-        expect($array.get().map((state) => state.get())).toEqual([0, 1]);
-
-        $array.push(state(2));
-        expect($array.get().map((state) => state.get())).toEqual([0, 1, 2]);
-
-        $array.pop();
-        expect($array.get().map((state) => state.get())).toEqual([0, 1]);
-
-        $array.pop();
-        expect($array.get().map((state) => state.get())).toEqual([0]);
-
-        $array.pop();
-        expect($array.get().map((state) => state.get())).toEqual([]);
-    });
-
-    test("is updated (unshift/shift)", () => {
-        const $array = array<FlowState<number>>();
-        expect($array.get()).toEqual([]);
-
-        $array.unshift(state(0));
-        expect($array.get().map((state) => state.get())).toEqual([0]);
-
-        $array.unshift(state(1));
-        expect($array.get().map((state) => state.get())).toEqual([1, 0]);
-
-        $array.unshift(state(2));
-        expect($array.get().map((state) => state.get())).toEqual([2, 1, 0]);
-
-        $array.shift();
-        expect($array.get().map((state) => state.get())).toEqual([1, 0]);
-
-        $array.shift();
-        expect($array.get().map((state) => state.get())).toEqual([0]);
-
-        $array.shift();
-        expect($array.get().map((state) => state.get())).toEqual([]);
-    });
-
-    test("is updated (splice)", () => {
-        const $array = array<FlowState<number>>([
-            state(0),
-            state(1),
-            state(2),
-            state(3),
-            state(4),
-        ]);
-        expect($array.get().map((state) => state.get())).toEqual([
-            0, 1, 2, 3, 4,
-        ]);
-
-        $array.splice(1, 2);
-        expect($array.get().map((state) => state.get())).toEqual([0, 3, 4]);
-
-        $array.splice(1, 0, state(1), state(2));
-        expect($array.get().map((state) => state.get())).toEqual([
-            0, 1, 2, 3, 4,
-        ]);
-    });
-
-    test("is updated (clear)", () => {
-        const $array = array<FlowState<number>>([
-            state(0),
-            state(1),
-            state(2),
-            state(3),
-            state(4),
-        ]);
-        expect($array.get().map((state) => state.get())).toEqual([
-            0, 1, 2, 3, 4,
-        ]);
-
-        $array.clear();
-        expect($array.get().map((state) => state.get())).toEqual([]);
-    });
-
-    test("is item updated", () => {
-        const $array = array<FlowState<number>>([
-            state(0),
-            state(1),
-            state(2),
-            state(3),
-            state(4),
-        ]);
-        expect($array.get().map((state) => state.get())).toEqual([
-            0, 1, 2, 3, 4,
-        ]);
-
-        $array.get()[0].set(1);
-        expect($array.get().map((state) => state.get())).toEqual([
-            1, 1, 2, 3, 4,
-        ]);
-
-        $array.get()[1].set(2);
-        expect($array.get().map((state) => state.get())).toEqual([
-            1, 2, 2, 3, 4,
-        ]);
-
-        $array.get()[2].set(3);
-        expect($array.get().map((state) => state.get())).toEqual([
-            1, 2, 3, 3, 4,
-        ]);
-
-        $array.get()[3].set(4);
-        expect($array.get().map((state) => state.get())).toEqual([
-            1, 2, 3, 4, 4,
-        ]);
-
-        $array.get()[4].set(5);
-        expect($array.get().map((state) => state.get())).toEqual([
-            1, 2, 3, 4, 5,
-        ]);
-    });
-
-    test("throws when disposed (get)", () => {
-        const $array = array([state(1), state(2), state(3)]);
-        $array.dispose();
-        expect(() => $array.get()).toThrowError(
-            "[PicoFlow] Primitive is disposed",
-        );
-    });
-
-    test("throws when disposed (set)", () => {
-        const $array = array([state(1), state(2), state(3)]);
-        $array.dispose();
-        expect(() => $array.set([state(1)])).toThrowError(
-            "[PicoFlow] Primitive is disposed",
-        );
-    });
-
-    test("throws when disposed (setItem)", () => {
-        const $array = array([state(1), state(2), state(3)]);
-        $array.dispose();
-        expect(() => $array.setItem(0, state(3))).toThrowError(
-            "[PicoFlow] Primitive is disposed",
-        );
-    });
-
-    test("throws when disposed (push)", () => {
-        const $array = array([state(1), state(2), state(3)]);
-        $array.dispose();
-        expect(() => $array.push(state(3))).toThrowError(
-            "[PicoFlow] Primitive is disposed",
-        );
-    });
-
-    test("throws when disposed (pop)", () => {
-        const $array = array([state(1), state(2), state(3)]);
-        $array.dispose();
-        expect(() => $array.pop()).toThrowError(
-            "[PicoFlow] Primitive is disposed",
-        );
-    });
-
-    test("throws when disposed (unshift)", () => {
-        const $array = array([state(1), state(2), state(3)]);
-        $array.dispose();
-        expect(() => $array.unshift(state(3))).toThrowError(
-            "[PicoFlow] Primitive is disposed",
-        );
-    });
-
-    test("throws when disposed (shift)", () => {
-        const $array = array([state(1), state(2), state(3)]);
-        $array.dispose();
-        expect(() => $array.shift()).toThrowError(
-            "[PicoFlow] Primitive is disposed",
-        );
-    });
-
-    test("throws when disposed (splice)", () => {
-        const $array = array<FlowState<number>>([
-            state(0),
-            state(1),
-            state(2),
-            state(3),
-            state(4),
-        ]);
-        $array.dispose();
-        expect(() => $array.splice(1, 2)).toThrowError(
-            "[PicoFlow] Primitive is disposed",
-        );
-    });
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 2, 3]);
+	});
+
+	test("is updated (set)", () => {
+		const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 1, 2]);
+
+		$array.set([state(1), state(2), state(3)]);
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 2, 3]);
+	});
+
+	test("is updated (setItem)", () => {
+		const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 1, 2]);
+
+		$array.setItem(0, state(1));
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 1, 2]);
+
+		$array.setItem(1, state(2));
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 2, 2]);
+
+		$array.setItem(2, state(3));
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 2, 3]);
+	});
+
+	test("is updated (push/pop)", () => {
+		const $array = array<FlowState<number>>();
+		expect($array.pick()).toEqual([]);
+
+		$array.push(state(0));
+		expect($array.pick().map((state) => state.pick())).toEqual([0]);
+
+		$array.push(state(1));
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 1]);
+
+		$array.push(state(2));
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 1, 2]);
+
+		$array.pop();
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 1]);
+
+		$array.pop();
+		expect($array.pick().map((state) => state.pick())).toEqual([0]);
+
+		$array.pop();
+		expect($array.pick().map((state) => state.pick())).toEqual([]);
+	});
+
+	test("is updated (unshift/shift)", () => {
+		const $array = array<FlowState<number>>();
+		expect($array.pick()).toEqual([]);
+
+		$array.unshift(state(0));
+		expect($array.pick().map((state) => state.pick())).toEqual([0]);
+
+		$array.unshift(state(1));
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 0]);
+
+		$array.unshift(state(2));
+		expect($array.pick().map((state) => state.pick())).toEqual([2, 1, 0]);
+
+		$array.shift();
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 0]);
+
+		$array.shift();
+		expect($array.pick().map((state) => state.pick())).toEqual([0]);
+
+		$array.shift();
+		expect($array.pick().map((state) => state.pick())).toEqual([]);
+	});
+
+	test("is updated (splice)", () => {
+		const $array = array<FlowState<number>>([
+			state(0),
+			state(1),
+			state(2),
+			state(3),
+			state(4),
+		]);
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 1, 2, 3, 4]);
+
+		$array.splice(1, 2);
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 3, 4]);
+
+		$array.splice(1, 0, state(1), state(2));
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 1, 2, 3, 4]);
+	});
+
+	test("is updated (clear)", () => {
+		const $array = array<FlowState<number>>([
+			state(0),
+			state(1),
+			state(2),
+			state(3),
+			state(4),
+		]);
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 1, 2, 3, 4]);
+
+		$array.clear();
+		expect($array.pick().map((state) => state.pick())).toEqual([]);
+	});
+
+	test("is item updated", () => {
+		const $array = array<FlowState<number>>([
+			state(0),
+			state(1),
+			state(2),
+			state(3),
+			state(4),
+		]);
+		expect($array.pick().map((state) => state.pick())).toEqual([0, 1, 2, 3, 4]);
+
+		$array.pick()[0].set(1);
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 1, 2, 3, 4]);
+
+		$array.pick()[1].set(2);
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 2, 2, 3, 4]);
+
+		$array.pick()[2].set(3);
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 2, 3, 3, 4]);
+
+		$array.pick()[3].set(4);
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 2, 3, 4, 4]);
+
+		$array.pick()[4].set(5);
+		expect($array.pick().map((state) => state.pick())).toEqual([1, 2, 3, 4, 5]);
+	});
+
+	test("throws when disposed (get)", () => {
+		const $array = array([state(1), state(2), state(3)]);
+		$array.dispose();
+		expect(() => $array.pick()).toThrowError(
+			"[PicoFlow] Primitive is disposed",
+		);
+	});
+
+	test("throws when disposed (set)", () => {
+		const $array = array([state(1), state(2), state(3)]);
+		$array.dispose();
+		expect(() => $array.set([state(1)])).toThrowError(
+			"[PicoFlow] Primitive is disposed",
+		);
+	});
+
+	test("throws when disposed (setItem)", () => {
+		const $array = array([state(1), state(2), state(3)]);
+		$array.dispose();
+		expect(() => $array.setItem(0, state(3))).toThrowError(
+			"[PicoFlow] Primitive is disposed",
+		);
+	});
+
+	test("throws when disposed (push)", () => {
+		const $array = array([state(1), state(2), state(3)]);
+		$array.dispose();
+		expect(() => $array.push(state(3))).toThrowError(
+			"[PicoFlow] Primitive is disposed",
+		);
+	});
+
+	test("throws when disposed (pop)", () => {
+		const $array = array([state(1), state(2), state(3)]);
+		$array.dispose();
+		expect(() => $array.pop()).toThrowError("[PicoFlow] Primitive is disposed");
+	});
+
+	test("throws when disposed (unshift)", () => {
+		const $array = array([state(1), state(2), state(3)]);
+		$array.dispose();
+		expect(() => $array.unshift(state(3))).toThrowError(
+			"[PicoFlow] Primitive is disposed",
+		);
+	});
+
+	test("throws when disposed (shift)", () => {
+		const $array = array([state(1), state(2), state(3)]);
+		$array.dispose();
+		expect(() => $array.shift()).toThrowError(
+			"[PicoFlow] Primitive is disposed",
+		);
+	});
+
+	test("throws when disposed (splice)", () => {
+		const $array = array<FlowState<number>>([
+			state(0),
+			state(1),
+			state(2),
+			state(3),
+			state(4),
+		]);
+		$array.dispose();
+		expect(() => $array.splice(1, 2)).toThrowError(
+			"[PicoFlow] Primitive is disposed",
+		);
+	});
 });
 
 describe("effect", () => {
-    test("called when initialized", () => {
-        const $array = array([state(1), state(2), state(3)]);
-        const effectFn = vi.fn();
-        effect((get) => effectFn(get($array).map((state) => get(state))));
-
-        expect(effectFn).toHaveBeenCalledTimes(1);
-        expect(effectFn).toHaveBeenLastCalledWith([1, 2, 3]);
-    });
-
-    test("called when updated (set)", () => {
-        const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
-        const effectFn = vi.fn();
-        effect((get) => effectFn(get($array).map((state) => get(state))));
-
-        expect(effectFn).toHaveBeenCalledTimes(1);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2]);
-
-        $array.set([state(1), state(2), state(3)]);
-        expect(effectFn).toHaveBeenLastCalledWith([1, 2, 3]);
-    });
-
-    test("called when updated (push/pop)", () => {
-        const $array = array<FlowState<number>>();
-        const effectFn = vi.fn();
-        effect((get) => effectFn(get($array).map((state) => get(state))));
-
-        expect(effectFn).toHaveBeenCalledTimes(1);
-        expect(effectFn).toHaveBeenLastCalledWith([]);
-
-        $array.push(state(0));
-        expect(effectFn).toHaveBeenCalledTimes(2);
-        expect(effectFn).toHaveBeenLastCalledWith([0]);
-
-        $array.push(state(1));
-        expect(effectFn).toHaveBeenCalledTimes(3);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 1]);
-
-        $array.push(state(2));
-        expect(effectFn).toHaveBeenCalledTimes(4);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2]);
-
-        $array.pop();
-        expect(effectFn).toHaveBeenCalledTimes(5);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 1]);
-
-        $array.pop();
-        expect(effectFn).toHaveBeenCalledTimes(6);
-        expect(effectFn).toHaveBeenLastCalledWith([0]);
-
-        $array.pop();
-        expect(effectFn).toHaveBeenCalledTimes(7);
-        expect(effectFn).toHaveBeenLastCalledWith([]);
-    });
-
-    test("called when updated (unshift/shift)", () => {
-        const $array = array<FlowState<number>>();
-        const effectFn = vi.fn();
-        effect((get) => effectFn(get($array).map((state) => get(state))));
-
-        expect(effectFn).toHaveBeenCalledTimes(1);
-        expect(effectFn).toHaveBeenLastCalledWith([]);
-
-        $array.unshift(state(0));
-        expect(effectFn).toHaveBeenCalledTimes(2);
-        expect(effectFn).toHaveBeenLastCalledWith([0]);
-
-        $array.unshift(state(1));
-        expect(effectFn).toHaveBeenCalledTimes(3);
-        expect(effectFn).toHaveBeenLastCalledWith([1, 0]);
-
-        $array.unshift(state(2));
-        expect(effectFn).toHaveBeenCalledTimes(4);
-        expect(effectFn).toHaveBeenLastCalledWith([2, 1, 0]);
-
-        $array.shift();
-        expect(effectFn).toHaveBeenCalledTimes(5);
-        expect(effectFn).toHaveBeenLastCalledWith([1, 0]);
-
-        $array.shift();
-        expect(effectFn).toHaveBeenCalledTimes(6);
-        expect(effectFn).toHaveBeenLastCalledWith([0]);
-
-        $array.shift();
-        expect(effectFn).toHaveBeenCalledTimes(7);
-        expect(effectFn).toHaveBeenLastCalledWith([]);
-    });
-
-    test("called when updated (splice)", () => {
-        const $array = array<FlowState<number>>([
-            state(0),
-            state(1),
-            state(2),
-            state(3),
-            state(4),
-        ]);
-        const effectFn = vi.fn();
-        effect((get) => effectFn(get($array).map((state) => get(state))));
-
-        expect(effectFn).toHaveBeenCalledTimes(1);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2, 3, 4]);
-
-        $array.splice(1, 2);
-        expect(effectFn).toHaveBeenCalledTimes(2);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 3, 4]);
-
-        $array.splice(1, 0, state(1), state(2));
-        expect(effectFn).toHaveBeenCalledTimes(3);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2, 3, 4]);
-    });
-
-    test("called when updated (clear)", () => {
-        const $array = array<FlowState<number>>([
-            state(0),
-            state(1),
-            state(2),
-            state(3),
-            state(4),
-        ]);
-        const effectFn = vi.fn();
-        effect((get) => effectFn(get($array).map((state) => get(state))));
-
-        expect(effectFn).toHaveBeenCalledTimes(1);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2, 3, 4]);
-
-        $array.clear();
-        expect(effectFn).toHaveBeenCalledTimes(2);
-        expect(effectFn).toHaveBeenLastCalledWith([]);
-    });
-
-    test("called when item updated", () => {
-        const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
-        const effectFn = vi.fn();
-        const effect0Fn = vi.fn();
-        const effect1Fn = vi.fn();
-        const effect2Fn = vi.fn();
-
-        effect((get) => effectFn(get($array).map((state) => get(state))));
-        effect((get) => effect0Fn(get(get($array)[0])));
-        effect((get) => effect1Fn(get(get($array)[1])));
-        effect((get) => effect2Fn(get(get($array)[2])));
-
-        expect(effectFn).toHaveBeenCalledTimes(1);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2]);
-        expect(effect0Fn).toHaveBeenCalledTimes(1);
-        expect(effect0Fn).toHaveBeenLastCalledWith(0);
-        expect(effect1Fn).toHaveBeenCalledTimes(1);
-        expect(effect1Fn).toHaveBeenLastCalledWith(1);
-        expect(effect2Fn).toHaveBeenCalledTimes(1);
-        expect(effect2Fn).toHaveBeenLastCalledWith(2);
-
-        $array.get()[0].set(1);
-        expect(effectFn).toHaveBeenCalledTimes(2);
-        expect(effectFn).toHaveBeenLastCalledWith([1, 1, 2]);
-        expect(effect0Fn).toHaveBeenCalledTimes(2);
-        expect(effect0Fn).toHaveBeenLastCalledWith(1);
-        expect(effect1Fn).toHaveBeenCalledTimes(1);
-        expect(effect1Fn).toHaveBeenLastCalledWith(1);
-        expect(effect2Fn).toHaveBeenCalledTimes(1);
-        expect(effect2Fn).toHaveBeenLastCalledWith(2);
-
-        $array.get()[1].set(2);
-        expect(effectFn).toHaveBeenCalledTimes(3);
-        expect(effectFn).toHaveBeenLastCalledWith([1, 2, 2]);
-        expect(effect0Fn).toHaveBeenCalledTimes(2);
-        expect(effect0Fn).toHaveBeenLastCalledWith(1);
-        expect(effect1Fn).toHaveBeenCalledTimes(2);
-        expect(effect1Fn).toHaveBeenLastCalledWith(2);
-        expect(effect2Fn).toHaveBeenCalledTimes(1);
-        expect(effect2Fn).toHaveBeenLastCalledWith(2);
-
-        $array.get()[2].set(3);
-        expect(effectFn).toHaveBeenCalledTimes(4);
-        expect(effectFn).toHaveBeenLastCalledWith([1, 2, 3]);
-        expect(effect0Fn).toHaveBeenCalledTimes(2);
-        expect(effect0Fn).toHaveBeenLastCalledWith(1);
-        expect(effect1Fn).toHaveBeenCalledTimes(2);
-        expect(effect1Fn).toHaveBeenLastCalledWith(2);
-        expect(effect2Fn).toHaveBeenCalledTimes(2);
-        expect(effect2Fn).toHaveBeenLastCalledWith(3);
-    });
-
-    test("called when item replaced", () => {
-        const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
-        const effectFn = vi.fn();
-        const effect0Fn = vi.fn();
-
-        effect((get) => effectFn(get($array).map((state) => get(state))));
-        effect((get) => effect0Fn(get(get($array)[0])));
-
-        expect(effectFn).toHaveBeenCalledTimes(1);
-        expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2]);
-        expect(effect0Fn).toHaveBeenCalledTimes(1);
-        expect(effect0Fn).toHaveBeenLastCalledWith(0);
-
-        $array.setItem(0, state(3));
-        expect(effectFn).toHaveBeenCalledTimes(2);
-        expect(effectFn).toHaveBeenLastCalledWith([3, 1, 2]);
-        expect(effect0Fn).toHaveBeenCalledTimes(2);
-        expect(effect0Fn).toHaveBeenLastCalledWith(3);
-
-        $array.shift();
-        expect(effectFn).toHaveBeenCalledTimes(3);
-        expect(effectFn).toHaveBeenLastCalledWith([1, 2]);
-        expect(effect0Fn).toHaveBeenCalledTimes(3);
-        expect(effect0Fn).toHaveBeenLastCalledWith(1);
-
-        $array.unshift(state(4));
-        expect(effectFn).toHaveBeenCalledTimes(4);
-        expect(effectFn).toHaveBeenLastCalledWith([4, 1, 2]);
-        expect(effect0Fn).toHaveBeenCalledTimes(4);
-        expect(effect0Fn).toHaveBeenLastCalledWith(4);
-    });
-
-    describe("lastAction", () => {
-        test("called when initialized", () => {
-            const $array = array([1, 2, 3]);
-            const effectFn = vi.fn();
-            effect((get) => effectFn(get($array.$lastAction)));
-
-            expect(effectFn).toHaveBeenCalledTimes(1);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "set",
-                items: [1, 2, 3],
-            });
-        });
-
-        test("called when updated (set)", () => {
-            const $array = array([0, 1, 2]);
-            const effectFn = vi.fn();
-            effect((get) => effectFn(get($array.$lastAction)));
-
-            expect(effectFn).toHaveBeenCalledTimes(1);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "set",
-                items: [0, 1, 2],
-            });
-            $array.set([1, 2, 3]);
-            expect(effectFn).toHaveBeenCalledTimes(2);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "set",
-                items: [1, 2, 3],
-            });
-        });
-
-        test("called when updated (push/pop)", () => {
-            const $array = array<number>();
-            const effectFn = vi.fn();
-            effect((get) => effectFn(get($array.$lastAction)));
-
-            expect(effectFn).toHaveBeenCalledTimes(1);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "set",
-                items: [],
-            });
-
-            $array.push(0);
-            expect(effectFn).toHaveBeenCalledTimes(2);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "push",
-                item: 0,
-            });
-
-            $array.push(1);
-            expect(effectFn).toHaveBeenCalledTimes(3);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "push",
-                item: 1,
-            });
-
-            $array.push(2);
-            expect(effectFn).toHaveBeenCalledTimes(4);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "push",
-                item: 2,
-            });
-
-            $array.pop();
-            expect(effectFn).toHaveBeenCalledTimes(5);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "pop",
-            });
-
-            $array.pop();
-            expect(effectFn).toHaveBeenCalledTimes(6);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "pop",
-            });
-
-            $array.pop();
-            expect(effectFn).toHaveBeenCalledTimes(7);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "pop",
-            });
-        });
-
-        test("called when updated (unshift/shift)", () => {
-            const $array = array<number>();
-            const effectFn = vi.fn();
-            effect((get) => effectFn(get($array.$lastAction)));
-
-            expect(effectFn).toHaveBeenCalledTimes(1);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "set",
-                items: [],
-            });
-
-            $array.unshift(0);
-            expect(effectFn).toHaveBeenCalledTimes(2);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "unshift",
-                item: 0,
-            });
-
-            $array.unshift(1);
-            expect(effectFn).toHaveBeenCalledTimes(3);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "unshift",
-                item: 1,
-            });
-
-            $array.unshift(2);
-            expect(effectFn).toHaveBeenCalledTimes(4);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "unshift",
-                item: 2,
-            });
-
-            $array.shift();
-            expect(effectFn).toHaveBeenCalledTimes(5);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "shift",
-            });
-
-            $array.shift();
-            expect(effectFn).toHaveBeenCalledTimes(6);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "shift",
-            });
-
-            $array.shift();
-            expect(effectFn).toHaveBeenCalledTimes(7);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "shift",
-            });
-        });
-
-        test("called when updated (splice)", () => {
-            const $array = array<number>([0, 1, 2, 3, 4]);
-            const effectFn = vi.fn();
-            effect((get) => effectFn(get($array.$lastAction)));
-
-            expect(effectFn).toHaveBeenCalledTimes(1);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "set",
-                items: [0, 1, 2, 3, 4],
-            });
-
-            $array.splice(1, 2);
-            expect(effectFn).toHaveBeenCalledTimes(2);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "splice",
-                start: 1,
-                deleteCount: 2,
-                items: [],
-            });
-
-            $array.splice(1, 0, 1, 2);
-            expect(effectFn).toHaveBeenCalledTimes(3);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "splice",
-                start: 1,
-                deleteCount: 0,
-                items: [1, 2],
-            });
-        });
-
-        test("called when updated (clear)", () => {
-            const $array = array<number>([0, 1, 2, 3, 4]);
-            const effectFn = vi.fn();
-            effect((get) => effectFn(get($array.$lastAction)));
-
-            expect(effectFn).toHaveBeenCalledTimes(1);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "set",
-                items: [0, 1, 2, 3, 4],
-            });
-
-            $array.clear();
-            expect(effectFn).toHaveBeenCalledTimes(2);
-            expect(effectFn).toHaveBeenLastCalledWith({
-                type: "clear",
-            });
-        });
-    });
+	test("called when initialized", () => {
+		const $array = array([state(1), state(2), state(3)]);
+		const effectFn = vi.fn();
+		effect((t) => effectFn($array.get(t).map((state) => state.get(t))));
+
+		expect(effectFn).toHaveBeenCalledTimes(1);
+		expect(effectFn).toHaveBeenLastCalledWith([1, 2, 3]);
+	});
+
+	test("called when updated (set)", () => {
+		const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
+		const effectFn = vi.fn();
+		effect((t) => effectFn($array.get(t).map((state) => state.get(t))));
+
+		expect(effectFn).toHaveBeenCalledTimes(1);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2]);
+
+		$array.set([state(1), state(2), state(3)]);
+		expect(effectFn).toHaveBeenLastCalledWith([1, 2, 3]);
+	});
+
+	test("called when updated (push/pop)", () => {
+		const $array = array<FlowState<number>>();
+		const effectFn = vi.fn();
+		effect((t) => effectFn($array.get(t).map((state) => state.get(t))));
+
+		expect(effectFn).toHaveBeenCalledTimes(1);
+		expect(effectFn).toHaveBeenLastCalledWith([]);
+
+		$array.push(state(0));
+		expect(effectFn).toHaveBeenCalledTimes(2);
+		expect(effectFn).toHaveBeenLastCalledWith([0]);
+
+		$array.push(state(1));
+		expect(effectFn).toHaveBeenCalledTimes(3);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 1]);
+
+		$array.push(state(2));
+		expect(effectFn).toHaveBeenCalledTimes(4);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2]);
+
+		$array.pop();
+		expect(effectFn).toHaveBeenCalledTimes(5);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 1]);
+
+		$array.pop();
+		expect(effectFn).toHaveBeenCalledTimes(6);
+		expect(effectFn).toHaveBeenLastCalledWith([0]);
+
+		$array.pop();
+		expect(effectFn).toHaveBeenCalledTimes(7);
+		expect(effectFn).toHaveBeenLastCalledWith([]);
+	});
+
+	test("called when updated (unshift/shift)", () => {
+		const $array = array<FlowState<number>>();
+		const effectFn = vi.fn();
+		effect((t) => effectFn($array.get(t).map((state) => state.get(t))));
+
+		expect(effectFn).toHaveBeenCalledTimes(1);
+		expect(effectFn).toHaveBeenLastCalledWith([]);
+
+		$array.unshift(state(0));
+		expect(effectFn).toHaveBeenCalledTimes(2);
+		expect(effectFn).toHaveBeenLastCalledWith([0]);
+
+		$array.unshift(state(1));
+		expect(effectFn).toHaveBeenCalledTimes(3);
+		expect(effectFn).toHaveBeenLastCalledWith([1, 0]);
+
+		$array.unshift(state(2));
+		expect(effectFn).toHaveBeenCalledTimes(4);
+		expect(effectFn).toHaveBeenLastCalledWith([2, 1, 0]);
+
+		$array.shift();
+		expect(effectFn).toHaveBeenCalledTimes(5);
+		expect(effectFn).toHaveBeenLastCalledWith([1, 0]);
+
+		$array.shift();
+		expect(effectFn).toHaveBeenCalledTimes(6);
+		expect(effectFn).toHaveBeenLastCalledWith([0]);
+
+		$array.shift();
+		expect(effectFn).toHaveBeenCalledTimes(7);
+		expect(effectFn).toHaveBeenLastCalledWith([]);
+	});
+
+	test("called when updated (splice)", () => {
+		const $array = array<FlowState<number>>([
+			state(0),
+			state(1),
+			state(2),
+			state(3),
+			state(4),
+		]);
+		const effectFn = vi.fn();
+		effect((t) => effectFn($array.get(t).map((state) => state.get(t))));
+
+		expect(effectFn).toHaveBeenCalledTimes(1);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2, 3, 4]);
+
+		$array.splice(1, 2);
+		expect(effectFn).toHaveBeenCalledTimes(2);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 3, 4]);
+
+		$array.splice(1, 0, state(1), state(2));
+		expect(effectFn).toHaveBeenCalledTimes(3);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2, 3, 4]);
+	});
+
+	test("called when updated (clear)", () => {
+		const $array = array<FlowState<number>>([
+			state(0),
+			state(1),
+			state(2),
+			state(3),
+			state(4),
+		]);
+		const effectFn = vi.fn();
+		effect((t) => effectFn($array.get(t).map((state) => state.get(t))));
+
+		expect(effectFn).toHaveBeenCalledTimes(1);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2, 3, 4]);
+
+		$array.clear();
+		expect(effectFn).toHaveBeenCalledTimes(2);
+		expect(effectFn).toHaveBeenLastCalledWith([]);
+	});
+
+	test("called when item updated", () => {
+		const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
+		const effectFn = vi.fn();
+		const effect0Fn = vi.fn();
+		const effect1Fn = vi.fn();
+		const effect2Fn = vi.fn();
+
+		effect((t) => effectFn($array.get(t).map((state) => state.get(t))));
+		effect((t) => effect0Fn($array.get(t)[0].get(t)));
+		effect((t) => effect1Fn($array.get(t)[1].get(t)));
+		effect((t) => effect2Fn($array.get(t)[2].get(t)));
+
+		expect(effectFn).toHaveBeenCalledTimes(1);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2]);
+		expect(effect0Fn).toHaveBeenCalledTimes(1);
+		expect(effect0Fn).toHaveBeenLastCalledWith(0);
+		expect(effect1Fn).toHaveBeenCalledTimes(1);
+		expect(effect1Fn).toHaveBeenLastCalledWith(1);
+		expect(effect2Fn).toHaveBeenCalledTimes(1);
+		expect(effect2Fn).toHaveBeenLastCalledWith(2);
+
+		$array.pick()[0].set(1);
+		expect(effectFn).toHaveBeenCalledTimes(2);
+		expect(effectFn).toHaveBeenLastCalledWith([1, 1, 2]);
+		expect(effect0Fn).toHaveBeenCalledTimes(2);
+		expect(effect0Fn).toHaveBeenLastCalledWith(1);
+		expect(effect1Fn).toHaveBeenCalledTimes(1);
+		expect(effect1Fn).toHaveBeenLastCalledWith(1);
+		expect(effect2Fn).toHaveBeenCalledTimes(1);
+		expect(effect2Fn).toHaveBeenLastCalledWith(2);
+
+		$array.pick()[1].set(2);
+		expect(effectFn).toHaveBeenCalledTimes(3);
+		expect(effectFn).toHaveBeenLastCalledWith([1, 2, 2]);
+		expect(effect0Fn).toHaveBeenCalledTimes(2);
+		expect(effect0Fn).toHaveBeenLastCalledWith(1);
+		expect(effect1Fn).toHaveBeenCalledTimes(2);
+		expect(effect1Fn).toHaveBeenLastCalledWith(2);
+		expect(effect2Fn).toHaveBeenCalledTimes(1);
+		expect(effect2Fn).toHaveBeenLastCalledWith(2);
+
+		$array.pick()[2].set(3);
+		expect(effectFn).toHaveBeenCalledTimes(4);
+		expect(effectFn).toHaveBeenLastCalledWith([1, 2, 3]);
+		expect(effect0Fn).toHaveBeenCalledTimes(2);
+		expect(effect0Fn).toHaveBeenLastCalledWith(1);
+		expect(effect1Fn).toHaveBeenCalledTimes(2);
+		expect(effect1Fn).toHaveBeenLastCalledWith(2);
+		expect(effect2Fn).toHaveBeenCalledTimes(2);
+		expect(effect2Fn).toHaveBeenLastCalledWith(3);
+	});
+
+	test("called when item replaced", () => {
+		const $array = array<FlowState<number>>([state(0), state(1), state(2)]);
+		const effectFn = vi.fn();
+		const effect0Fn = vi.fn();
+
+		effect((t) => effectFn($array.get(t).map((state) => state.get(t))));
+		effect((t) => effect0Fn($array.get(t)[0].get(t)));
+
+		expect(effectFn).toHaveBeenCalledTimes(1);
+		expect(effectFn).toHaveBeenLastCalledWith([0, 1, 2]);
+		expect(effect0Fn).toHaveBeenCalledTimes(1);
+		expect(effect0Fn).toHaveBeenLastCalledWith(0);
+
+		$array.setItem(0, state(3));
+		expect(effectFn).toHaveBeenCalledTimes(2);
+		expect(effectFn).toHaveBeenLastCalledWith([3, 1, 2]);
+		expect(effect0Fn).toHaveBeenCalledTimes(2);
+		expect(effect0Fn).toHaveBeenLastCalledWith(3);
+
+		$array.shift();
+		expect(effectFn).toHaveBeenCalledTimes(3);
+		expect(effectFn).toHaveBeenLastCalledWith([1, 2]);
+		expect(effect0Fn).toHaveBeenCalledTimes(3);
+		expect(effect0Fn).toHaveBeenLastCalledWith(1);
+
+		$array.unshift(state(4));
+		expect(effectFn).toHaveBeenCalledTimes(4);
+		expect(effectFn).toHaveBeenLastCalledWith([4, 1, 2]);
+		expect(effect0Fn).toHaveBeenCalledTimes(4);
+		expect(effect0Fn).toHaveBeenLastCalledWith(4);
+	});
+
+	describe("lastAction", () => {
+		test("called when initialized", () => {
+			const $array = array([1, 2, 3]);
+			const effectFn = vi.fn();
+			effect((t) => effectFn($array.$lastAction.get(t)));
+
+			expect(effectFn).toHaveBeenCalledTimes(1);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "set",
+				items: [1, 2, 3],
+			});
+		});
+
+		test("called when updated (set)", () => {
+			const $array = array([0, 1, 2]);
+			const effectFn = vi.fn();
+			effect((t) => effectFn($array.$lastAction.get(t)));
+
+			expect(effectFn).toHaveBeenCalledTimes(1);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "set",
+				items: [0, 1, 2],
+			});
+			$array.set([1, 2, 3]);
+			expect(effectFn).toHaveBeenCalledTimes(2);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "set",
+				items: [1, 2, 3],
+			});
+		});
+
+		test("called when updated (push/pop)", () => {
+			const $array = array<number>();
+			const effectFn = vi.fn();
+			effect((t) => effectFn($array.$lastAction.get(t)));
+
+			expect(effectFn).toHaveBeenCalledTimes(1);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "set",
+				items: [],
+			});
+
+			$array.push(0);
+			expect(effectFn).toHaveBeenCalledTimes(2);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "push",
+				item: 0,
+			});
+
+			$array.push(1);
+			expect(effectFn).toHaveBeenCalledTimes(3);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "push",
+				item: 1,
+			});
+
+			$array.push(2);
+			expect(effectFn).toHaveBeenCalledTimes(4);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "push",
+				item: 2,
+			});
+
+			$array.pop();
+			expect(effectFn).toHaveBeenCalledTimes(5);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "pop",
+			});
+
+			$array.pop();
+			expect(effectFn).toHaveBeenCalledTimes(6);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "pop",
+			});
+
+			$array.pop();
+			expect(effectFn).toHaveBeenCalledTimes(7);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "pop",
+			});
+		});
+
+		test("called when updated (unshift/shift)", () => {
+			const $array = array<number>();
+			const effectFn = vi.fn();
+			effect((t) => effectFn($array.$lastAction.get(t)));
+
+			expect(effectFn).toHaveBeenCalledTimes(1);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "set",
+				items: [],
+			});
+
+			$array.unshift(0);
+			expect(effectFn).toHaveBeenCalledTimes(2);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "unshift",
+				item: 0,
+			});
+
+			$array.unshift(1);
+			expect(effectFn).toHaveBeenCalledTimes(3);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "unshift",
+				item: 1,
+			});
+
+			$array.unshift(2);
+			expect(effectFn).toHaveBeenCalledTimes(4);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "unshift",
+				item: 2,
+			});
+
+			$array.shift();
+			expect(effectFn).toHaveBeenCalledTimes(5);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "shift",
+			});
+
+			$array.shift();
+			expect(effectFn).toHaveBeenCalledTimes(6);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "shift",
+			});
+
+			$array.shift();
+			expect(effectFn).toHaveBeenCalledTimes(7);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "shift",
+			});
+		});
+
+		test("called when updated (splice)", () => {
+			const $array = array<number>([0, 1, 2, 3, 4]);
+			const effectFn = vi.fn();
+			effect((t) => effectFn($array.$lastAction.get(t)));
+
+			expect(effectFn).toHaveBeenCalledTimes(1);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "set",
+				items: [0, 1, 2, 3, 4],
+			});
+
+			$array.splice(1, 2);
+			expect(effectFn).toHaveBeenCalledTimes(2);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "splice",
+				start: 1,
+				deleteCount: 2,
+				items: [],
+			});
+
+			$array.splice(1, 0, 1, 2);
+			expect(effectFn).toHaveBeenCalledTimes(3);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "splice",
+				start: 1,
+				deleteCount: 0,
+				items: [1, 2],
+			});
+		});
+
+		test("called when updated (clear)", () => {
+			const $array = array<number>([0, 1, 2, 3, 4]);
+			const effectFn = vi.fn();
+			effect((t) => effectFn($array.$lastAction.get(t)));
+
+			expect(effectFn).toHaveBeenCalledTimes(1);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "set",
+				items: [0, 1, 2, 3, 4],
+			});
+
+			$array.clear();
+			expect(effectFn).toHaveBeenCalledTimes(2);
+			expect(effectFn).toHaveBeenLastCalledWith({
+				type: "clear",
+			});
+		});
+	});
 });