@madojs/mado 0.8.0 → 0.9.0

package/docs/en/06-for-backenders.md

@@ -1,6 +1,7 @@
 # Mado for Backend Developers
 
-> You write in Go / Rust / .NET / Java / Python and you need to build a web UI.  
+> You write in Go / Rust / .NET / Java / Python and you need to build a web UI
+> for an admin panel, internal tool or dashboard.  
 > This page is the mental model of Mado in 10 minutes, in your language.
 
 ---
@@ -9,17 +10,17 @@
 
 Mado is structured **like an HTTP server**. Seriously:
 
-| Server world | Mado |
-|---|---|
-| HTTP router (chi, axum, mux) | `routes()` — path manifest |
-| Handler `func(req, resp)` | `page({ view: (ctx) => html\`...\` })` |
-| Middleware | `layout` in `nested()` (wraps the handler) |
-| Template engine (Jinja, Handlebars) | `html\`\`` tagged template |
-| HTTP client with cache | `resource()` — fetch + cache + invalidation |
-| Reactive variable / atom | `signal()` — reactive getter |
-| Background goroutine / task | `effect()` — auto-reruns when a signal changes |
-| `defer cleanup()` | `ctx.onDispose(fn)` in component setup |
-| ENV variables | `createContext()` + `provide()`/`inject()` |
+| Server world                        | Mado                                           |
+| ----------------------------------- | ---------------------------------------------- |
+| HTTP router (chi, axum, mux)        | `routes()` — path manifest                     |
+| Handler `func(req, resp)`           | `page({ view: (ctx) => html\`...\` })`         |
+| Middleware                          | `layout` in `nested()` (wraps the handler)     |
+| Template engine (Jinja, Handlebars) | `html\`\`` tagged template                     |
+| HTTP client with cache              | `resource()` — fetch + cache + invalidation    |
+| Reactive variable / atom            | `signal()` — reactive getter                   |
+| Background goroutine / task         | `effect()` — auto-reruns when a signal changes |
+| `defer cleanup()`                   | `ctx.onDispose(fn)` in component setup         |
+| ENV variables                       | `createContext()` + `provide()`/`inject()`     |
 
 If you understand an HTTP server, you understand Mado.
 
@@ -130,20 +131,23 @@ import { resource, mutation, jsonFetcher, invalidate } from "@madojs/mado";
 const userId = signal(1);
 
 const user = resource(
-  () => `/api/users/${userId()}`,         // cache key (reactive!)
-  jsonFetcher<User>(),                    // how to load
-  { staleTime: 60_000 },                  // 60-second cache
+  () => `/api/users/${userId()}`, // cache key (reactive!)
+  jsonFetcher<User>(), // how to load
+  { staleTime: 60_000 }, // 60-second cache
 );
 
 // in the component:
-user.data();     // User | undefined
-user.error();    // Error | null
-user.loading();  // boolean
+user.data(); // User | undefined
+user.error(); // Error | null
+user.loading(); // boolean
 
 // mutation (like POST/PUT)
 const save = mutation<User, User>(
-  (u) => fetch("/api/users", { method: "POST", body: JSON.stringify(u) }).then(r => r.json()),
-  { invalidates: ["/api/users*"] },  // glob invalidation — like `cache.Drop("users:*")`
+  (u) =>
+    fetch("/api/users", { method: "POST", body: JSON.stringify(u) }).then((r) =>
+      r.json(),
+    ),
+  { invalidates: ["/api/users*"] }, // glob invalidation — like `cache.Drop("users:*")`
 );
 
 await save.run(newUser);
@@ -169,9 +173,7 @@ component("x-counter", () => {
   const count = signal(0);
 
   return () => html`
-    <button @click=${() => count.update(n => n + 1)}>
-      Clicks: ${count}
-    </button>
+    <button @click=${() => count.update((n) => n + 1)}>Clicks: ${count}</button>
   `;
 });
 ```
@@ -179,7 +181,7 @@ component("x-counter", () => {
 Usage:
 
 ```ts
-html`<x-counter></x-counter>`
+html`<x-counter></x-counter>`;
 ```
 
 We register the `<x-counter>` tag in the browser — it becomes a "function" that can be inserted into HTML. This is a **native** browser mechanism (Web Components), Mado only glues it together with signals.
@@ -195,22 +197,29 @@ import { useForm } from "@madojs/mado";
 
 const f = useForm({
   email: { required: true, type: "email" },
-  age:   { required: true, type: "number", min: 18 },
+  age: { required: true, type: "number", min: 18 },
 });
 
 // in the template:
 html`
-  <form @submit=${f.onSubmit(async (v) => {
-    await api.save(v);
-    f.reset();
-  })}>
-    <input name="email" .value=${() => f.values().email ?? ""}
-           @input=${f.onInput} @blur=${f.onBlur} />
-    
-    ${() => f.errors().email && f.touched().email
-      ? html`<small>${f.errors().email}</small>`
-      : null}
-    
+  <form
+    @submit=${f.onSubmit(async (v) => {
+      await api.save(v);
+      f.reset();
+    })}
+  >
+    <input
+      name="email"
+      .value=${() => f.values().email ?? ""}
+      @input=${f.onInput}
+      @blur=${f.onBlur}
+    />
+
+    ${() =>
+      f.errors().email && f.touched().email
+        ? html`<small>${f.errors().email}</small>`
+        : null}
+
     <button ?disabled=${() => !f.isValid() || f.submitting()}>Save</button>
   </form>
 `;
@@ -233,12 +242,12 @@ const ApiCtx = createContext<ApiClient>(defaultApiClient);
 // in the root component — provide
 component("x-app", ({ host }) => {
   provide(host, ApiCtx, new ApiClient("https://api.example.com"));
-  return () => html`<x-page/>`;
+  return () => html`<x-page />`;
 });
 
 // in any child — consume
 component("x-page", ({ host }) => {
-  const api = inject(host, ApiCtx);  // signal<ApiClient>
+  const api = inject(host, ApiCtx); // signal<ApiClient>
   return () => html`<div>API version: ${() => api().version}</div>`;
 });
 ```
@@ -255,7 +264,7 @@ If you're used to server-side rendering for SEO, in Mado this is solved differen
 // src/pages/product.ts
 export default page({
   bake: {
-    paths: () => api.allProductSlugs(),   // build-time fetch
+    paths: () => api.allProductSlugs(), // build-time fetch
     data: ({ slug }) => api.getProduct(slug),
     revalidate: 3600,
   },
@@ -264,7 +273,7 @@ export default page({
     canonical: `/product/${slug}`,
     og: { title: data.name, image: data.image },
   }),
-  view: ({ params }) => html`<x-product data-slug=${params.slug}/>`,
+  view: ({ params }) => html`<x-product data-slug=${params.slug} />`,
 });
 ```
 
@@ -288,14 +297,20 @@ import { page, html, resource, each, signal } from "@madojs/mado";
 export default page({
   view: () => {
     const users = resource(() => "/api/users", jsonFetcher<User[]>());
-    
+
     return html`
-      ${() => users.loading() ? html`<p>Loading…</p>` : null}
-      ${() => users.error() ? html`<p>Error: ${users.error()!.message}</p>` : null}
+      ${() => (users.loading() ? html`<p>Loading…</p>` : null)}
+      ${() =>
+        users.error() ? html`<p>Error: ${users.error()!.message}</p>` : null}
       <ul>
-        ${() => each(users.data() ?? [], u => u.id, u => html`
-          <li><a href="/users/${u.id}" data-link>${u.name}</a></li>
-        `)}
+        ${() =>
+          each(
+            users.data() ?? [],
+            (u) => u.id,
+            (u) => html`
+              <li><a href="/users/${u.id}" data-link>${u.name}</a></li>
+            `,
+          )}
       </ul>
     `;
   },
@@ -308,7 +323,10 @@ export default page({
 import { useForm, mutation } from "@madojs/mado";
 
 const createUser = mutation<NewUser, User>(
-  (u) => fetch("/api/users", { method: "POST", body: JSON.stringify(u) }).then(r => r.json()),
+  (u) =>
+    fetch("/api/users", { method: "POST", body: JSON.stringify(u) }).then((r) =>
+      r.json(),
+    ),
   { invalidates: ["/api/users*"] },
 );
 
@@ -316,11 +334,13 @@ const createUser = mutation<NewUser, User>(
 const f = useForm({ name: { required: true } });
 
 html`
-  <form @submit=${f.onSubmit(async (v) => {
-    await createUser.run(v);
-    navigate("/users");
-  })}>
-    <input name="name" @input=${f.onInput}>
+  <form
+    @submit=${f.onSubmit(async (v) => {
+      await createUser.run(v);
+      navigate("/users");
+    })}
+  >
+    <input name="name" @input=${f.onInput} />
     <button>Create</button>
   </form>
 `;
@@ -353,8 +373,8 @@ export default routes({
   "/app/*": nested({
     layout: () => import("./layouts/auth-layout.js"),
     routes: {
-      "dashboard": () => import("./pages/dashboard.js"),
-      "users": () => import("./pages/users.js"),
+      dashboard: () => import("./pages/dashboard.js"),
+      users: () => import("./pages/users.js"),
     },
   }),
 });
@@ -367,7 +387,7 @@ export default routes({
 export class ApiClient {
   constructor(private base: string) {}
   get<T>(path: string): Promise<T> {
-    return fetch(this.base + path).then(r => r.json());
+    return fetch(this.base + path).then((r) => r.json());
   }
 }
 

package/docs/en/07-llm-pitfalls.md

@@ -598,6 +598,105 @@ See [`17-shadow-dom-forms.md`](./17-shadow-dom-forms.md) for the full pattern.
 
 ---
 
+## Pitfall #23: signal reads in async functions called from `view()` create effect cycles
+
+**Symptom:** `[mado] effect cycle detected: subscriber re-ran more than 100 times in one flush.`
+
+The router calls `page.view()` inside a reactive effect. Any signal read
+**synchronously** during `view()` subscribes the router's render effect. If that
+signal is then written (e.g. `loading.set(true)`) — the router re-runs `view()`,
+which reads the signal again → infinite loop.
+
+```ts
+// ❌ INFINITE LOOP — loadMore reads signals inside the router's effect
+export default page({
+  view: () => {
+    const cursor = signal<string | null>("start");
+    const loading = signal(false);
+
+    const loadMore = async () => {
+      if (cursor() === null || loading()) return; // ← subscribes render effect!
+      loading.set(true); // ← re-triggers render → loadMore() → ∞
+      const res = await fetch(`/api/items?cursor=${cursor()}`);
+      // ...
+    };
+
+    loadMore(); // called synchronously during view()
+    return html`...`;
+  },
+});
+
+// ✅ CORRECT — wrap signal reads in untracked()
+import { untracked } from "@madojs/mado";
+
+export default page({
+  view: () => {
+    const cursor = signal<string | null>("start");
+    const loading = signal(false);
+
+    const loadMore = async () => {
+      const c = untracked(() => cursor());
+      if (c === null || untracked(() => loading())) return;
+      loading.set(true);
+      const res = await fetch(`/api/items?cursor=${c}`);
+      // ...
+    };
+
+    loadMore();
+    return html`...`;
+  },
+});
+```
+
+**Rule:** Any function that reads signals AND is called synchronously during
+`view()` initialization must use `untracked()` for those reads. This includes:
+
+- Data fetching / loadMore functions
+- IntersectionObserver callbacks set up during init
+- Timer/polling setup functions that check state
+
+Signals read inside the **returned template** (`html\`...\``) are fine — they are
+wrapped in a child-binding function `${() => ...}` which creates its own effect.
+
+---
+
+## Pitfall #24: `setInterval` / manual subscriptions in `page()` view without cleanup
+
+**Symptom:** After navigating away, timers/subscriptions keep running (zombie intervals,
+server logs show polling requests from pages the user already left).
+
+```ts
+// ❌ ZOMBIE — interval survives navigation
+export default page({
+  view: () => {
+    const tick = signal(0);
+    setInterval(() => tick.update((n) => n + 1), 3000); // never cleaned up!
+    return html`<div>${tick}</div>`;
+  },
+});
+
+// ✅ CORRECT — use onDispose for cleanup
+export default page({
+  view: ({ onDispose }) => {
+    const tick = signal(0);
+    const id = setInterval(() => tick.update((n) => n + 1), 3000);
+    onDispose(() => clearInterval(id));
+    return html`<div>${tick}</div>`;
+  },
+});
+```
+
+**Note:** `resource()` and `effect()` created inside `view()` are automatically
+cleaned up on navigation (they register with the page lifecycle). Only raw
+browser APIs need explicit `onDispose()`:
+
+- `setInterval` / `setTimeout`
+- `addEventListener` (on window/document)
+- `WebSocket` / `EventSource`
+- `IntersectionObserver` / `ResizeObserver`
+
+---
+
 ## Cheat-sheet for AI
 
 | If you want to do…                    | Correct in Mado                             |
@@ -619,5 +718,7 @@ See [`17-shadow-dom-forms.md`](./17-shadow-dom-forms.md) for the full pattern.
 | `@customElement('x')`                 | `component('x-name', setup)`                |
 | `host.getAttribute('x')` in render    | `ctx.attr('x', default)` (reactive)         |
 | `jsonFetcher()` with auth             | `apiFetcher()` (attaches Bearer token)      |
+| `setInterval` in page view            | `onDispose(() => clearInterval(id))`        |
+| signal read in view() async init      | `untracked(() => cursor())`                 |
 
 If something doesn't fit this list — open `src/` and **read 500 lines**. Seriously. Mado is intentionally small to be readable.

package/docs/fr/00-the-mado-way.md

@@ -2,9 +2,12 @@
 
 > Une seule bonne façon. Des contrats stricts. Pas de magie.
 
-Mado n'est pas seulement un framework — c'est un **ensemble de conventions**. Si vous les
-respectez, le projet reste compréhensible même avec 200 écrans et 5 développeurs. Si vous
-les enfreignez — les types et le linter vous le diront immédiatement.
+Mado est un framework pour les équipes qui construisent des panneaux d'admin,
+des outils internes et des SPA métier — des apps qui doivent être simples à
+créer et ennuyeuses à maintenir. Pour cela, il impose un **ensemble de
+conventions**. Si vous les respectez, le projet reste compréhensible même avec
+200 écrans et 5 développeurs. Si vous les enfreignez — les types et le linter
+vous le diront immédiatement.
 
 ## Principes
 
@@ -42,13 +45,21 @@ tous écrire de la même manière.
 
 ```ts
 // src/components/user-card.ts
-import { component, html, css } from '@madojs/mado';
-
-component('x-user-card', () => {
-  return () => html`<div class="card"><slot/></div>`;
-}, {
-  styles: css`.card { padding: 1rem; }`,
-});
+import { component, html, css } from "@madojs/mado";
+
+component(
+  "x-user-card",
+  () => {
+    return () => html`<div class="card"><slot /></div>`;
+  },
+  {
+    styles: css`
+      .card {
+        padding: 1rem;
+      }
+    `,
+  },
+);
 ```
 
 `import './components/user-card.js'` **enregistre** le composant via
@@ -63,7 +74,7 @@ component('x-user-card', () => {
 const user = resource(() => `/api/users/${id()}`, jsonFetcher());
 
 // écriture → mutation
-const save = mutation(api.save, { invalidates: ['/api/users*'] });
+const save = mutation(api.save, { invalidates: ["/api/users*"] });
 ```
 
 Cela fournit la mise en cache, l'annulation, la gestion des erreurs et l'invalidation automatique.
@@ -72,11 +83,11 @@ Cela fournit la mise en cache, l'annulation, la gestion des erreurs et l'invalid
 
 ```ts
 // src/pages/user-profile.ts
-import { page, html, resource, jsonFetcher } from '@madojs/mado';
+import { page, html, resource, jsonFetcher } from "@madojs/mado";
 
 export default page({
   title: ({ id }) => `Utilisateur #${id}`,
-  view:  ({ params }) => html`...`,
+  view: ({ params }) => html`...`,
 });
 ```
 
@@ -101,6 +112,7 @@ Voir [`01-routing.md`](./01-routing.md).
 ## En cas de doute
 
 Si vous vous demandez "quelle est la meilleure façon ici ?" — c'est un signal que :
+
 1. Soit il existe un helper intégré que vous ne connaissez pas (consultez `docs/`).
 2. Soit c'est une nouvelle situation — discutez-en et **consignez-la** dans ce document
    comme une convention supplémentaire.

package/docs/fr/07-llm-pitfalls.md

@@ -619,5 +619,7 @@ Plus de détails : [`17-shadow-dom-forms.md`](./17-shadow-dom-forms.md).
 | `@customElement('x')`                 | `component('x-name', setup)`                |
 | `host.getAttribute('x')` dans render  | `ctx.attr('x', default)` (réactif)          |
 | `jsonFetcher()` avec auth             | `apiFetcher()` (attache le Bearer token)    |
+| `setInterval` dans page view          | `onDispose(() => clearInterval(id))`        |
+| lecture signal dans async init view()  | `untracked(() => cursor())`                 |
 
 Si quelque chose ne rentre pas dans cette liste — ouvrez `src/` et **lisez 500 lignes**. Sérieusement. Mado est intentionnellement petit pour être lisible.

package/docs/ru/00-the-mado-way.md

@@ -2,7 +2,11 @@
 
 > Один правильный путь. Жёсткие контракты. Никакой магии.
 
-Mado — это не просто фреймворк, это **набор соглашений**. Если ты следуешь им, проект остаётся понятным даже когда в нём 200 экранов и 5 разработчиков. Если нарушаешь — типы и линтер скажут об этом сразу.
+Mado — фреймворк для команд, которые строят админки, внутренние инструменты
+и бизнес-SPA — приложения, которые должны быть просты в разработке и скучны
+в поддержке. Для этого он задаёт **набор соглашений**. Если ты следуешь им,
+проект остаётся понятным даже когда в нём 200 экранов и 5 разработчиков. Если
+нарушаешь — типы и линтер скажут об этом сразу.
 
 ## Принципы
 
@@ -32,13 +36,21 @@ src/
 
 ```ts
 // src/components/user-card.ts
-import { component, html, css } from '@madojs/mado';
-
-component('x-user-card', () => {
-  return () => html`<div class="card"><slot/></div>`;
-}, {
-  styles: css`.card { padding: 1rem; }`,
-});
+import { component, html, css } from "@madojs/mado";
+
+component(
+  "x-user-card",
+  () => {
+    return () => html`<div class="card"><slot /></div>`;
+  },
+  {
+    styles: css`
+      .card {
+        padding: 1rem;
+      }
+    `,
+  },
+);
 ```
 
 Импорт `import './components/user-card.js'` **регистрирует** компонент через `customElements.define`. Это side-effect. Где компонент нужен — там и импортируем.
@@ -52,7 +64,7 @@ component('x-user-card', () => {
 const user = resource(() => `/api/users/${id()}`, jsonFetcher());
 
 // запись → mutation
-const save = mutation(api.save, { invalidates: ['/api/users*'] });
+const save = mutation(api.save, { invalidates: ["/api/users*"] });
 ```
 
 Это даёт кеш, отмену, обработку ошибок, авто-инвалидацию.
@@ -61,11 +73,11 @@ const save = mutation(api.save, { invalidates: ['/api/users*'] });
 
 ```ts
 // src/pages/user-profile.ts
-import { page, html, resource, jsonFetcher } from '@madojs/mado';
+import { page, html, resource, jsonFetcher } from "@madojs/mado";
 
 export default page({
   title: ({ id }) => `User #${id}`,
-  view:  ({ params }) => html`...`,
+  view: ({ params }) => html`...`,
 });
 ```
 
@@ -87,6 +99,7 @@ export default page({
 ## Когда сомневаешься
 
 Если ты задаёшься вопросом "а как тут лучше?" — это сигнал, что:
+
 1. Либо есть встроенный хелпер, который ты не знаешь (загляни в `docs/`).
 2. Либо это новая ситуация — её надо обсудить и **зафиксировать** в этом документе как ещё одно соглашение.
 

package/docs/ru/07-llm-pitfalls.md

@@ -618,5 +618,7 @@ component("x-input", ({ host, attr }) => {
 | `@customElement('x')`                 | `component('x-name', setup)`                |
 | `host.getAttribute('x')` в render     | `ctx.attr('x', default)` (реактивно)        |
 | `jsonFetcher()` с авторизацией        | `apiFetcher()` (прикрепляет Bearer токен)   |
+| `setInterval` в page view             | `onDispose(() => clearInterval(id))`        |
+| чтение сигнала в async init view()    | `untracked(() => cursor())`                 |
 
 Если что-то не подходит из этого списка — открой `src/` и **прочитай 500 строк**. Это серьёзно. Mado специально маленький, чтобы быть читаемым.

package/docs/uk/00-the-mado-way.md

@@ -2,7 +2,9 @@
 
 > Один зрозумілий шлях. Жорсткі контракти. Мінімум магії.
 
-Mado — це не лише набір API, а набір домовленостей. Якщо їх дотримуватись,
+Mado — фреймворк для команд, що будують адмін-панелі, внутрішні інструменти
+та бізнес-SPA — застосунки, які мають бути простими у розробці та нудними в
+підтримці. Для цього він задає **набір домовленостей**. Якщо їх дотримуватись,
 проєкт залишається читабельним навіть тоді, коли в ньому десятки сторінок і
 кілька розробників.
 

package/docs/uk/07-llm-pitfalls.md

@@ -141,3 +141,5 @@ Object.defineProperty(host, "value", {
 | `class extends HTMLElement` | `component('x-name', setup)` |
 | `host.getAttribute('x')`    | `ctx.attr('x', default)`     |
 | `jsonFetcher()` з auth      | `apiFetcher()`               |
+| `setInterval` в page view   | `onDispose(() => clearInterval(id))` |
+| читання сигналу в async init | `untracked(() => cursor())`  |

package/llms.txt

@@ -1,9 +1,9 @@
 # Mado
 
-> Small native-web SPA framework on the platform (Web Components + signals + tagged-template `html`).  
-> No build step (only `tsc`), no runtime dependencies, readable in an evening.
+> A calm browser-native SPA framework for internal tools, admin panels and business apps.  
+> Routing, forms, state, data fetching and prerendering. TypeScript-only build (`tsc`), zero runtime dependencies.
 
-Mado is a narrowly-focused frontend framework that deliberately avoids React patterns (no JSX, no hooks, no VDOM, no Vite). Target audience: backend developers and senior frontend engineers who are tired of the infrastructure complexity of React/Next.
+Mado is a focused frontend framework for admin panels, internal tools and CRUD-heavy SPA. It deliberately avoids React patterns (no JSX, no hooks, no VDOM, no Vite). Target audience: backend developers and small teams who want a complete app stack without frontend infrastructure overhead.
 
 ## Key things an AI assistant needs to know
 
@@ -13,7 +13,9 @@ Mado is a narrowly-focused frontend framework that deliberately avoids React pat
 - **Components are Web Components.** Registered via `component('x-name', setupFn, options)`. Names must include a hyphen (`x-foo`, `my-button`).
 - **Component files register tags as side effects.** The browser does not auto-import files by tag name. If `<x-card>` works, some imported module already ran `customElements.define("x-card", ...)`.
 - **Cleanup via `ctx.onDispose(fn)`** in setup, not via return from effect.
-- **Reactive attributes via `ctx.attr(name, default?)`** — returns a Signal<string> that auto-updates when the attribute changes. No MutationObserver needed.
+- **Page cleanup via `onDispose`** in view: `view: ({ onDispose }) => { ... onDispose(() => cleanup()); }`. Only needed for raw APIs (setInterval, WebSocket). `resource()`/`effect()` auto-cleanup.
+- **`untracked()` in page view async** — functions called synchronously in `view()` that read signals must wrap reads in `untracked()` to avoid effect cycles with the router.
+- **Reactive attributes via `ctx.attr(name, default?)`** — returns a Signal<string> that auto-updates when the attribute changes. Uses `observedAttributes` when available, falls back to a per-instance `MutationObserver` for attrs registered during setup. No boilerplate needed.
 
 ## Critical template rules
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@madojs/mado",
-  "version": "0.8.0",
-  "description": "Mado — a small native-web SPA framework with Web Components, signals, tagged-template html, router, resources, and forms. TypeScript-only build, zero runtime dependencies.",
+  "version": "0.9.0",
+  "description": "Mado — a calm browser-native SPA framework for internal tools, admin panels and business apps. Routing, forms, state and data fetching without frontend infrastructure overhead.",
   "type": "module",
   "license": "MIT",
   "keywords": [
@@ -80,4 +80,4 @@
   "engines": {
     "node": ">=20"
   }
-}
+}

package/scripts/bundle.mjs

@@ -120,14 +120,14 @@ const result = await build({
   legalComments: "none",
 });
 
-const entryOutput = Object.entries(result.metafile.outputs).find(
-  ([name, info]) => info.entryPoint && name.endsWith(".js"),
-);
-if (!entryOutput) {
-  console.error("[bundle] entry not found in outputs");
+// With splitting: true, esbuild marks all dynamic-import chunks as having
+// entryPoint. We identify the real app entry by the `entryNames` prefix "main-".
+const mainBundle = (await readdir(ASSETS_DIR))
+  .find((f) => f.startsWith("main-") && f.endsWith(".js") && !f.endsWith(".js.map"));
+if (!mainBundle) {
+  console.error("[bundle] entry not found in outputs (no main-*.js in assets dir)");
   process.exit(1);
 }
-const mainBundle = basename(entryOutput[0]);
 
 // Collect all js chunks in the assets dir.
 const allJs = (await readdir(ASSETS_DIR)).filter((f) => f.endsWith(".js"));