@thyn/core 0.0.344 → 0.0.346

package/tests/list/operations/ChildrenPrepend.thyn

@@ -0,0 +1,11 @@
+<script>
+  // List with component children - Test: prepend
+  const items = $signal([3]);
+</script>
+
+<div onclick={() => items([1, 2, 3])}>
+  <p #for={item in items()} data-id={item}>
+    <span #if={item % 2 === 0}>even: {{ item }}</span>
+    <span #else>odd: {{ item }}</span>
+  </p>
+</div>

package/tests/list/operations/ChildrenRemove.thyn

@@ -0,0 +1,11 @@
+<script>
+  // List with component children - Test: remove
+  const items = $signal([1, 2, 3, 4]);
+</script>
+
+<div onclick={() => items([1, 3])}>
+  <p #for={item in items()} data-id={item}>
+    <span #if={item % 2 === 0}>even: {{ item }}</span>
+    <span #else>odd: {{ item }}</span>
+  </p>
+</div>

package/tests/list/operations/ChildrenReplaceAll.thyn

@@ -0,0 +1,11 @@
+<script>
+  // List with component children - Test: replace all
+  const items = $signal([1, 2]);
+</script>
+
+<div onclick={() => items([5, 6, 7])}>
+  <p #for={item in items()} data-id={item}>
+    <span #if={item % 2 === 0}>even: {{ item }}</span>
+    <span #else>odd: {{ item }}</span>
+  </p>
+</div>

package/tests/list/operations/ChildrenSomeToNone.thyn

@@ -0,0 +1,11 @@
+<script>
+  // List with component children - Test: some → none
+  const items = $signal([1, 2, 3]);
+</script>
+
+<div onclick={() => items([])}>
+  <p #for={item in items()} data-id={item}>
+    <span #if={item % 2 === 0}>even: {{ item }}</span>
+    <span #else>odd: {{ item }}</span>
+  </p>
+</div>

package/tests/list/operations/ChildrenSort.thyn

@@ -0,0 +1,11 @@
+<script>
+  // List with component children - Test: sort
+  const items = $signal([4, 2, 3, 1]);
+</script>
+
+<div onclick={() => items([1, 2, 3, 4])}>
+  <p #for={item in items()} data-id={item}>
+    <span #if={item % 2 === 0}>even: {{ item }}</span>
+    <span #else>odd: {{ item }}</span>
+  </p>
+</div>

package/tests/list/operations/IsolatedAppend.thyn

@@ -0,0 +1,10 @@
+<script>
+  // Test: append items
+  const items = $signal([1, 2]);
+</script>
+
+<div onclick={() => items([1, 2, 3, 4])}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/IsolatedFilter.thyn

@@ -0,0 +1,16 @@
+<script>
+  // Test: filter items
+  const items = $signal([1, 2, 3, 4, 5, 6]);
+  let clickCount = 0;
+</script>
+
+<div onclick={() => {
+  clickCount++;
+  if (clickCount === 1) items([2, 4, 6]); // Even only
+  else if (clickCount === 2) items([1, 3, 5]); // Odd only
+  else items([10, 15, 20]); // Greater than 5
+}}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/IsolatedInsert.thyn

@@ -0,0 +1,10 @@
+<script>
+  // Test: insert items in middle
+  const items = $signal([1, 4]);
+</script>
+
+<div onclick={() => items([1, 2, 3, 4])}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/IsolatedMove.thyn

@@ -0,0 +1,16 @@
+<script>
+  // Test: move/reorder items
+  const items = $signal([1, 2, 3, 4]);
+  let clickCount = 0;
+</script>
+
+<div onclick={() => {
+  clickCount++;
+  if (clickCount === 1) items([4, 1, 2, 3]); // Move 4 to front
+  else if (clickCount === 2) items([1, 3, 2, 4]); // Swap 2 and 3
+  else items([4, 3, 2, 1]); // Reverse
+}}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/IsolatedNoneToSome.thyn

@@ -0,0 +1,16 @@
+<script>
+  // Test: none → some (add items to empty list)
+  const items = $signal([]);
+  let clickCount = 0;
+</script>
+
+<div onclick={() => {
+  clickCount++;
+  if (clickCount === 1) items([1]);
+  else if (clickCount === 2) items([1, 2, 3]);
+  else items([]);
+}}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/IsolatedPrepend.thyn

@@ -0,0 +1,10 @@
+<script>
+  // Test: prepend items
+  const items = $signal([3, 4]);
+</script>
+
+<div onclick={() => items([1, 2, 3, 4])}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/IsolatedRemove.thyn

@@ -0,0 +1,17 @@
+<script>
+  // Test: remove items from various positions
+  const items = $signal([1, 2, 3, 4]);
+  let clickCount = 0;
+</script>
+
+<div onclick={() => {
+  clickCount++;
+  if (clickCount === 1) items([1, 2]); // Remove from end
+  else if (clickCount === 2) items([3, 4]); // Remove from beginning  
+  else if (clickCount === 3) items([1, 4]); // Remove from middle
+  else items([]);
+}}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/IsolatedReplaceAll.thyn

@@ -0,0 +1,10 @@
+<script>
+  // Test: replace all items
+  const items = $signal([1, 2, 3]);
+</script>
+
+<div onclick={() => items([4, 5, 6])}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/IsolatedSomeToNone.thyn

@@ -0,0 +1,10 @@
+<script>
+  // Test: some → none (clear all items)
+  const items = $signal([1, 2, 3]);
+</script>
+
+<div onclick={() => items([])}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/IsolatedSort.thyn

@@ -0,0 +1,16 @@
+<script>
+  // Test: sort items
+  const items = $signal([3, 1, 4, 5]);
+  let clickCount = 0;
+</script>
+
+<div onclick={() => {
+  clickCount++;
+  if (clickCount === 1) items([1, 3, 4, 5]); // Ascending
+  else if (clickCount === 2) items([5, 4, 3, 1]); // Descending
+  else items([5, 4, 3, 2, 1]); // Reverse
+}}>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+</div>

package/tests/list/operations/TerminalAppend.thyn

@@ -0,0 +1,12 @@
+<script>
+  // Terminal list with siblings - Test: append
+  const items = $signal([1, 2]);
+</script>
+
+<div onclick={() => items([1, 2, 3, 4])}>
+  <span class="before">start</span>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+  <span class="after">end</span>
+</div>

package/tests/list/operations/TerminalFilter.thyn

@@ -0,0 +1,12 @@
+<script>
+  // Terminal list with siblings - Test: filter
+  const items = $signal([1, 2, 3, 4, 5, 6]);
+</script>
+
+<div onclick={() => items([2, 4, 6])}>
+  <span class="before">start</span>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+  <span class="after">end</span>
+</div>

package/tests/list/operations/TerminalInsert.thyn

@@ -0,0 +1,12 @@
+<script>
+  // Terminal list with siblings - Test: insert
+  const items = $signal([1, 4]);
+</script>
+
+<div onclick={() => items([1, 2, 3, 4])}>
+  <span class="before">start</span>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+  <span class="after">end</span>
+</div>

package/tests/list/operations/TerminalNoneToSome.thyn

@@ -0,0 +1,12 @@
+<script>
+  // Terminal list with siblings - Test: none → some
+  const items = $signal([]);
+</script>
+
+<div>
+  <span class="before">start</span>
+  <span #for={item in items()} data-id={item} onclick={() => items([1, 2, 3])}>
+    {{ item }}
+  </span>
+  <span class="after">end</span>
+</div>

package/tests/list/operations/TerminalPrepend.thyn

@@ -0,0 +1,12 @@
+<script>
+  // Terminal list with siblings - Test: prepend
+  const items = $signal([3, 4]);
+</script>
+
+<div onclick={() => items([1, 2, 3, 4])}>
+  <span class="before">start</span>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+  <span class="after">end</span>
+</div>

package/tests/list/operations/TerminalRemove.thyn

@@ -0,0 +1,12 @@
+<script>
+  // Terminal list with siblings - Test: remove
+  const items = $signal([1, 2, 3, 4]);
+</script>
+
+<div onclick={() => items([1, 2])}>
+  <span class="before">start</span>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+  <span class="after">end</span>
+</div>

package/tests/list/operations/TerminalReplaceAll.thyn

@@ -0,0 +1,12 @@
+<script>
+  // Terminal list with siblings - Test: replace all
+  const items = $signal([1, 2]);
+</script>
+
+<div onclick={() => items([7, 8, 9])}>
+  <span class="before">start</span>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+  <span class="after">end</span>
+</div>

package/tests/list/operations/TerminalSomeToNone.thyn

@@ -0,0 +1,12 @@
+<script>
+  // Terminal list with siblings - Test: some → none
+  const items = $signal([1, 2, 3]);
+</script>
+
+<div onclick={() => items([])}>
+  <span class="before">start</span>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+  <span class="after">end</span>
+</div>

package/tests/list/operations/TerminalSort.thyn

@@ -0,0 +1,12 @@
+<script>
+  // Terminal list with siblings - Test: sort
+  const items = $signal([3, 1, 2]);
+</script>
+
+<div onclick={() => items([1, 2, 3])}>
+  <span class="before">start</span>
+  <span #for={item in items()} data-id={item}>
+    {{ item }}
+  </span>
+  <span class="after">end</span>
+</div>

package/tests/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "rootDir": ".",
+    "noEmit": true
+  },
+  "include": [
+    "./**/*",
+    "../types/**/*"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}

package/tsconfig.json

@@ -1,8 +1,5 @@
 {
   "compilerOptions": {
-    "composite": true,
-    "allowJs": true,
-    "checkJs": false,
     "module": "ESNext",
     "target": "ES2020",
     "moduleResolution": "node",
@@ -10,9 +7,17 @@
     "skipLibCheck": true,
     "isolatedModules": true,
     "outDir": "dist",
-    "rootDir": "src"
+    "rootDir": "src",
+    "declaration": true,
+    "strict": false
   },
   "include": [
-    "src/**/*"
+    "src/**/*",
+    "types/**/*"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist",
+    "tests"
   ]
-}
+}

package/types/thyn.d.ts

@@ -0,0 +1,4 @@
+declare module "*.thyn" {
+  const component: () => HTMLElement;
+  export default component;
+}

package/vitest.config.ts

@@ -1,10 +1,15 @@
+import { resolve } from "path";
 import { defineConfig } from "vitest/config";
+import thyn from "./src/plugin/index.js";
 
 export default defineConfig({
+  plugins: [thyn()],
   test: {
-    environment: 'jsdom',
-    globals: true,
+    environment: 'happy-dom',
     include: ['tests/**/*.test.ts'],
     exclude: ['**/node_modules/**', 'dist/**'],
+    alias: {
+      '@thyn/core': resolve(__dirname, './src'),
+    },
   },
 });

package/tests/fx.test.ts

@@ -1,31 +0,0 @@
-import { describe, expect, it } from "vitest";
-import { $effect, $signal } from "../src";
-import { wait } from "./utils";
-
-describe("runs effect", () => {
-  it("if else", async () => {
-    const on = $signal(true);
-    const runRef = { val: 0 };
-    const tdRef = { val: 0 };
-    const root = (() => {
-      const div = document.createElement("div");
-      $effect(() => { div.textContent = on() ? "on" : "off" });
-      $effect(() => {
-        on();
-        runRef.val++;
-        return () => {
-          tdRef.val++;
-        };
-      });
-      return div;
-    })();
-    expect(root.textContent).toBe("on");
-    expect(runRef.val).toBe(1);
-    expect(tdRef.val).toBe(0);
-    on(false);
-    await wait();
-    expect(root.textContent).toBe("off");
-    expect(runRef.val).toBe(2);
-    expect(tdRef.val).toBe(1);
-  });
-});

package/tests/lists.test.ts

@@ -1,184 +0,0 @@
-import { describe, expect, it } from "vitest";
-import { $signal, isolatedTerminalList, list } from "../src";
-import { wait } from "./utils";
-
-function makeGenericList(signal: any) {
-  return list({
-    items: () => signal(),
-    render: (item: number) => {
-      const span = document.createElement("span");
-      span.textContent = `${item}`;
-      return span;
-    },
-  });
-}
-
-function makeIsolatedTerminalList(signal: any) {
-  return isolatedTerminalList({
-    items: () => signal(),
-    render: (item: number) => {
-      const span = document.createElement("span");
-      span.textContent = `${item}`;
-      return span;
-    },
-  });
-}
-
-const run = (makeList: any) => describe("list", () => {
-  it("renders", async () => {
-    const items = $signal([0, 1, 2]);
-    const root = makeList(items);
-    expect(root.textContent).toBe("012");
-  });
-
-  it("removes all", async () => {
-    const items = $signal([0, 1]);
-    const root = makeList(items);
-    items([]);
-    await wait();
-    expect(root.textContent).toBe("");
-  });
-
-  if (makeList === makeGenericList) {
-    it("removes all when offset 1", async () => {
-      const items = $signal([0, 1, 2, 3]);
-      const root = document.createElement("div");
-      const a = document.createElement("span");
-      a.textContent = "a";
-      const b = document.createElement("span");
-      b.textContent = "b";
-      const div = makeList(items);
-      root.append(a, div, b);
-      expect(root.textContent).toBe("a0123b");
-      items([]);
-      await wait();
-      expect(root.textContent).toBe("ab");
-    });
-
-    it("removes all when offset 2", async () => {
-      const items = $signal([0, 1, 2, 3]);
-      const root = document.createElement("div");
-      const a = document.createElement("span");
-      a.textContent = "a";
-      const b = document.createElement("span");
-      b.textContent = "b";
-      const c = document.createElement("span");
-      c.textContent = "c";
-      const d = document.createElement("span");
-      d.textContent = "d";
-      const div = makeList(items);
-      root.append(a, b, div, c, d);
-      expect(root.textContent).toBe("ab0123cd");
-      items([]);
-      await wait();
-      expect(root.textContent).toBe("abcd");
-    });
-  }
-
-  it("stays the same", async () => {
-    const items = $signal([0, 1]);
-    const root = makeList(items);
-    items([0, 1]);
-    await wait();
-    expect(root.textContent).toBe("01");
-  });
-
-  it("reverses 2", async () => {
-    const items = $signal([0, 1]);
-    const root = makeList(items);
-    items([1, 0]);
-    await wait();
-    expect(root.textContent).toBe("10");
-  });
-
-  it("reverses 3", async () => {
-    const items = $signal([0, 1, 2]);
-    const root = makeList(items);
-    items([2, 1, 0]);
-    await wait();
-    expect(root.textContent).toBe("210");
-  });
-
-  it("reverses 4", async () => {
-    const items = $signal([0, 1, 2, 3]);
-    const root = makeList(items);
-    items([3, 2, 1, 0]);
-    await wait();
-    expect(root.textContent).toBe("3210");
-  });
-
-  it("removes from start", async () => {
-    const items = $signal([0, 1, 2]);
-    const root = makeList(items);
-    items([1, 2]);
-    await wait();
-    expect(root.textContent).toBe("12");
-  });
-
-  it("removes from end", async () => {
-    const items = $signal([0, 1, 2]);
-    const root = makeList(items);
-    items([0, 1]);
-    await wait();
-    expect(root.textContent).toBe("01");
-  });
-
-  it("removes from middle", async () => {
-    const items = $signal([0, 1, 2]);
-    const root = makeList(items);
-    items([0, 2]);
-    await wait();
-    expect(root.textContent).toBe("02");
-  });
-
-  it("removes from everywhere", async () => {
-    const items = $signal([0, 1, 2, 3, 4, 5, 6]);
-    const root = makeList(items);
-    items([1, 3, 5]);
-    await wait();
-    expect(root.textContent).toBe("135");
-  });
-
-  it("adds to start", async () => {
-    const items = $signal([1, 2]);
-    const root = makeList(items);
-    items([0, 1, 2]);
-    await wait();
-    expect(root.textContent).toBe("012");
-  });
-
-  it("adds to end", async () => {
-    const items = $signal([0, 1]);
-    const root = makeList(items);
-    items([0, 1, 2]);
-    await wait();
-    expect(root.textContent).toBe("012");
-  });
-
-  it("adds to middle", async () => {
-    const items = $signal([0, 2]);
-    const root = makeList(items);
-    items([0, 1, 2]);
-    await wait();
-    expect(root.textContent).toBe("012");
-  });
-
-  it("replaces all", async () => {
-    const items = $signal([0, 1]);
-    const root = makeList(items);
-    items([2, 3]);
-    await wait();
-    expect(root.textContent).toBe("23");
-  });
-
-  it("sorts", async () => {
-    const items = $signal([6, 0, 2, 4, 7, 1, 3, 5]);
-    const root = makeList(items);
-    items([0, 1, 2, 3, 4, 5, 6, 7]);
-    await wait();
-    expect(root.textContent).toBe("01234567");
-  });
-});
-
-run(makeGenericList);
-run(makeIsolatedTerminalList);