rask-ui 0.21.0 → 0.23.0

package/dist/tests/createComputed.test.js

@@ -1,257 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-import { createComputed } from "../createComputed";
-import { createState } from "../createState";
-import { Observer } from "../observation";
-describe("createComputed", () => {
-    it("should compute values lazily", () => {
-        const state = createState({ count: 5 });
-        const computeFn = vi.fn(() => state.count * 2);
-        const computed = createComputed({
-            doubled: computeFn,
-        });
-        // Should not compute until accessed
-        expect(computeFn).not.toHaveBeenCalled();
-        const result = computed.doubled;
-        expect(computeFn).toHaveBeenCalledTimes(1);
-        expect(result).toBe(10);
-    });
-    it("should cache computed values", () => {
-        const state = createState({ count: 5 });
-        const computeFn = vi.fn(() => state.count * 2);
-        const computed = createComputed({
-            doubled: computeFn,
-        });
-        // Access multiple times
-        computed.doubled;
-        computed.doubled;
-        computed.doubled;
-        // Should only compute once due to caching
-        expect(computeFn).toHaveBeenCalledTimes(1);
-    });
-    it("should invalidate cache when dependencies change", async () => {
-        const state = createState({ count: 5 });
-        const computeFn = vi.fn(() => state.count * 2);
-        const computed = createComputed({
-            doubled: computeFn,
-        });
-        expect(computed.doubled).toBe(10);
-        expect(computeFn).toHaveBeenCalledTimes(1);
-        // Change dependency
-        state.count = 10;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        // Should recompute on next access
-        expect(computed.doubled).toBe(20);
-        expect(computeFn).toHaveBeenCalledTimes(2);
-    });
-    it("should handle multiple computed properties", async () => {
-        const state = createState({ width: 10, height: 5 });
-        const computed = createComputed({
-            area: () => state.width * state.height,
-            perimeter: () => 2 * (state.width + state.height),
-        });
-        expect(computed.area).toBe(50);
-        expect(computed.perimeter).toBe(30);
-        state.width = 20;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.area).toBe(100);
-        expect(computed.perimeter).toBe(50);
-    });
-    it("should support computed properties depending on other computed properties", async () => {
-        const state = createState({ count: 5 });
-        const computed = createComputed({
-            doubled: () => state.count * 2,
-            quadrupled: () => computed.doubled * 2,
-        });
-        expect(computed.doubled).toBe(10);
-        expect(computed.quadrupled).toBe(20);
-        state.count = 10;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.doubled).toBe(20);
-        expect(computed.quadrupled).toBe(40);
-    });
-    it("should be reactive when observed", async () => {
-        const state = createState({ count: 5 });
-        const computed = createComputed({
-            doubled: () => state.count * 2,
-        });
-        let observedValue = null;
-        const observer = new Observer(() => {
-            observedValue = computed.doubled;
-        });
-        const dispose = observer.observe();
-        computed.doubled; // Track the computed
-        dispose();
-        expect(observedValue).toBe(null);
-        // Change state
-        state.count = 10;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(observedValue).toBe(20);
-        observer.dispose();
-    });
-    it("should only recompute when actual dependencies change", () => {
-        const state = createState({ a: 1, b: 2 });
-        const computeFn = vi.fn(() => state.a * 2);
-        const computed = createComputed({
-            result: computeFn,
-        });
-        expect(computed.result).toBe(2);
-        expect(computeFn).toHaveBeenCalledTimes(1);
-        // Change unrelated property
-        state.b = 100;
-        // Should still return cached value
-        expect(computed.result).toBe(2);
-        expect(computeFn).toHaveBeenCalledTimes(1);
-    });
-    it("should handle complex dependency chains", async () => {
-        const state = createState({
-            items: [1, 2, 3, 4, 5],
-            multiplier: 2,
-        });
-        const computed = createComputed({
-            total: () => state.items.reduce((sum, item) => sum + item, 0),
-            multipliedTotal: () => computed.total * state.multiplier,
-            average: () => computed.total / state.items.length,
-        });
-        expect(computed.total).toBe(15);
-        expect(computed.multipliedTotal).toBe(30);
-        expect(computed.average).toBe(3);
-        state.items.push(6);
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.total).toBe(21);
-        expect(computed.multipliedTotal).toBe(42);
-        expect(computed.average).toBe(3.5);
-        state.multiplier = 3;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.multipliedTotal).toBe(63);
-    });
-    it("should handle array operations", async () => {
-        const state = createState({ items: [1, 2, 3] });
-        const computed = createComputed({
-            sum: () => state.items.reduce((sum, item) => sum + item, 0),
-            count: () => state.items.length,
-        });
-        expect(computed.sum).toBe(6);
-        expect(computed.count).toBe(3);
-        state.items.push(4);
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.sum).toBe(10);
-        expect(computed.count).toBe(4);
-        state.items.pop();
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.sum).toBe(6);
-        expect(computed.count).toBe(3);
-    });
-    it("should handle deeply nested state", async () => {
-        const state = createState({
-            user: {
-                profile: {
-                    name: "Alice",
-                    age: 30,
-                },
-            },
-        });
-        const computed = createComputed({
-            displayName: () => `${state.user.profile.name} (${state.user.profile.age})`,
-        });
-        expect(computed.displayName).toBe("Alice (30)");
-        state.user.profile.name = "Bob";
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.displayName).toBe("Bob (30)");
-        state.user.profile.age = 25;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.displayName).toBe("Bob (25)");
-    });
-    it("should not recompute unnecessarily with nested computed", async () => {
-        const state = createState({ count: 5 });
-        const innerFn = vi.fn(() => state.count * 2);
-        const outerFn = vi.fn(() => computed.inner + 10);
-        const computed = createComputed({
-            inner: innerFn,
-            outer: outerFn,
-        });
-        // Access outer (should compute both)
-        expect(computed.outer).toBe(20);
-        expect(innerFn).toHaveBeenCalledTimes(1);
-        expect(outerFn).toHaveBeenCalledTimes(1);
-        // Access outer again (should use cache)
-        expect(computed.outer).toBe(20);
-        expect(innerFn).toHaveBeenCalledTimes(1);
-        expect(outerFn).toHaveBeenCalledTimes(1);
-        // Change state
-        state.count = 10;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        // Access outer (should recompute both)
-        expect(computed.outer).toBe(30);
-        expect(innerFn).toHaveBeenCalledTimes(2);
-        expect(outerFn).toHaveBeenCalledTimes(2);
-    });
-    it("should handle conditional dependencies", async () => {
-        const state = createState({ useA: true, a: 10, b: 20 });
-        const computeFn = vi.fn(() => (state.useA ? state.a : state.b));
-        const computed = createComputed({
-            value: computeFn,
-        });
-        expect(computed.value).toBe(10);
-        expect(computeFn).toHaveBeenCalledTimes(1);
-        // Change b (not currently tracked)
-        state.b = 30;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.value).toBe(10); // Should not recompute
-        expect(computeFn).toHaveBeenCalledTimes(1);
-        // Change a (currently tracked)
-        state.a = 15;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.value).toBe(15); // Should recompute
-        expect(computeFn).toHaveBeenCalledTimes(2);
-        // Switch to using b
-        state.useA = false;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.value).toBe(30); // Should recompute and now track b
-        expect(computeFn).toHaveBeenCalledTimes(3);
-        // Change a (no longer tracked)
-        state.a = 100;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.value).toBe(30); // Should not recompute
-        expect(computeFn).toHaveBeenCalledTimes(3);
-        // Change b (now tracked)
-        state.b = 40;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(computed.value).toBe(40); // Should recompute
-        expect(computeFn).toHaveBeenCalledTimes(4);
-    });
-    it("should return consistent values during same synchronous execution", () => {
-        const state = createState({ count: 5 });
-        const computed = createComputed({
-            doubled: () => state.count * 2,
-        });
-        const first = computed.doubled;
-        const second = computed.doubled;
-        const third = computed.doubled;
-        expect(first).toBe(10);
-        expect(second).toBe(10);
-        expect(third).toBe(10);
-    });
-    it("should handle empty computed object", () => {
-        const computed = createComputed({});
-        expect(Object.keys(computed).length).toBe(0);
-    });
-    it("should properly track changes in computed used by observers", async () => {
-        const state = createState({ x: 1, y: 2 });
-        const computed = createComputed({
-            sum: () => state.x + state.y,
-        });
-        const results = [];
-        const observer = new Observer(() => {
-            results.push(computed.sum);
-        });
-        const dispose = observer.observe();
-        computed.sum; // Track
-        dispose();
-        state.x = 10;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        state.y = 20;
-        await new Promise((resolve) => setTimeout(resolve, 0));
-        expect(results).toEqual([12, 30]);
-        observer.dispose();
-    });
-});

package/dist/tests/createContext.test.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=createContext.test.d.ts.map

package/dist/tests/createContext.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"createContext.test.d.ts","sourceRoot":"","sources":["../../src/tests/createContext.test.tsx"],"names":[],"mappings":""}

package/dist/tests/createContext.test.js

@@ -1,136 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "./jsx-runtime";
-import { describe, it, expect } from "vitest";
-import { createContext } from "../createContext";
-import { render } from "../";
-describe("createContext", () => {
-    it("should create a context object", () => {
-        const context = createContext();
-        expect(context).toHaveProperty("inject");
-        expect(context).toHaveProperty("get");
-    });
-    it("should allow setting and getting context values", () => {
-        const ThemeContext = createContext();
-        function Parent() {
-            ThemeContext.inject({ theme: "dark" });
-            return () => _jsx(Child, {});
-        }
-        function Child() {
-            const theme = ThemeContext.get();
-            return () => _jsx("div", { children: theme.theme });
-        }
-        const container = document.createElement("div");
-        document.body.appendChild(container);
-        render(_jsx(Parent, {}), container);
-        expect(container.textContent).toContain("dark");
-        document.body.removeChild(container);
-    });
-    it("should traverse parent components to find context", () => {
-        const ThemeContext = createContext();
-        function GrandParent() {
-            ThemeContext.inject({ theme: "light" });
-            return () => _jsx(Parent, {});
-        }
-        function Parent() {
-            return () => _jsx(Child, {});
-        }
-        function Child() {
-            const theme = ThemeContext.get();
-            return () => _jsx("div", { children: theme.theme });
-        }
-        const container = document.createElement("div");
-        document.body.appendChild(container);
-        render(_jsx(GrandParent, {}), container);
-        expect(container.textContent).toContain("light");
-        document.body.removeChild(container);
-    });
-    it("should throw error when context is not found", () => {
-        const ThemeContext = createContext();
-        function Child() {
-            expect(() => {
-                ThemeContext.get();
-            }).toThrow("There is no parent context");
-            return () => _jsx("div", { children: "Child" });
-        }
-        const container = document.createElement("div");
-        document.body.appendChild(container);
-        render(_jsx(Child, {}), container);
-        document.body.removeChild(container);
-    });
-    it("should throw error when setting context outside component", () => {
-        const ThemeContext = createContext();
-        expect(() => {
-            ThemeContext.inject({ theme: "dark" });
-        }).toThrow("No current component");
-    });
-    it("should throw error when getting context outside component", () => {
-        const ThemeContext = createContext();
-        expect(() => {
-            ThemeContext.get();
-        }).toThrow("No current component");
-    });
-    it("should allow overriding context in nested components", () => {
-        const ThemeContext = createContext();
-        function GrandParent() {
-            ThemeContext.inject({ theme: "light" });
-            return () => (_jsxs("div", { children: [_jsx(Parent, {}), _jsx(ChildOfGrandParent, {})] }));
-        }
-        function Parent() {
-            ThemeContext.inject({ theme: "dark" });
-            return () => _jsx(ChildOfParent, {});
-        }
-        function ChildOfParent() {
-            const theme = ThemeContext.get();
-            return () => _jsx("div", { class: "child-of-parent", children: theme.theme });
-        }
-        function ChildOfGrandParent() {
-            const theme = ThemeContext.get();
-            return () => _jsx("div", { class: "child-of-grandparent", children: theme.theme });
-        }
-        const container = document.createElement("div");
-        document.body.appendChild(container);
-        render(_jsx(GrandParent, {}), container);
-        const childOfParent = document.querySelector(".child-of-parent");
-        const childOfGrandParent = document.querySelector(".child-of-grandparent");
-        expect(childOfParent?.textContent).toBe("dark");
-        expect(childOfGrandParent?.textContent).toBe("light");
-        document.body.removeChild(container);
-    });
-    it("should support multiple different contexts", () => {
-        const ThemeContext = createContext();
-        const UserContext = createContext();
-        function Parent() {
-            ThemeContext.inject({ theme: "dark" });
-            UserContext.inject({ name: "Alice" });
-            return () => _jsx(Child, {});
-        }
-        function Child() {
-            const theme = ThemeContext.get();
-            const user = UserContext.get();
-            return () => _jsx("div", { children: `${theme.theme} - ${user.name}` });
-        }
-        const container = document.createElement("div");
-        document.body.appendChild(container);
-        render(_jsx(Parent, {}), container);
-        expect(container.textContent).toContain("dark - Alice");
-        document.body.removeChild(container);
-    });
-    it("should handle context values of different types", () => {
-        const NumberContext = createContext();
-        const ArrayContext = createContext();
-        function Parent() {
-            NumberContext.inject(42);
-            ArrayContext.inject(["a", "b", "c"]);
-            return () => _jsx(Child, {});
-        }
-        function Child() {
-            const num = NumberContext.get();
-            const arr = ArrayContext.get();
-            return () => _jsx("div", { children: `${num} - ${arr.join(",")}` });
-        }
-        const container = document.createElement("div");
-        document.body.appendChild(container);
-        render(_jsx(Parent, {}), container);
-        expect(container.textContent).toContain("42 - a,b,c");
-        document.body.removeChild(container);
-    });
-});

package/dist/tests/createEffect.test.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=createEffect.test.d.ts.map

package/dist/tests/createEffect.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"createEffect.test.d.ts","sourceRoot":"","sources":["../../src/tests/createEffect.test.tsx"],"names":[],"mappings":""}