@farm.js/react 0.1.0-beta.20 → 0.1.0-beta.21

package/README.md

@@ -925,6 +925,12 @@ components, fragments, refs, SVG, spreads, dangerous HTML, and index keys keep t
 row on React's fallback. Additional keyed levels that satisfy the same host-only contract are
 analyzed recursively instead of using a fixed nesting limit.
 
+When every inner key stays in the same order, the nested scope reuses its row table and skips
+position-map construction and LIS planning. It still validates all keys and updates every child
+scope and binding. Insertions, removals, and reorders keep the existing structural reconciliation;
+duplicate keys or an invalid child scope keep the existing React fallback. This also applies to
+keyed ranges next to host-only conditions inside a nested mixed range.
+
 For example, `boards → columns → cards → tags` becomes a tree of keyed scopes. Each stable parent
 key owns its child key table and LIS pass. Moving a board carries its column, card, and tag scopes;
 reordering cards reconciles only the selected column. Block IDs stay globally unique while runtime

package/dist/compiler-runtime.cjs

@@ -2998,6 +2998,24 @@ var CompilerNestedConditionalRanges = class {
     this.staticValues.length = 0;
   }
 };
+function reconcileStableNestedKeyedRows(range, previous, rows) {
+  if (rows.keys.length !== previous.size) return void 0;
+  let index = 0;
+  for (const key of previous.keys()) {
+    if (rows.keys[index++] !== key) return void 0;
+  }
+  index = 0;
+  for (const existing of previous.values()) {
+    const item = rows.items[index];
+    const descriptor = range.create(item, index);
+    if (!existing.scope?.update(descriptor)) return false;
+    applyKeyedRowBindings(range, existing, item, index);
+    existing.item = item;
+    existing.index = index;
+    index += 1;
+  }
+  return true;
+}
 var CompilerNestedKeyedRanges = class {
   constructor(owner, root, host, block, onFallback) {
     this.owner = owner;
@@ -3171,6 +3189,8 @@ var CompilerNestedKeyedRanges = class {
   reconcileRange(rangeIndex, rows) {
     const range = this.block.ranges[rangeIndex];
     const previous = this.instances[rangeIndex];
+    const stable = reconcileStableNestedKeyedRows(range, previous, rows);
+    if (stable !== void 0) return stable;
     const oldIndices = /* @__PURE__ */ new Map();
     [...previous.keys()].forEach((key, index) => oldIndices.set(key, index));
     const nextKeys = new Set(rows.keys);
@@ -3529,6 +3549,8 @@ var CompilerNestedMixedRanges = class {
     const instance = this.instances[rangeIndex];
     if (instance.kind !== "keyed") return false;
     const previous = instance.value;
+    const stable = reconcileStableNestedKeyedRows(range, previous, rows);
+    if (stable !== void 0) return stable;
     const oldIndices = /* @__PURE__ */ new Map();
     [...previous.keys()].forEach((key, index) => oldIndices.set(key, index));
     const nextKeys = new Set(rows.keys);
@@ -6009,6 +6031,7 @@ function createKeyedRowsBlockComponentCore(owner, options = {}) {
       this.currentProps = this.props;
       this.definitionVersion = owner.getDefinitionVersion?.();
       this.instances = /* @__PURE__ */ new Map();
+      this.reactElements = [];
       this.keyedTargets = options.keyedTargets?.(this.props);
       this.renderVersion = 0;
       this.eventHandlers = /* @__PURE__ */ new Map();
@@ -6125,7 +6148,7 @@ function createKeyedRowsBlockComponentCore(owner, options = {}) {
           );
           if (positionedInstances) {
             if (positionedInstances !== this.instances) {
-              this.instances = new Map(positionedInstances);
+              this.instances = positionedInstances;
               this.rebuildElementIndex(this.instances);
               this.pruneEventHandlers();
               this.pruneConditionalListeners();
@@ -6167,8 +6190,10 @@ function createKeyedRowsBlockComponentCore(owner, options = {}) {
             this.instances = rollingWindowInstances instanceof Map ? rollingWindowInstances : new Map(rollingWindowInstances);
             if (delta) {
               COMPILER_KEYED_ROLLING_WINDOW_DELTAS.delete(rollingWindowInstances);
-              for (const instance of delta.added) {
-                this.instancesByElement.set(instance.element, instance);
+              if (this.usesDelegatedEvents()) {
+                for (const instance of delta.added) {
+                  this.instancesByElement.set(instance.element, instance);
+                }
               }
               for (const key of delta.removedKeys) {
                 this.eventHandlers.delete(key);
@@ -6208,7 +6233,7 @@ function createKeyedRowsBlockComponentCore(owner, options = {}) {
             this.hasReactOwnedRows()
           );
           if (prependedInstances) {
-            this.instances = new Map(prependedInstances);
+            this.instances = prependedInstances;
             this.rebuildElementIndex(this.instances);
             this.commitCurrentCollection(dirtyState);
             afterCommit?.();
@@ -6232,6 +6257,7 @@ function createKeyedRowsBlockComponentCore(owner, options = {}) {
     }
     rebuildElementIndex(instances) {
       this.instancesByElement = /* @__PURE__ */ new WeakMap();
+      if (!this.usesDelegatedEvents()) return;
       for (const instance of instances.values()) {
         this.instancesByElement.set(instance.element, instance);
       }
@@ -6366,6 +6392,7 @@ function createKeyedRowsBlockComponentCore(owner, options = {}) {
       }
       this.cleanupHostScopes();
       this.instances = instances;
+      this.reactElements = elements;
       this.rebuildElementIndex(instances);
       this.pruneEventHandlers();
       this.pruneConditionalListeners();
@@ -6787,6 +6814,10 @@ function createKeyedRowsBlockComponentCore(owner, options = {}) {
       }
       if (nextState.fallback || this.state.fallback) return true;
       if (definitionChanged || wasReactOwned || willBeReactOwned) {
+        const elements = this.root?.children;
+        if (elements && (elements.length !== this.reactElements.length || this.reactElements.some((element, index) => element !== elements[index]))) {
+          this.fallbackVersion += 1;
+        }
         this.eventHandlers.clear();
         return true;
       }
@@ -6815,6 +6846,7 @@ function createKeyedRowsBlockComponentCore(owner, options = {}) {
       this.id = void 0;
       this.cleanupHostScopes();
       this.instances.clear();
+      this.reactElements = [];
       this.keyedTargets?.clear();
       this.instancesByElement = /* @__PURE__ */ new WeakMap();
       this.eventHandlers.clear();
@@ -6830,7 +6862,7 @@ function createKeyedRowsBlockComponentCore(owner, options = {}) {
       }
       return React__default.default.cloneElement(container, {
         ...this.delegatedContainerProps(container),
-        key: this.state.fallback ? `react-${this.fallbackVersion}` : "compiled",
+        key: `${this.state.fallback ? "react" : "compiled"}-${this.fallbackVersion}`,
         ref: this.captureRoot
       });
     }