@source-crafter/xzor-runtime 0.1.16 → 0.1.17

package/model.js

@@ -9,7 +9,7 @@ import {
   patchIsland,
   setFineHooks,
   setRenderObserver
-} from "./index-w2yxrgd1.js";
+} from "./index-45b6cjyv.js";
 
 // runtime/entity-set.ts
 class EntitySet extends Array {
@@ -238,6 +238,10 @@ var LOOSE = 64;
 var ITEM = 128;
 var OWNED = 256;
 var FRESH = 512;
+var SHOW = 1024;
+var PAUSE = 2048;
+var PAUSED = 4096;
+var STALE = 8192;
 var bitOf = (index) => index === -1 ? 1 << 31 : index < 30 ? 1 << index : 1 << 30;
 var MEMOS = Symbol("xzor.fine.memos");
 var EMPTY = Symbol("xzor.fine.empty");
@@ -363,7 +367,7 @@ class Binding {
     }
   }
   #loose() {
-    if ((this.flags & (LOOSE | DEAD)) !== 0 || (this.flags & KIND) >= EFFECT || holder === undefined)
+    if ((this.flags & (LOOSE | DEAD | PAUSE)) !== 0 || (this.flags & KIND) >= EFFECT || holder === undefined)
       return;
     this.flags |= LOOSE;
     holder.ctx.loose.push(this);
@@ -384,8 +388,13 @@ class Binding {
   }
   stateHasChanged() {
     const flags = this.flags;
-    if ((flags & DEAD) !== 0)
+    if ((flags & (DEAD | PAUSED)) !== 0) {
+      if ((flags & DEAD) === 0)
+        this.flags |= STALE;
       return;
+    }
+    if ((flags & SHOW) !== 0)
+      return this.#show();
     switch (flags & KIND) {
       case TEXT: {
         const value = this.#run();
@@ -403,6 +412,13 @@ class Binding {
         return setAttr(this.node, (flags & ITEM) !== 0 ? this.read.$n : this.data, this.#run());
       case REGION: {
         const region = this.data;
+        const branch = region.branch;
+        if (branch !== undefined) {
+          const index = this.#run();
+          if (index === region.index)
+            return;
+          region.index = index;
+        }
         disposeAll(region);
         const end = this.node;
         const parent = end.parentNode;
@@ -412,7 +428,7 @@ class Binding {
           node = next;
         }
         const frag = document.createDocumentFragment();
-        within(region, () => this.#run(frag));
+        within(region, () => branch !== undefined ? untracked(() => branch(frag)) : this.#run(frag));
         parent.insertBefore(frag, end);
         return;
       }
@@ -431,6 +447,36 @@ class Binding {
         return;
     }
   }
+  #show() {
+    const show = this.data;
+    const index = this.#run();
+    if (index === show.index)
+      return;
+    const shown = show.branches[show.index];
+    if (shown !== undefined)
+      hideBranch(shown);
+    show.index = index;
+    let branch = show.branches[index];
+    if (branch !== undefined)
+      return showBranch(branch);
+    branch = { bindings: undefined, ctx: show.ctx, start: show.start, item: undefined, branch: undefined, index: -1, first: null, els: [], display: [] };
+    show.branches[index] = branch;
+    const frag = document.createDocumentFragment();
+    within(branch, () => untracked(() => show.build(frag)));
+    branch.first = frag.firstChild;
+    for (let node = frag.firstChild;node !== null; node = node.nextSibling)
+      if (node.nodeType === 1)
+        branch.els.push(node);
+    let before = this.node;
+    for (let i = index + 1;i < show.branches.length; i++) {
+      const next = show.branches[i]?.first;
+      if (next) {
+        before = next;
+        break;
+      }
+    }
+    before.parentNode.insertBefore(frag, before);
+  }
   #becomeIsland() {
     const read = this.read;
     const h = this.data;
@@ -453,7 +499,10 @@ class Binding {
     if ((this.flags & DEAD) !== 0)
       return;
     const kind = this.flags & KIND;
-    if (kind === REGION)
+    if ((this.flags & SHOW) !== 0)
+      for (const branch of this.data.branches)
+        branch !== undefined && disposeAll(branch);
+    else if (kind === REGION)
       disposeAll(this.data);
     else if (kind === LIST || kind === KEYED)
       for (const row of this.data.order)
@@ -529,12 +578,65 @@ function disposeAll(h) {
 }
 function refreshAll(h) {
   for (let b = h.bindings;b !== undefined; b = b.next) {
-    b.stateHasChanged();
     const kind = b.flags & KIND;
-    if (kind === LIST || kind === KEYED)
+    const kept = kind === REGION ? b.data.index : -1;
+    b.stateHasChanged();
+    if ((b.flags & SHOW) !== 0)
+      for (const branch of b.data.branches)
+        branch !== undefined && refreshAll(branch);
+    else if (kind === LIST || kind === KEYED)
       for (const row of b.data.order)
         refreshAll(row);
+    else if (kept !== -1 && kept === b.data.index)
+      refreshAll(b.data);
+  }
+}
+function under(b, f) {
+  const kind = b.flags & KIND;
+  if ((b.flags & SHOW) !== 0)
+    for (const branch of b.data.branches)
+      branch !== undefined && f(branch);
+  else if (kind === REGION)
+    f(b.data);
+  else if (kind === LIST || kind === KEYED)
+    for (const row of b.data.order)
+      f(row);
+}
+function pauseIn(h) {
+  for (let b = h.bindings;b !== undefined; b = b.next) {
+    if ((b.flags & PAUSE) !== 0)
+      under(b, freeze);
+    else
+      under(b, pauseIn);
+  }
+}
+function freeze(h) {
+  for (let b = h.bindings;b !== undefined; b = b.next) {
+    b.flags |= PAUSED;
+    under(b, freeze);
+  }
+}
+function thaw(h) {
+  for (let b = h.bindings;b !== undefined; b = b.next) {
+    const stale = (b.flags & STALE) !== 0;
+    b.flags &= ~(PAUSED | STALE);
+    if (stale)
+      b.stateHasChanged();
+    under(b, thaw);
+  }
+}
+function hideBranch(branch) {
+  for (let i = 0;i < branch.els.length; i++) {
+    const style = branch.els[i].style;
+    branch.display[i] = style.display;
+    style.display = "none";
   }
+  pauseIn(branch);
+}
+function showBranch(branch) {
+  for (let i = 0;i < branch.els.length; i++)
+    branch.els[i].style.display = branch.display[i] ?? "";
+  thaw(branch);
 }
 var textOf = (value) => value === null || value === undefined || value === false ? "" : String(value);
 function setAttr(el, name, value) {
@@ -800,8 +902,8 @@ function on(el, event, handler, h) {
   } else
     el.addEventListener(event, (e) => afterHandler(h.ctx, handler(e)));
 }
-function region(start, end, build, item, flags) {
-  const region2 = { bindings: undefined, ctx: holder.ctx, start, item };
+function region(start, end, build, item, flags, branch) {
+  const region2 = { bindings: undefined, ctx: holder.ctx, start, item, branch, index: -1 };
   track(new Binding(REGION | flags, end, build, region2));
 }
 function list(end, items, reads, build, empty, key) {
@@ -809,6 +911,41 @@ function list(end, items, reads, build, empty, key) {
   track(new Binding(LIST, end, items, state));
 }
 var anchor = (parent) => parent.appendChild(document.createComment(""));
+function awaiting(end, pending, then, fail) {
+  const state = { phase: 0, value: undefined, seq: 0 };
+  const view = new Binding(REGION, end, (p) => {
+    if (state.phase === 0)
+      pending?.(p);
+    else if (state.phase === 1)
+      then?.(p, state.value);
+    else
+      fail?.(p, state.value);
+  }, { bindings: undefined, ctx: holder.ctx, start: end.previousSibling, item: undefined, branch: undefined, index: -1 });
+  const show = (phase, value) => {
+    if ((view.flags & DEAD) !== 0)
+      return;
+    state.phase = phase;
+    state.value = value;
+    view.stateHasChanged();
+  };
+  track(view);
+  return (result) => {
+    const seq = ++state.seq;
+    if (typeof result?.then !== "function")
+      return show(1, result);
+    if (state.phase !== 0)
+      show(0, undefined);
+    result.then((value) => seq === state.seq && show(1, value), (error) => {
+      if (seq !== state.seq)
+        return;
+      show(2, error);
+      if (fail === undefined)
+        queueMicrotask(() => {
+          throw error;
+        });
+    });
+  };
+}
 var fine = {
   template(specs) {
     let node;
@@ -879,6 +1016,16 @@ var fine = {
   regionAt(end, build) {
     region(end.previousSibling, end, build, undefined, 0);
   },
+  branchAt(end, run) {
+    region(end.previousSibling, end, run, undefined, 0, run);
+  },
+  showAt(end, run) {
+    const show = { ctx: holder.ctx, start: end.previousSibling, index: -1, build: run, branches: [] };
+    track(new Binding(REGION | SHOW, end, run, show));
+  },
+  pauseAt(end, build) {
+    region(end.previousSibling, end, () => 0, undefined, PAUSE, build);
+  },
   textOnce(node, read) {
     node.data = textOf(untracked(read));
   },
@@ -925,40 +1072,23 @@ var fine = {
     });
   },
   awaitAt(end, read, pending, then, fail) {
-    const state = { phase: 0, value: undefined, seq: 0 };
-    const view = new Binding(REGION, end, (p) => {
-      if (state.phase === 0)
-        pending?.(p);
-      else if (state.phase === 1)
-        then?.(p, state.value);
-      else
-        fail?.(p, state.value);
-    }, { bindings: undefined, ctx: holder.ctx, start: end.previousSibling, item: undefined });
-    const show = (phase, value) => {
-      if ((view.flags & DEAD) !== 0)
-        return;
-      state.phase = phase;
-      state.value = value;
-      view.stateHasChanged();
-    };
-    track(view);
+    const show = awaiting(end, pending, then, fail);
+    track(new Binding(EFFECT, end, () => show(read()), undefined));
+  },
+  awaitCallAt(end, args, call, pending, then, fail) {
+    const show = awaiting(end, pending, then, fail);
+    let last;
+    const request = new Binding(EFFECT, end, () => show(call(...last)), undefined);
     track(new Binding(EFFECT, end, () => {
-      const result = read();
-      const seq = ++state.seq;
-      if (typeof result?.then !== "function")
-        return show(1, result);
-      if (state.phase !== 0)
-        show(0, undefined);
-      result.then((value) => seq === state.seq && show(1, value), (error) => {
-        if (seq !== state.seq)
-          return;
-        show(2, error);
-        if (fail === undefined)
-          queueMicrotask(() => {
-            throw error;
-          });
-      });
+      const next = args();
+      if (last !== undefined && next.every((v, i) => Object.is(v, last[i])))
+        return;
+      const first = last === undefined;
+      last = next;
+      if (!first)
+        request.stateHasChanged();
     }, undefined));
+    track(request);
   },
   anchors(parent) {
     anchor(parent);
@@ -1770,5 +1900,5 @@ export {
   requiredIdValue
 };
 
-//# debugId=55A54F7D726CA15364756E2164756E21
+//# debugId=E7409C03C0112EDB64756E2164756E21
 //# sourceMappingURL=model.js.map