@hozu/runtime-client 0.6.0 → 0.8.0

package/dist/browser-dev/client.js

@@ -44,59 +44,6 @@ var init_uploads = __esm({
   }
 });
 
-// packages/runtime-client/dist/dev.js
-var dev_exports = {};
-__export(dev_exports, {
-  expose: () => expose,
-  restore: () => restore
-});
-function restore(doc) {
-  const store2 = storage(doc);
-  let saved = {};
-  try {
-    saved = JSON.parse(store2?.getItem(KEY) ?? "{}");
-  } catch {
-  }
-  store2?.removeItem(KEY);
-  return (id, machine) => {
-    const entry = saved[id];
-    if (!entry || !machine || entry.machine !== JSON.stringify(machine))
-      return void 0;
-    return machine.states[entry.snapshot.state]?.invoke ? void 0 : entry.snapshot;
-  };
-}
-function expose(doc, apps, machines) {
-  const win = doc.defaultView;
-  if (!win)
-    return;
-  win.__hozu = {
-    save() {
-      const saved = {};
-      for (const [id, app] of apps) {
-        const snapshot = app.snapshot();
-        const machine = machines.get(id);
-        if (snapshot && machine)
-          saved[id] = { machine: JSON.stringify(machine), snapshot };
-      }
-      storage(doc)?.setItem(KEY, JSON.stringify(saved));
-    }
-  };
-}
-var KEY, storage;
-var init_dev = __esm({
-  "packages/runtime-client/dist/dev.js"() {
-    "use strict";
-    KEY = "hozu:snapshots";
-    storage = (doc) => {
-      try {
-        return doc.defaultView?.sessionStorage ?? null;
-      } catch {
-        return null;
-      }
-    };
-  }
-});
-
 // packages/runtime-client/dist/motion.js
 var motion_exports = {};
 __export(motion_exports, {
@@ -190,43 +137,6 @@ var init_motion = __esm({
   }
 });
 
-// packages/runtime-client/dist/visible.js
-var visible_exports = {};
-__export(visible_exports, {
-  watch: () => watch
-});
-function watch(doc) {
-  const win = doc.defaultView;
-  if (!win?.IntersectionObserver || watched.has(doc))
-    return;
-  watched.add(doc);
-  const seen = new IntersectionObserver((entries) => {
-    for (const e of entries)
-      if (e.isIntersecting)
-        e.target.dispatchEvent(new win.Event("visible"));
-  });
-  const scan = (root) => {
-    if (root instanceof win.Element && root.hasAttribute("data-hozu-visible"))
-      seen.observe(root);
-    for (const el of root.querySelectorAll("[data-hozu-visible]"))
-      seen.observe(el);
-  };
-  scan(doc);
-  new win.MutationObserver((records) => {
-    for (const r of records)
-      for (const n of r.addedNodes)
-        if (n.nodeType === 1)
-          scan(n);
-  }).observe(doc.body, { childList: true, subtree: true });
-}
-var watched;
-var init_visible = __esm({
-  "packages/runtime-client/dist/visible.js"() {
-    "use strict";
-    watched = /* @__PURE__ */ new WeakSet();
-  }
-});
-
 // packages/runtime-client/dist/widget.js
 var widget_exports = {};
 __export(widget_exports, {
@@ -292,226 +202,113 @@ var init_widget = __esm({
   }
 });
 
-// packages/runtime-client/dist/live.js
-var live_exports = {};
-__export(live_exports, {
-  liveStream: () => liveStream
+// packages/runtime-client/dist/visible.js
+var visible_exports = {};
+__export(visible_exports, {
+  watch: () => watch
 });
-var liveStream;
-var init_live = __esm({
-  "packages/runtime-client/dist/live.js"() {
+function watch(doc) {
+  const win = doc.defaultView;
+  if (!win?.IntersectionObserver || watched.has(doc))
+    return;
+  watched.add(doc);
+  const seen = new IntersectionObserver((entries) => {
+    for (const e of entries)
+      if (e.isIntersecting)
+        e.target.dispatchEvent(new win.Event("visible"));
+  });
+  const scan = (root) => {
+    if (root instanceof win.Element && root.hasAttribute("data-hozu-visible"))
+      seen.observe(root);
+    for (const el of root.querySelectorAll("[data-hozu-visible]"))
+      seen.observe(el);
+  };
+  scan(doc);
+  new win.MutationObserver((records) => {
+    for (const r of records)
+      for (const n of r.addedNodes)
+        if (n.nodeType === 1)
+          scan(n);
+  }).observe(doc.body, { childList: true, subtree: true });
+}
+var watched;
+var init_visible = __esm({
+  "packages/runtime-client/dist/visible.js"() {
     "use strict";
-    liveStream = (doc) => (onTags) => {
-      const Source = doc.defaultView?.EventSource;
-      if (!Source)
-        return;
-      new Source(new URL("live", import.meta.url)).addEventListener("message", (e) => onTags(JSON.parse(e.data)));
-    };
+    watched = /* @__PURE__ */ new WeakSet();
   }
 });
 
-// packages/runtime-client/dist/navigate.js
-var navigate_exports = {};
-__export(navigate_exports, {
-  islandsIn: () => islandsIn,
-  ranges: () => ranges,
-  routeOf: () => routeOf,
-  soft: () => soft,
-  swap: () => swap,
-  track: () => track
+// packages/runtime-client/dist/dev.js
+var dev_exports = {};
+__export(dev_exports, {
+  expose: () => expose,
+  restore: () => restore
 });
-function routeOf(routes, pathname) {
-  let best = null;
-  let fewest = Infinity;
-  for (const [id, path] of Object.entries(routes)) {
-    const { pattern, keys } = patternOf(path);
-    if (keys < fewest && pattern.test(pathname)) {
-      best = id;
-      fewest = keys;
-    }
-  }
-  return best;
-}
-function islandsIn(root) {
-  const found = [];
-  const walker = (root.ownerDocument ?? root).createTreeWalker(root, 128);
-  let view = null;
-  while (walker.nextNode()) {
-    const c = walker.currentNode;
-    if (c.data === "i")
-      found.push({ marker: c, view });
-    else if (c.data.startsWith("v:"))
-      view = c.data.slice(2);
-    else if (c.data === "/v")
-      view = null;
-  }
-  return found;
-}
-function track(state, session, payload, found) {
-  session.islands(payload).forEach((island, i) => {
-    const view = found[i]?.view;
-    if (!view)
-      return;
-    const owners = state.views.get(view) ?? /* @__PURE__ */ new Set();
-    owners.add(island.feature);
-    state.views.set(view, owners);
-  });
-  state.soft = payload.soft ?? {};
-  Object.assign(state.routes, payload.routes);
-}
-function ranges(body) {
-  const out = /* @__PURE__ */ new Map();
-  let current = null;
-  for (const n of [...body.childNodes]) {
-    if (n.nodeType === 8 && n.data.startsWith("v:")) {
-      current = [n];
-      out.set(n.data.slice(2), current);
-    } else if (current) {
-      current.push(n);
-      if (n.nodeType === 8 && n.data === "/v")
-        current = null;
-    }
-  }
-  return out;
-}
-async function swap(session, state, next, kept) {
-  const { doc, apps } = session;
-  const { views } = state;
-  const script = next.getElementById("hozu-payload");
-  const fresh = ranges(next.body);
-  const live = ranges(doc.body);
-  if (!script?.textContent || kept.some((v) => !fresh.has(v) || !live.has(v)))
-    return false;
-  const payload = JSON.parse(script.textContent);
-  const keep = new Set(kept);
-  const found = islandsIn(next.body);
-  const needed = /* @__PURE__ */ new Set();
-  for (const v of keep)
-    for (const f of views.get(v) ?? [])
-      needed.add(f);
-  session.islands(payload).forEach((island, i) => {
-    const view = found[i]?.view;
-    if (view === void 0 || view === null || !keep.has(view))
-      needed.add(island.feature);
-  });
-  for (const [id, app] of apps)
-    if (!needed.has(id)) {
-      app.destroy();
-      apps.delete(id);
-    }
-  for (const v of [...views.keys()])
-    if (!keep.has(v))
-      views.delete(v);
-  const anchor = doc.getElementById("hozu-payload");
-  let cursor = 0;
-  const order = [...live.keys()].filter((v) => keep.has(v));
-  for (const [ref, nodes] of fresh) {
-    if (keep.has(ref)) {
-      cursor++;
-      continue;
-    }
-    const before = order[cursor] ? live.get(order[cursor])[0] : anchor;
-    for (const n of nodes)
-      doc.body.insertBefore(n, before);
+function restore(doc) {
+  const store2 = storage(doc);
+  let saved = {};
+  try {
+    saved = JSON.parse(store2?.getItem(KEY) ?? "{}");
+  } catch {
   }
-  for (const [ref, nodes] of live)
-    if (!keep.has(ref))
-      for (const n of nodes)
-        n.remove();
-  if (anchor)
-    anchor.textContent = script.textContent;
-  for (const el of doc.head.querySelectorAll(HEAD))
-    el.remove();
-  for (const el of next.head.querySelectorAll(HEAD))
-    doc.head.append(el);
-  doc.documentElement.lang = next.documentElement.lang;
-  await session.mount(payload, found.map((f) => f.view !== null && keep.has(f.view) ? void 0 : f.marker));
-  track(state, session, payload, found);
-  return true;
+  store2?.removeItem(KEY);
+  return (id, machine) => {
+    const entry = saved[id];
+    if (!entry || !machine || entry.machine !== JSON.stringify(machine))
+      return void 0;
+    return machine.states[entry.snapshot.state]?.invoke ? void 0 : entry.snapshot;
+  };
 }
-function soft(session) {
-  const { doc } = session;
+function expose(doc, apps, machines) {
   const win = doc.defaultView;
-  const script = doc.getElementById("hozu-payload");
-  if (!win?.navigation || !script?.textContent)
+  if (!win)
     return;
-  const state = { views: /* @__PURE__ */ new Map(), soft: {}, routes: {} };
-  track(state, session, JSON.parse(script.textContent), islandsIn(doc.body));
-  let announcer = null;
-  let bypass = false;
-  const announce = (title) => {
-    if (!announcer) {
-      announcer = doc.createElement("div");
-      announcer.setAttribute("aria-live", "polite");
-      announcer.style.cssText = "position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap";
-      doc.body.append(announcer);
+  win.__hozu = {
+    save() {
+      const saved = {};
+      for (const [id, app] of apps) {
+        const snapshot = app.snapshot();
+        const machine = machines.get(id);
+        if (snapshot && machine)
+          saved[id] = { machine: JSON.stringify(machine), snapshot };
+      }
+      storage(doc)?.setItem(KEY, JSON.stringify(saved));
     }
-    announcer.textContent = title;
   };
-  win.navigation.addEventListener("navigate", (event) => {
-    const e = event;
-    if (bypass || !e.canIntercept || e.hashChange || e.downloadRequest !== null || e.formData)
-      return;
-    if (e.navigationType === "reload")
-      return;
-    const url = new URL(e.destination.url);
-    if (url.origin !== win.location.origin)
-      return;
-    const target = routeOf(state.routes, url.pathname);
-    const kept = target ? state.soft[target] : void 0;
-    if (!kept)
-      return;
-    const hard = () => {
-      bypass = true;
-      win.location.replace(url.href);
-    };
-    e.intercept({
-      handler: async () => {
-        const root = doc.documentElement;
-        root.setAttribute("data-hozu-navigating", "");
-        try {
-          const response = await win.fetch(url.href, { headers: { accept: "text/html" } });
-          const type = response.headers.get("content-type") ?? "";
-          if (response.status !== 200 || response.redirected || !type.includes("text/html"))
-            return hard();
-          const next = new win.DOMParser().parseFromString(await response.text(), "text/html");
-          let ok = true;
-          const run = async () => {
-            ok = await swap(session, state, next, kept);
-          };
-          const transition2 = doc.startViewTransition;
-          if (transition2)
-            await transition2.call(doc, run).updateCallbackDone;
-          else
-            await run();
-          if (!ok)
-            return hard();
-          announce(doc.title);
-        } catch {
-          hard();
-        } finally {
-          root.removeAttribute("data-hozu-navigating");
-        }
-      }
-    });
-  });
 }
-var HEAD, groups, patternOf;
-var init_navigate = __esm({
-  "packages/runtime-client/dist/navigate.js"() {
+var KEY, storage;
+var init_dev = __esm({
+  "packages/runtime-client/dist/dev.js"() {
     "use strict";
-    HEAD = 'title,meta[name=description],meta[name=robots],link[rel=canonical],meta[property],script[type="application/ld+json"]';
-    groups = { "?": "(?:/[^/]+)?", "+": "(?:/[^/]+)+", "*": "(?:/[^/]+)*" };
-    patternOf = (path) => {
-      let keys = 0;
-      const source = path.split(/(\/:[A-Za-z]\w*[?*+]?)/).map((part, i) => {
-        if (i % 2 === 0)
-          return part.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-        const mod = part.at(-1);
-        keys += mod === "+" || mod === "*" ? 1.01 : 1;
-        return groups[mod] ?? "/[^/]+";
-      }).join("");
-      return { pattern: new RegExp(`^${source.replace(/\/$/, "")}/?$`), keys };
+    KEY = "hozu:snapshots";
+    storage = (doc) => {
+      try {
+        return doc.defaultView?.sessionStorage ?? null;
+      } catch {
+        return null;
+      }
+    };
+  }
+});
+
+// packages/runtime-client/dist/live.js
+var live_exports = {};
+__export(live_exports, {
+  liveStream: () => liveStream
+});
+var liveStream;
+var init_live = __esm({
+  "packages/runtime-client/dist/live.js"() {
+    "use strict";
+    liveStream = (doc) => (onTags, tags) => {
+      const Source = doc.defaultView?.EventSource;
+      if (!Source)
+        return;
+      const url = new URL("live", import.meta.url);
+      for (const t of new Set(tags))
+        url.searchParams.append("tag", t);
+      new Source(url).addEventListener("message", (e) => onTags(JSON.parse(e.data)));
     };
   }
 });
@@ -520,6 +317,8 @@ var init_navigate = __esm({
 function getIn(value, path) {
   let current = value;
   for (const key of path) {
+    if (typeof current === "string" && key === "length")
+      return current.length;
     if (current === null || typeof current !== "object")
       return null;
     current = current[key];
@@ -584,8 +383,8 @@ var CompileError = class extends Error {
   name = "CompileError";
 };
 function compileValue(v, fns) {
-  if ("literal" in v) {
-    const literal = v.literal;
+  if ("literal" in v || "formRef" in v) {
+    const literal = "literal" in v ? v.literal : v.formRef;
     return () => literal;
   }
   if ("object" in v) {
@@ -614,16 +413,22 @@ function compileValue(v, fns) {
     const test = guard(v.test, fns);
     return (env) => test(env);
   }
-  const { path } = v;
-  if (v.ref === "binding") {
-    const depth = v.depth;
+  if ("endpoint" in v) {
+    const id = v.endpoint;
+    const input = compileValue(v.input ?? { literal: null }, fns);
+    return (env) => pathOf(env.routes?.[id] ?? "", null, input(env));
+  }
+  const r = v;
+  const { path } = r;
+  if (r.ref === "binding") {
+    const depth = r.depth;
     return path.length ? (env) => getIn(env.bindings?.[depth], path) : (env) => env.bindings?.[depth] ?? null;
   }
-  if (v.ref === "dom") {
+  if (r.ref === "dom") {
     const [field, ...rest] = path;
-    return (env) => env.dom && field ? getIn(env.dom(field), rest) : null;
+    return (env) => env.dom && field ? getIn(env.dom(field), rest) ?? (field === "formAll" ? [] : null) : null;
   }
-  const ref = v.ref;
+  const ref = r.ref;
   if (path.length === 0)
     return (env) => env[ref] ?? null;
   return (env) => getIn(env[ref], path);
@@ -686,7 +491,7 @@ function assign(a, fns) {
         const list = getIn(ctx, path);
         const match = v({ ...env, context: ctx });
         const items = Array.isArray(list) ? list : [];
-        return setIn(ctx, path, items.filter((item) => !equal(item !== null && typeof item === "object" && !Array.isArray(item) ? item[key] : null, match)));
+        return setIn(ctx, path, items.filter((item) => !equal(key === null ? item : item !== null && typeof item === "object" && !Array.isArray(item) ? item[key] : null, match)));
       };
     }
   }
@@ -819,6 +624,27 @@ function messageOf(data, error) {
   return error;
 }
 
+// packages/core/dist/ir/forms.js
+function formEntries(entries, submitter) {
+  const first = /* @__PURE__ */ Object.create(null);
+  const all = /* @__PURE__ */ Object.create(null);
+  const add = (k, v) => {
+    const s = typeof v === "string" ? v : v.name;
+    const list = all[k];
+    if (list)
+      list.push(s);
+    else {
+      all[k] = [s];
+      first[k] = s;
+    }
+  };
+  for (const [k, v] of entries)
+    add(k, v);
+  if (submitter)
+    add(...submitter);
+  return { first, all };
+}
+
 // packages/runtime-client/dist/dom.js
 var SVG_NS = "http://www.w3.org/2000/svg";
 var stringBooleans = /* @__PURE__ */ new Set(["contenteditable", "draggable", "spellcheck"]);
@@ -861,13 +687,12 @@ var domField = (e) => (field) => {
       return num(t?.valueAsNumber);
     case "files":
       return fileList(t?.files ?? e.dataTransfer?.files);
-    case "form": {
-      const out = {};
+    case "form":
+    case "formAll": {
       const form = e.target;
       const win = form.ownerDocument.defaultView;
-      for (const [k, v] of new (win?.FormData ?? FormData)(form))
-        out[k] = typeof v === "string" ? v : v.name;
-      return out;
+      const d = formEntries(new (win?.FormData ?? FormData)(form, e.submitter));
+      return field === "form" ? d.first : d.all;
     }
     case "open":
       return t?.open === true;
@@ -956,7 +781,7 @@ function clear(start, end) {
 function createApp(doc, options) {
   const { machine, fns = {}, params = null, search = null, routes = {} } = options;
   const { data: payload } = store(options.payload);
-  const ranges2 = [];
+  const ranges = [];
   const timers = /* @__PURE__ */ new Set();
   let first = machine ? options.snapshot ? null : init(machine) : null;
   let snapshot = options.snapshot ?? first?.snapshot ?? null;
@@ -1402,7 +1227,7 @@ function createApp(doc, options) {
       const block = [];
       const [a, b] = span(c, () => render(node, scope, c, block, ns));
       if (a && b)
-        ranges2.push([a, b]);
+        ranges.push([a, b]);
       const connected = a?.isConnected === true;
       const update = () => {
         if (connected && !a.isConnected)
@@ -1433,10 +1258,10 @@ function createApp(doc, options) {
         m.stop();
       mounted.clear();
       root.length = 0;
-      for (const [a, b] of ranges2)
+      for (const [a, b] of ranges)
         for (const n of range(a, b))
           n.remove();
-      ranges2.length = 0;
+      ranges.length = 0;
     }
   };
 }
@@ -1487,12 +1312,14 @@ async function hydrate(doc, { transport = fetchTransport, query = fetchQuery, li
   const script = doc.getElementById("hozu-payload");
   if (!script?.textContent)
     return apps;
-  const shared = { data: /* @__PURE__ */ new Map(), versions: /* @__PURE__ */ new Map() };
-  const fns = {};
-  const widgets = {};
-  const routes = {};
-  const liveKeys = /* @__PURE__ */ new Map();
-  const loaded = {};
+  const payload = JSON.parse(script.textContent);
+  const shared = { data: new Map(payload.data), versions: /* @__PURE__ */ new Map() };
+  const fns = payload.fns ? await loadFns(payload.fns) : {};
+  const { widgets, routes } = payload;
+  const motion = payload.motion ? await Promise.resolve().then(() => (init_motion(), motion_exports)) : void 0;
+  const mountWidget2 = Object.keys(widgets).length ? (await Promise.resolve().then(() => (init_widget(), widget_exports))).mountWidget : void 0;
+  if (payload.visible)
+    void Promise.resolve().then(() => (init_visible(), visible_exports)).then((m) => m.watch(doc));
   const inflight = /* @__PURE__ */ new Map();
   const onQuery = (q, input) => {
     const key = q + JSON.stringify(input);
@@ -1503,106 +1330,78 @@ async function hydrate(doc, { transport = fetchTransport, query = fetchQuery, li
     }
     return pending;
   };
+  const liveKeys = Object.entries(payload.live ?? {});
+  const onTags = async (tags) => {
+    if (busy)
+      return void queued.push(...tags);
+    const stale = liveKeys.filter(([, l]) => l.tags.some((t) => tags.includes(t)));
+    for (const [key, l] of stale)
+      shared.data.set(key, await query(l.query, l.input));
+    if (stale.length)
+      for (const app of apps.values())
+        app.sync();
+  };
+  let busy = 0;
+  let queued = [];
   const onInvoke = async (effect, input) => {
-    const { result, refreshed } = await transport(effect, input, [...shared.data.keys()]);
+    busy++;
+    const { result, refreshed, session } = await transport(effect, input, [...shared.data.keys()]).finally(() => busy--);
+    if (session) {
+      shared.data.clear();
+      queued = [];
+    }
     for (const [key, value] of refreshed) {
       shared.data.set(key, value);
       shared.versions.set(key, (shared.versions.get(key) ?? 0) + 1);
     }
-    if (refreshed.length)
+    if (refreshed.length || session)
       for (const app of apps.values())
         app.sync();
+    if (!busy && queued.length)
+      onTags(queued.splice(0));
     return result;
   };
   const dev = true ? { restore: (await Promise.resolve().then(() => (init_dev(), dev_exports))).restore(doc), machines: /* @__PURE__ */ new Map() } : null;
-  const session = {
-    doc,
-    apps,
-    islands: islandsOf,
-    async mount(payload2, markers2) {
-      if (!loaded.motion && payload2.motion)
-        loaded.motion = await Promise.resolve().then(() => (init_motion(), motion_exports));
-      if (payload2.visible)
-        void Promise.resolve().then(() => (init_visible(), visible_exports)).then((m) => m.watch(doc));
-      if (!loaded.mountWidget && Object.keys(payload2.widgets).length)
-        loaded.mountWidget = (await Promise.resolve().then(() => (init_widget(), widget_exports))).mountWidget;
-      if (!loaded.fns && payload2.fns) {
-        Object.assign(fns, await loadFns(payload2.fns));
-        loaded.fns = true;
-      }
-      Object.assign(widgets, payload2.widgets);
-      Object.assign(routes, payload2.routes);
-      for (const [key, value] of payload2.data) {
-        if (shared.data.has(key))
-          shared.versions.set(key, (shared.versions.get(key) ?? 0) + 1);
-        shared.data.set(key, value);
-      }
-      const created = [];
-      for (const [id, machine] of Object.entries(payload2.features)) {
-        if (apps.has(id))
-          continue;
-        const snapshot = dev?.restore(id, machine) || payload2.snapshots?.[id];
-        if (true)
-          dev?.machines.set(id, machine);
-        const app = createApp(doc, {
-          machine: machine ? compileMachine({ id, machine }, fns, routes) : null,
-          payload: shared,
-          params: payload2.params,
-          search: payload2.search,
-          ...snapshot ? { snapshot } : {},
-          fns,
-          widgets,
-          routes,
-          get motion() {
-            return loaded.motion;
-          },
-          get mountWidget() {
-            return loaded.mountWidget;
-          },
-          loadWidget,
-          onQuery,
-          onInvoke,
-          onNavigate: (url) => doc.defaultView?.location.assign(url)
-        });
-        apps.set(id, app);
-        created.push(app);
-      }
-      islandsOf(payload2).forEach((island, i) => {
-        const at = markers2[i];
-        const node = payload2.nodes[island.node];
-        if (at?.parentNode && node)
-          apps.get(island.feature)?.attach(at.parentNode, at.nextSibling, node, island.scope, true);
-      });
-      for (const app of apps.values())
-        app.sync();
-      for (const app of created)
-        app.start();
-      for (const [key, l] of Object.entries(payload2.live ?? {}))
-        liveKeys.set(key, l);
-      if (liveKeys.size && !loaded.live) {
-        loaded.live = true;
-        (live ?? (await Promise.resolve().then(() => (init_live(), live_exports))).liveStream(doc))(async (tags) => {
-          const stale = [...liveKeys].filter(([, l]) => l.tags.some((t) => tags.includes(t)));
-          for (const [key, l] of stale)
-            shared.data.set(key, await query(l.query, l.input));
-          if (stale.length)
-            for (const app of apps.values())
-              app.sync();
-        });
-      }
-    }
-  };
-  const payload = JSON.parse(script.textContent);
+  for (const [id, machine] of Object.entries(payload.features)) {
+    const snapshot = dev?.restore(id, machine) || payload.snapshots?.[id];
+    if (true)
+      dev?.machines.set(id, machine);
+    apps.set(id, createApp(doc, {
+      machine: machine ? compileMachine({ id, machine }, fns, routes) : null,
+      payload: shared,
+      params: payload.params,
+      search: payload.search,
+      ...snapshot ? { snapshot } : {},
+      fns,
+      widgets,
+      routes,
+      motion,
+      mountWidget: mountWidget2,
+      loadWidget,
+      onQuery,
+      onInvoke,
+      onNavigate: (url) => doc.defaultView?.location.assign(url)
+    }));
+  }
   const markers = [];
   const walker = doc.createTreeWalker(doc.body ?? doc, 128);
   while (walker.nextNode())
     if (walker.currentNode.data === "i")
       markers.push(walker.currentNode);
-  await session.mount(payload, markers);
+  islandsOf(payload).forEach((island, i) => {
+    const at = markers[i];
+    const node = payload.nodes[island.node];
+    if (at?.parentNode && node)
+      apps.get(island.feature)?.attach(at.parentNode, at.nextSibling, node, island.scope, true);
+  });
+  for (const app of apps.values())
+    app.sync();
+  for (const app of apps.values())
+    app.start();
+  if (liveKeys.length)
+    (live ?? (await Promise.resolve().then(() => (init_live(), live_exports))).liveStream(doc))(onTags, liveKeys.flatMap(([, l]) => l.tags));
   if (dev)
     (await Promise.resolve().then(() => (init_dev(), dev_exports))).expose(doc, apps, dev.machines);
-  if (payload.soft)
-    void Promise.resolve().then(() => (init_navigate(), navigate_exports)).then((m) => m.soft(session));
   doc.documentElement.setAttribute("data-hozu-ready", "");
   return apps;
 }