@farm.js/react 0.1.0-beta.11 → 0.1.0-beta.12

package/dist/compiler-runtime.mjs

@@ -1763,7 +1763,6 @@ function createConditionalBlockComponent(owner) {
     }
     componentWillUnmount() {
       this.unsubscribe?.();
-      owner.setRoot(this.props.id, null);
     }
     render() {
       const node = this.props.render();
@@ -1884,33 +1883,65 @@ function materializeCompilerHostChildren(descriptor) {
   children.push(...staticChildren.slice(cursor, cursor + block.trailing));
   return children;
 }
-function collectCompilerHostBlockIds(descriptor, ids) {
-  for (const child of flattenCompilerHostElements(descriptor.children)) {
-    collectCompilerHostBlockIds(child, ids);
+function collectActiveCompilerHostBlockIds(descriptor, ids) {
+  for (const child of flattenCompilerHostElements(materializeCompilerHostChildren(descriptor))) {
+    collectActiveCompilerHostBlockIds(child, ids);
   }
   const block = descriptor.block;
-  if (!block || ids.has(block.id)) return;
+  if (!block) return;
   ids.add(block.id);
-  if (block.kind === "conditional-ranges") {
-    for (const range of block.ranges) {
-      if (range.truthy) collectCompilerHostBlockIds(range.truthy.create(), ids);
-      if (range.falsy) collectCompilerHostBlockIds(range.falsy.create(), ids);
+}
+function reconcileCompilerFallbackSubscriptions(owner, subscriptions, ids, refresh) {
+  for (const [id, unsubscribe] of subscriptions) {
+    if (ids.has(id)) continue;
+    unsubscribe();
+    subscriptions.delete(id);
+  }
+  for (const id of ids) {
+    if (!subscriptions.has(id)) subscriptions.set(id, owner.subscribe(id, refresh));
+  }
+}
+function clearCompilerFallbackSubscriptions(subscriptions) {
+  for (const unsubscribe of subscriptions.values()) unsubscribe();
+  subscriptions.clear();
+}
+function hasUnsafeCompilerFallbackKeys(descriptor) {
+  const visitKeyedRange = (range) => {
+    const items = materializeIterable(range.items());
+    const keys = items.map((item, index) => keyedRowIdentity(range.rowKey(item, index)));
+    if (new Set(keys).size !== keys.length) return true;
+    return items.some((item, index) => visit(range.create(item, index)));
+  };
+  const visit = (current) => {
+    for (const child of flattenCompilerHostElements(current.children)) {
+      if (visit(child)) return true;
+    }
+    const block = current.block;
+    if (!block) return false;
+    if (block.kind === "conditional-ranges") {
+      for (const range of block.ranges) {
+        const selection = hostConditionalSelection(range);
+        if (selection.kind === "branch" && visit(selection.branch.create())) return true;
+      }
+      return false;
     }
-  } else if (block.kind === "keyed-ranges") {
-    for (const range of block.ranges) {
-      const first = materializeIterable(range.items())[0];
-      if (first !== void 0) collectCompilerHostBlockIds(range.create(first, 0), ids);
+    if (block.kind === "keyed-ranges") {
+      return block.ranges.some(visitKeyedRange);
     }
-  } else {
     for (const range of block.ranges) {
-      if (range.kind === "conditional") {
-        if (range.truthy) collectCompilerHostBlockIds(range.truthy.create(), ids);
-        if (range.falsy) collectCompilerHostBlockIds(range.falsy.create(), ids);
-      } else {
-        const first = materializeIterable(range.items())[0];
-        if (first !== void 0) collectCompilerHostBlockIds(range.create(first, 0), ids);
+      if (range.kind === "keyed") {
+        if (visitKeyedRange(range)) return true;
+        continue;
       }
+      const selection = hostConditionalSelection(range);
+      if (selection.kind === "branch" && visit(selection.branch.create())) return true;
     }
+    return false;
+  };
+  try {
+    return visit(descriptor);
+  } catch {
+    return true;
   }
 }
 function findCompilerHostTarget(root, path) {
@@ -3216,13 +3247,18 @@ function createHostConditionalBlockComponent(owner) {
       this.fallbackVersion = 0;
       this.propSyncQueued = false;
       this.currentProps = this.props;
-      this.fallbackUnsubscribers = [];
+      this.fallbackUnsubscribers = /* @__PURE__ */ new Map();
+      this.fallbackKeysWereUnsafe = false;
       this.activeBranch = null;
       this.instance = null;
       this.requestNestedFallback = () => {
         this.instance?.scope?.cleanup();
         this.activateFallback();
       };
+      this.refreshFallbackDescendant = (afterCommit) => {
+        this.prepareFallbackUpdate();
+        this.forceUpdate(afterCommit);
+      };
       this.captureRoot = (root) => {
         this.root = root;
       };
@@ -3231,25 +3267,32 @@ function createHostConditionalBlockComponent(owner) {
       };
     }
     subscribeFallbackDescendants() {
-      for (const unsubscribe of this.fallbackUnsubscribers) unsubscribe();
-      this.fallbackUnsubscribers = [];
       const ids = /* @__PURE__ */ new Set();
-      if (this.currentProps.truthy) {
-        collectCompilerHostBlockIds(this.currentProps.truthy.create(), ids);
-      }
-      if (this.currentProps.falsy) {
-        collectCompilerHostBlockIds(this.currentProps.falsy.create(), ids);
+      const selection = hostConditionalSelection(this.currentProps);
+      if (selection.kind === "branch") {
+        collectActiveCompilerHostBlockIds(selection.branch.create(), ids);
       }
       ids.delete(this.currentProps.id);
-      for (const id of ids) {
-        this.fallbackUnsubscribers.push(
-          owner.subscribe(id, (afterCommit) => {
-            this.fallbackVersion += 1;
-            this.forceUpdate(afterCommit);
-          })
-        );
+      reconcileCompilerFallbackSubscriptions(
+        owner,
+        this.fallbackUnsubscribers,
+        ids,
+        this.refreshFallbackDescendant
+      );
+    }
+    hasUnsafeFallbackKeys() {
+      try {
+        const selection = hostConditionalSelection(this.currentProps);
+        return selection.kind === "branch" && hasUnsafeCompilerFallbackKeys(selection.branch.create());
+      } catch {
+        return true;
       }
     }
+    prepareFallbackUpdate() {
+      const unsafeKeys = this.hasUnsafeFallbackKeys();
+      if (unsafeKeys || this.fallbackKeysWereUnsafe) this.fallbackVersion += 1;
+      this.fallbackKeysWereUnsafe = unsafeKeys;
+    }
     adopt() {
       if (!this.root) return false;
       const selection = hostConditionalSelection(this.currentProps);
@@ -3288,6 +3331,7 @@ function createHostConditionalBlockComponent(owner) {
       this.instance = null;
       this.activeBranch = null;
       this.subscribeFallbackDescendants();
+      this.fallbackKeysWereUnsafe = this.hasUnsafeFallbackKeys();
       this.fallbackVersion += 1;
       this.setState({ fallback: true }, afterCommit);
     }
@@ -3297,6 +3341,7 @@ function createHostConditionalBlockComponent(owner) {
         return;
       }
       if (this.state.fallback) {
+        this.prepareFallbackUpdate();
         this.forceUpdate(afterCommit);
         return;
       }
@@ -3360,6 +3405,7 @@ function createHostConditionalBlockComponent(owner) {
     }
     shouldComponentUpdate(nextProps, nextState) {
       this.currentProps = nextProps;
+      if (this.state.fallback && nextState.fallback) this.prepareFallbackUpdate();
       if (nextState.fallback || this.state.fallback) return true;
       this.schedulePropSync();
       return false;
@@ -3367,13 +3413,19 @@ function createHostConditionalBlockComponent(owner) {
     componentDidMount() {
       this.mounted = true;
       this.unsubscribe = owner.subscribe(this.props.id, this.refresh);
-      if (!this.adopt()) this.activateFallback();
+      if (this.state.fallback || this.fallbackRequested) {
+        this.subscribeFallbackDescendants();
+        this.fallbackKeysWereUnsafe = this.hasUnsafeFallbackKeys();
+      } else if (!this.adopt()) this.activateFallback();
+    }
+    componentDidUpdate() {
+      if (this.state.fallback) this.subscribeFallbackDescendants();
     }
     componentWillUnmount() {
       this.mounted = false;
       this.unsubscribe?.();
-      for (const unsubscribe of this.fallbackUnsubscribers) unsubscribe();
-      this.fallbackUnsubscribers = [];
+      clearCompilerFallbackSubscriptions(this.fallbackUnsubscribers);
+      this.fallbackKeysWereUnsafe = false;
       this.instance?.scope?.cleanup();
       this.activeBranch = null;
       this.instance = null;
@@ -3405,7 +3457,8 @@ function createConditionalRangesBlockComponent(owner) {
       this.fallbackVersion = 0;
       this.propFallbackQueued = false;
       this.currentProps = this.props;
-      this.fallbackUnsubscribers = [];
+      this.fallbackUnsubscribers = /* @__PURE__ */ new Map();
+      this.fallbackKeysWereUnsafe = false;
       this.rangeInstances = [];
       this.staticSegments = [];
       this.staticValues = [];
@@ -3413,6 +3466,10 @@ function createConditionalRangesBlockComponent(owner) {
         for (const instance of this.rangeInstances) instance?.host.scope?.cleanup();
         this.activateFallback();
       };
+      this.refreshFallbackDescendant = (afterCommit) => {
+        this.prepareFallbackUpdate();
+        this.forceUpdate(afterCommit);
+      };
       this.captureRoot = (root) => {
         this.root = root;
         this.currentProps.rootRef?.(root);
@@ -3422,23 +3479,39 @@ function createConditionalRangesBlockComponent(owner) {
       };
     }
     subscribeFallbackDescendants() {
-      for (const unsubscribe of this.fallbackUnsubscribers) unsubscribe();
-      this.fallbackUnsubscribers = [];
       const ids = /* @__PURE__ */ new Set();
       for (const range of this.currentProps.ranges) {
-        if (range.truthy) collectCompilerHostBlockIds(range.truthy.create(), ids);
-        if (range.falsy) collectCompilerHostBlockIds(range.falsy.create(), ids);
+        const selection = hostConditionalSelection(range);
+        if (selection.kind === "branch") {
+          collectActiveCompilerHostBlockIds(selection.branch.create(), ids);
+        }
       }
       ids.delete(this.currentProps.id);
-      for (const id of ids) {
-        this.fallbackUnsubscribers.push(
-          owner.subscribe(id, (afterCommit) => {
-            this.fallbackVersion += 1;
-            this.forceUpdate(afterCommit);
-          })
-        );
+      reconcileCompilerFallbackSubscriptions(
+        owner,
+        this.fallbackUnsubscribers,
+        ids,
+        this.refreshFallbackDescendant
+      );
+    }
+    hasUnsafeFallbackKeys() {
+      try {
+        for (const range of this.currentProps.ranges) {
+          const selection = hostConditionalSelection(range);
+          if (selection.kind === "branch" && hasUnsafeCompilerFallbackKeys(selection.branch.create())) {
+            return true;
+          }
+        }
+        return false;
+      } catch {
+        return true;
       }
     }
+    prepareFallbackUpdate() {
+      const unsafeKeys = this.hasUnsafeFallbackKeys();
+      if (unsafeKeys || this.fallbackKeysWereUnsafe) this.fallbackVersion += 1;
+      this.fallbackKeysWereUnsafe = unsafeKeys;
+    }
     readSelections(props) {
       const selections = [];
       for (const range of props.ranges) {
@@ -3582,7 +3655,7 @@ function createConditionalRangesBlockComponent(owner) {
         return;
       }
       if (this.state.fallback) {
-        this.fallbackVersion += 1;
+        this.prepareFallbackUpdate();
         this.forceUpdate(afterCommit);
         return;
       }
@@ -3619,6 +3692,7 @@ function createConditionalRangesBlockComponent(owner) {
       this.fallbackRequested = true;
       for (const instance of this.rangeInstances) instance?.host.scope?.cleanup();
       this.subscribeFallbackDescendants();
+      this.fallbackKeysWereUnsafe = this.hasUnsafeFallbackKeys();
       this.setState({ fallback: true }, afterCommit);
     }
     schedulePropFallback() {
@@ -3631,6 +3705,7 @@ function createConditionalRangesBlockComponent(owner) {
     }
     shouldComponentUpdate(nextProps, nextState) {
       this.currentProps = nextProps;
+      if (this.state.fallback && nextState.fallback) this.prepareFallbackUpdate();
       if (nextState.fallback || this.state.fallback) return true;
       this.schedulePropFallback();
       return false;
@@ -3638,13 +3713,19 @@ function createConditionalRangesBlockComponent(owner) {
     componentDidMount() {
       this.mounted = true;
       this.unsubscribe = owner.subscribe(this.props.id, this.refresh);
-      if (!this.adopt()) this.activateFallback();
+      if (this.state.fallback || this.fallbackRequested) {
+        this.subscribeFallbackDescendants();
+        this.fallbackKeysWereUnsafe = this.hasUnsafeFallbackKeys();
+      } else if (!this.adopt()) this.activateFallback();
+    }
+    componentDidUpdate() {
+      if (this.state.fallback) this.subscribeFallbackDescendants();
     }
     componentWillUnmount() {
       this.mounted = false;
       this.unsubscribe?.();
-      for (const unsubscribe of this.fallbackUnsubscribers) unsubscribe();
-      this.fallbackUnsubscribers = [];
+      clearCompilerFallbackSubscriptions(this.fallbackUnsubscribers);
+      this.fallbackKeysWereUnsafe = false;
       for (const instance of this.rangeInstances) instance?.host.scope?.cleanup();
       this.rangeInstances = [];
       this.staticSegments = [];
@@ -6139,9 +6220,7 @@ function createKeyedRowsBlockComponent(owner, options = {}) {
       }
       if (this.state.fallback) {
         const unsafeKeys = this.hasUnsafeFallbackKeys();
-        if (unsafeKeys || this.fallbackKeysWereUnsafe) {
-          this.fallbackVersion += 1;
-        }
+        if (unsafeKeys || this.fallbackKeysWereUnsafe) this.fallbackVersion += 1;
         this.fallbackKeysWereUnsafe = unsafeKeys;
         this.forceUpdate(afterCommit);
         return;
@@ -6277,6 +6356,11 @@ function createKeyedRowsBlockComponent(owner, options = {}) {
       const wasReactOwned = this.hasReactOwnedRows(this.currentProps);
       const willBeReactOwned = this.hasReactOwnedRows(nextProps);
       this.currentProps = nextProps;
+      if (this.state.fallback && nextState.fallback) {
+        const unsafeKeys = this.hasUnsafeFallbackKeys();
+        if (unsafeKeys || this.fallbackKeysWereUnsafe) this.fallbackVersion += 1;
+        this.fallbackKeysWereUnsafe = unsafeKeys;
+      }
       if (nextState.fallback || this.state.fallback) return true;
       if (wasReactOwned || willBeReactOwned) {
         this.eventHandlers.clear();
@@ -6335,6 +6419,7 @@ function createKeyedRangesBlockComponent(owner) {
       this.mounted = false;
       this.fallbackRequested = false;
       this.fallbackVersion = 0;
+      this.fallbackKeysWereUnsafe = false;
       this.propFallbackQueued = false;
       this.currentProps = this.props;
       this.rangeInstances = [];
@@ -6363,6 +6448,13 @@ function createKeyedRangesBlockComponent(owner) {
       }
       return ranges;
     }
+    hasUnsafeFallbackKeys() {
+      try {
+        return this.readRanges(this.currentProps) === null;
+      } catch {
+        return true;
+      }
+    }
     adopt(props = this.currentProps) {
       if (!this.root || !Number.isSafeInteger(props.trailing) || props.trailing < 0) return false;
       const rowsByRange = this.readRanges(props);
@@ -6475,7 +6567,9 @@ function createKeyedRangesBlockComponent(owner) {
         return;
       }
       if (this.state.fallback) {
-        this.fallbackVersion += 1;
+        const unsafeKeys = this.hasUnsafeFallbackKeys();
+        if (unsafeKeys || this.fallbackKeysWereUnsafe) this.fallbackVersion += 1;
+        this.fallbackKeysWereUnsafe = unsafeKeys;
         this.forceUpdate(afterCommit);
         return;
       }
@@ -6508,6 +6602,7 @@ function createKeyedRangesBlockComponent(owner) {
         return;
       }
       this.fallbackRequested = true;
+      this.fallbackKeysWereUnsafe = this.hasUnsafeFallbackKeys();
       this.setState({ fallback: true }, afterCommit);
     }
     schedulePropFallback() {
@@ -6520,6 +6615,11 @@ function createKeyedRangesBlockComponent(owner) {
     }
     shouldComponentUpdate(nextProps, nextState) {
       this.currentProps = nextProps;
+      if (this.state.fallback && nextState.fallback) {
+        const unsafeKeys = this.hasUnsafeFallbackKeys();
+        if (unsafeKeys || this.fallbackKeysWereUnsafe) this.fallbackVersion += 1;
+        this.fallbackKeysWereUnsafe = unsafeKeys;
+      }
       if (nextState.fallback || this.state.fallback) return true;
       this.schedulePropFallback();
       return false;
@@ -6561,14 +6661,24 @@ function createMixedRangesBlockComponent(owner) {
       this.mounted = false;
       this.fallbackRequested = false;
       this.fallbackVersion = 0;
+      this.fallbackKeysWereUnsafe = false;
       this.propFallbackQueued = false;
       this.currentProps = this.props;
       this.controller = null;
-      this.fallbackUnsubscribers = [];
+      this.fallbackUnsubscribers = /* @__PURE__ */ new Map();
       this.captureRoot = (root) => {
         this.root = root;
         this.currentProps.rootRef?.(root);
       };
+      this.refreshFallbackBlock = (afterCommit) => {
+        if (!this.mounted || !this.state.fallback) {
+          afterCommit?.();
+          return;
+        }
+        const nextDescriptor = this.currentProps.create();
+        this.prepareFallbackUpdate(nextDescriptor);
+        this.forceUpdate(afterCommit);
+      };
       this.activateFallback = (afterCommit) => {
         if (!this.mounted || this.state.fallback || this.fallbackRequested) {
           afterCommit?.();
@@ -6577,6 +6687,7 @@ function createMixedRangesBlockComponent(owner) {
         this.fallbackRequested = true;
         this.controller?.cleanup();
         this.controller = null;
+        this.fallbackKeysWereUnsafe = hasUnsafeCompilerFallbackKeys(this.currentProps.create());
         this.fallbackVersion += 1;
         this.setState({ fallback: true }, () => {
           this.subscribeFallbackBlocks();
@@ -6585,26 +6696,27 @@ function createMixedRangesBlockComponent(owner) {
       };
     }
     clearFallbackSubscriptions() {
-      for (const unsubscribe of this.fallbackUnsubscribers) unsubscribe();
-      this.fallbackUnsubscribers = [];
+      clearCompilerFallbackSubscriptions(this.fallbackUnsubscribers);
+    }
+    readFallbackBlockIds(descriptor) {
+      const ids = /* @__PURE__ */ new Set();
+      collectActiveCompilerHostBlockIds(descriptor, ids);
+      return ids;
+    }
+    prepareFallbackUpdate(descriptor) {
+      const unsafeKeys = hasUnsafeCompilerFallbackKeys(descriptor);
+      if (unsafeKeys || this.fallbackKeysWereUnsafe) this.fallbackVersion += 1;
+      this.fallbackKeysWereUnsafe = unsafeKeys;
     }
     subscribeFallbackBlocks() {
-      this.clearFallbackSubscriptions();
       const descriptor = this.currentProps.create();
-      const ids = /* @__PURE__ */ new Set();
-      collectCompilerHostBlockIds(descriptor, ids);
-      for (const id of ids) {
-        this.fallbackUnsubscribers.push(
-          owner.subscribe(id, (afterCommit) => {
-            if (!this.mounted || !this.state.fallback) {
-              afterCommit?.();
-              return;
-            }
-            this.fallbackVersion += 1;
-            this.forceUpdate(afterCommit);
-          })
-        );
-      }
+      const ids = this.readFallbackBlockIds(descriptor);
+      reconcileCompilerFallbackSubscriptions(
+        owner,
+        this.fallbackUnsubscribers,
+        ids,
+        this.refreshFallbackBlock
+      );
     }
     adopt() {
       if (!this.root) return false;
@@ -6640,13 +6752,19 @@ function createMixedRangesBlockComponent(owner) {
     }
     shouldComponentUpdate(nextProps, nextState) {
       this.currentProps = nextProps;
+      if (this.state.fallback && nextState.fallback) {
+        this.prepareFallbackUpdate(this.currentProps.create());
+      }
       if (nextState.fallback || this.state.fallback) return true;
       this.schedulePropFallback();
       return false;
     }
     componentDidMount() {
       this.mounted = true;
-      if (!this.adopt()) this.activateFallback();
+      if (this.state.fallback || this.fallbackRequested) {
+        this.fallbackKeysWereUnsafe = hasUnsafeCompilerFallbackKeys(this.currentProps.create());
+        this.subscribeFallbackBlocks();
+      } else if (!this.adopt()) this.activateFallback();
     }
     componentDidUpdate() {
       if (this.state.fallback) this.subscribeFallbackBlocks();
@@ -6656,6 +6774,7 @@ function createMixedRangesBlockComponent(owner) {
       this.controller?.cleanup();
       this.controller = null;
       this.clearFallbackSubscriptions();
+      this.fallbackKeysWereUnsafe = false;
     }
     render() {
       const container = this.currentProps.render();
@@ -7772,8 +7891,6 @@ function createCompiledComponentWithFeatures(definition, runtimeFeatures) {
       this.dirtyState.clear();
       this.inputSelection = null;
       this.blockRefreshListeners.clear();
-      this.blockRoots.clear();
-      this.blockRootElements.clear();
       this.bindingTargetRefs.clear();
       this.indexedDefinition = null;
       this.staticBindingsByDependency = [];