@react-aria/collections - npm Package Compare versions

Comparing version 3.0.0-nightly-50c7ada5d-241223 to 3.0.0-nightly-5334df7f1-250226

dist/BaseCollection.main.js

@@ -38,2 +38,4 @@
         node.render = this.render;
+        node.colSpan = this.colSpan;
+        node.colIndex = this.colIndex;
         return node;
@@ -55,2 +57,4 @@ }
         this.props = {};
+        this.colSpan = null;
+        this.colIndex = null;
         this.type = type;
@@ -163,3 +167,3 @@ this.key = key;
                 let lastChildInSection = null;
-                for (let child of this.getChildren(node.key))if (filterFn(child.textValue) || child.type === 'header') {
+                for (let child of this.getChildren(node.key))if ($499e2959ba1abacc$var$shouldKeepNode(child, filterFn, this, newCollection)) {
                     let clonedChild = child.clone();
@@ -209,12 +213,15 @@ // eslint-disable-next-line max-depth
                 }
-            } else if (filterFn(node.textValue)) {
+            } else {
+                // At this point, the node is either a subdialogtrigger node or a standard row/item
                 let clonedNode = node.clone();
-                if (newCollection.firstKey == null) newCollection.firstKey = clonedNode.key;
-                if (lastNode != null && lastNode.type !== 'section' && lastNode.type !== 'separator' && lastNode.parentKey === clonedNode.parentKey) {
-                    lastNode.nextKey = clonedNode.key;
-                    clonedNode.prevKey = lastNode.key;
-                } else clonedNode.prevKey = null;
-                clonedNode.nextKey = null;
-                newCollection.addNode(clonedNode);
-                lastNode = clonedNode;
+                if ($499e2959ba1abacc$var$shouldKeepNode(clonedNode, filterFn, this, newCollection)) {
+                    if (newCollection.firstKey == null) newCollection.firstKey = clonedNode.key;
+                    if (lastNode != null && lastNode.type !== 'section' && lastNode.type !== 'separator' && lastNode.parentKey === clonedNode.parentKey) {
+                        lastNode.nextKey = clonedNode.key;
+                        clonedNode.prevKey = lastNode.key;
+                    } else clonedNode.prevKey = null;
+                    clonedNode.nextKey = null;
+                    newCollection.addNode(clonedNode);
+                    lastNode = clonedNode;
+                }
             }
@@ -241,4 +248,19 @@ }
 }
+function $499e2959ba1abacc$var$shouldKeepNode(node, filterFn, oldCollection, newCollection) {
+    if (node.type === 'subdialogtrigger' || node.type === 'submenutrigger') {
+        // Subdialog wrapper should only have one child, if it passes the filter add it to the new collection since we don't need to
+        // do any extra handling for its first/next key
+        let triggerChild = [
+            ...oldCollection.getChildren(node.key)
+        ][0];
+        if (triggerChild && filterFn(triggerChild.textValue)) {
+            let clonedChild = triggerChild.clone();
+            newCollection.addNode(clonedChild);
+            return true;
+        } else return false;
+    } else if (node.type === 'header') return true;
+    else return filterFn(node.textValue);
+}
 
 
 //# sourceMappingURL=BaseCollection.main.js.map

dist/BaseCollection.module.js

@@ -31,2 +31,4 @@ /*
         node.render = this.render;
+        node.colSpan = this.colSpan;
+        node.colIndex = this.colIndex;
         return node;
@@ -48,2 +50,4 @@ }
         this.props = {};
+        this.colSpan = null;
+        this.colIndex = null;
         this.type = type;
@@ -156,3 +160,3 @@ this.key = key;
                 let lastChildInSection = null;
-                for (let child of this.getChildren(node.key))if (filterFn(child.textValue) || child.type === 'header') {
+                for (let child of this.getChildren(node.key))if ($23b9f4fcf0fe224b$var$shouldKeepNode(child, filterFn, this, newCollection)) {
                     let clonedChild = child.clone();
@@ -202,12 +206,15 @@ // eslint-disable-next-line max-depth
                 }
-            } else if (filterFn(node.textValue)) {
+            } else {
+                // At this point, the node is either a subdialogtrigger node or a standard row/item
                 let clonedNode = node.clone();
-                if (newCollection.firstKey == null) newCollection.firstKey = clonedNode.key;
-                if (lastNode != null && lastNode.type !== 'section' && lastNode.type !== 'separator' && lastNode.parentKey === clonedNode.parentKey) {
-                    lastNode.nextKey = clonedNode.key;
-                    clonedNode.prevKey = lastNode.key;
-                } else clonedNode.prevKey = null;
-                clonedNode.nextKey = null;
-                newCollection.addNode(clonedNode);
-                lastNode = clonedNode;
+                if ($23b9f4fcf0fe224b$var$shouldKeepNode(clonedNode, filterFn, this, newCollection)) {
+                    if (newCollection.firstKey == null) newCollection.firstKey = clonedNode.key;
+                    if (lastNode != null && lastNode.type !== 'section' && lastNode.type !== 'separator' && lastNode.parentKey === clonedNode.parentKey) {
+                        lastNode.nextKey = clonedNode.key;
+                        clonedNode.prevKey = lastNode.key;
+                    } else clonedNode.prevKey = null;
+                    clonedNode.nextKey = null;
+                    newCollection.addNode(clonedNode);
+                    lastNode = clonedNode;
+                }
             }
@@ -234,2 +241,17 @@ }
 }
+function $23b9f4fcf0fe224b$var$shouldKeepNode(node, filterFn, oldCollection, newCollection) {
+    if (node.type === 'subdialogtrigger' || node.type === 'submenutrigger') {
+        // Subdialog wrapper should only have one child, if it passes the filter add it to the new collection since we don't need to
+        // do any extra handling for its first/next key
+        let triggerChild = [
+            ...oldCollection.getChildren(node.key)
+        ][0];
+        if (triggerChild && filterFn(triggerChild.textValue)) {
+            let clonedChild = triggerChild.clone();
+            newCollection.addNode(clonedChild);
+            return true;
+        } else return false;
+    } else if (node.type === 'header') return true;
+    else return filterFn(node.textValue);
+}
 
@@ -236,0 +258,0 @@

dist/CollectionBuilder.main.js

@@ -6,2 +6,3 @@ var $499e2959ba1abacc$exports = require("./BaseCollection.main.js");
 var $4ftIM$reactdom = require("react-dom");
+var $4ftIM$reactariainteractions = require("@react-aria/interactions");
 var $4ftIM$react = require("react");
@@ -44,2 +45,3 @@ var $4ftIM$reactariassr = require("@react-aria/ssr");
 
+
 const $f20386e2aa690b4a$var$ShallowRenderContext = /*#__PURE__*/ (0, $4ftIM$react.createContext)(false);
@@ -117,3 +119,3 @@ const $f20386e2aa690b4a$var$CollectionDocumentContext = /*#__PURE__*/ (0, $4ftIM$react.createContext)(null);
         return ()=>{
-            // Mark unmounted so we can skip all of the collection updates caused by 
+            // Mark unmounted so we can skip all of the collection updates caused by
             // React calling removeChild on every item in the collection.
@@ -168,2 +170,3 @@ document.isMounted = false;
     let Result = (0, $4ftIM$react.forwardRef)((props, ref)=>{
+        let focusableProps = (0, $4ftIM$react.useContext)((0, $4ftIM$reactariainteractions.FocusableContext));
         let isShallow = (0, $4ftIM$react.useContext)($f20386e2aa690b4a$var$ShallowRenderContext);
@@ -174,5 +177,8 @@ if (!isShallow) {
         }
-        return $f20386e2aa690b4a$var$useSSRCollectionNode(type, props, ref, 'children' in props ? props.children : null, null, (node)=>/*#__PURE__*/ (0, ($parcel$interopDefault($4ftIM$react))).createElement(Component, {
+        return $f20386e2aa690b4a$var$useSSRCollectionNode(type, props, ref, 'children' in props ? props.children : null, null, (node)=>// Forward FocusableContext to real DOM tree so tooltips work.
+            /*#__PURE__*/ (0, ($parcel$interopDefault($4ftIM$react))).createElement((0, $4ftIM$reactariainteractions.FocusableContext).Provider, {
+                value: focusableProps
+            }, /*#__PURE__*/ (0, ($parcel$interopDefault($4ftIM$react))).createElement(Component, {
                 node: node
-            }));
+            })));
     });
@@ -179,0 +185,0 @@ // @ts-ignore

dist/CollectionBuilder.module.js

@@ -6,2 +6,3 @@ import {BaseCollection as $23b9f4fcf0fe224b$export$408d25a4e12db025} from "./BaseCollection.module.js";
 import {createPortal as $95feo$createPortal} from "react-dom";
+import {FocusableContext as $95feo$FocusableContext} from "@react-aria/interactions";
 import $95feo$react, {createContext as $95feo$createContext, useContext as $95feo$useContext, useRef as $95feo$useRef, useCallback as $95feo$useCallback, useState as $95feo$useState, forwardRef as $95feo$forwardRef, useMemo as $95feo$useMemo} from "react";
@@ -31,2 +32,3 @@ import {useIsSSR as $95feo$useIsSSR} from "@react-aria/ssr";
 
+
 const $e1995378a142960e$var$ShallowRenderContext = /*#__PURE__*/ (0, $95feo$createContext)(false);
@@ -104,3 +106,3 @@ const $e1995378a142960e$var$CollectionDocumentContext = /*#__PURE__*/ (0, $95feo$createContext)(null);
         return ()=>{
-            // Mark unmounted so we can skip all of the collection updates caused by 
+            // Mark unmounted so we can skip all of the collection updates caused by
             // React calling removeChild on every item in the collection.
@@ -155,2 +157,3 @@ document.isMounted = false;
     let Result = (0, $95feo$forwardRef)((props, ref)=>{
+        let focusableProps = (0, $95feo$useContext)((0, $95feo$FocusableContext));
         let isShallow = (0, $95feo$useContext)($e1995378a142960e$var$ShallowRenderContext);
@@ -161,5 +164,8 @@ if (!isShallow) {
         }
-        return $e1995378a142960e$var$useSSRCollectionNode(type, props, ref, 'children' in props ? props.children : null, null, (node)=>/*#__PURE__*/ (0, $95feo$react).createElement(Component, {
+        return $e1995378a142960e$var$useSSRCollectionNode(type, props, ref, 'children' in props ? props.children : null, null, (node)=>// Forward FocusableContext to real DOM tree so tooltips work.
+            /*#__PURE__*/ (0, $95feo$react).createElement((0, $95feo$FocusableContext).Provider, {
+                value: focusableProps
+            }, /*#__PURE__*/ (0, $95feo$react).createElement(Component, {
                 node: node
-            }));
+            })));
     });
@@ -166,0 +172,0 @@ // @ts-ignore

dist/Document.main.js

@@ -167,2 +167,12 @@ var $499e2959ba1abacc$exports = require("./BaseCollection.main.js");
         node.lastChildKey = (_this_lastChild_node_key = (_this_lastChild = this.lastChild) === null || _this_lastChild === void 0 ? void 0 : _this_lastChild.node.key) !== null && _this_lastChild_node_key !== void 0 ? _this_lastChild_node_key : null;
+        // Update the colIndex of sibling nodes if this node has a colSpan.
+        if ((node.colSpan != null || node.colIndex != null) && this.nextSibling) {
+            var _node_colIndex, _node_colSpan;
+            // This queues the next sibling for update, which means this happens recursively.
+            let nextColIndex = ((_node_colIndex = node.colIndex) !== null && _node_colIndex !== void 0 ? _node_colIndex : node.index) + ((_node_colSpan = node.colSpan) !== null && _node_colSpan !== void 0 ? _node_colSpan : 1);
+            if (nextColIndex !== this.nextSibling.node.colIndex) {
+                let siblingNode = this.ownerDocument.getMutableNode(this.nextSibling);
+                siblingNode.colIndex = nextColIndex;
+            }
+        }
     }
@@ -182,2 +192,3 @@ setProps(obj, ref, rendered, render) {
         }
+        if (props.colSpan != null) node.colSpan = props.colSpan;
         // If this is the first time props have been set, end the transaction started in the constructor
@@ -271,5 +282,5 @@ // so this node can be emitted.
             for (let element of this.mutatedNodes)if (element.isConnected) collection.addNode(element.node);
+            this.mutatedNodes.clear();
             var _this_firstChild_node_key, _this_lastChild_node_key;
             collection.commit((_this_firstChild_node_key = (_this_firstChild = this.firstChild) === null || _this_firstChild === void 0 ? void 0 : _this_firstChild.node.key) !== null && _this_firstChild_node_key !== void 0 ? _this_firstChild_node_key : null, (_this_lastChild_node_key = (_this_lastChild = this.lastChild) === null || _this_lastChild === void 0 ? void 0 : _this_lastChild.node.key) !== null && _this_lastChild_node_key !== void 0 ? _this_lastChild_node_key : null, this.isSSR);
-            this.mutatedNodes.clear();
         }
@@ -276,0 +287,0 @@ this.collectionMutated = false;

dist/Document.module.js

@@ -161,2 +161,12 @@ import {CollectionNode as $23b9f4fcf0fe224b$export$d68d59712b04d9d1} from "./BaseCollection.module.js";
         node.lastChildKey = (_this_lastChild_node_key = (_this_lastChild = this.lastChild) === null || _this_lastChild === void 0 ? void 0 : _this_lastChild.node.key) !== null && _this_lastChild_node_key !== void 0 ? _this_lastChild_node_key : null;
+        // Update the colIndex of sibling nodes if this node has a colSpan.
+        if ((node.colSpan != null || node.colIndex != null) && this.nextSibling) {
+            var _node_colIndex, _node_colSpan;
+            // This queues the next sibling for update, which means this happens recursively.
+            let nextColIndex = ((_node_colIndex = node.colIndex) !== null && _node_colIndex !== void 0 ? _node_colIndex : node.index) + ((_node_colSpan = node.colSpan) !== null && _node_colSpan !== void 0 ? _node_colSpan : 1);
+            if (nextColIndex !== this.nextSibling.node.colIndex) {
+                let siblingNode = this.ownerDocument.getMutableNode(this.nextSibling);
+                siblingNode.colIndex = nextColIndex;
+            }
+        }
     }
@@ -176,2 +186,3 @@ setProps(obj, ref, rendered, render) {
         }
+        if (props.colSpan != null) node.colSpan = props.colSpan;
         // If this is the first time props have been set, end the transaction started in the constructor
@@ -265,5 +276,5 @@ // so this node can be emitted.
             for (let element of this.mutatedNodes)if (element.isConnected) collection.addNode(element.node);
+            this.mutatedNodes.clear();
             var _this_firstChild_node_key, _this_lastChild_node_key;
             collection.commit((_this_firstChild_node_key = (_this_firstChild = this.firstChild) === null || _this_firstChild === void 0 ? void 0 : _this_firstChild.node.key) !== null && _this_firstChild_node_key !== void 0 ? _this_firstChild_node_key : null, (_this_lastChild_node_key = (_this_lastChild = this.lastChild) === null || _this_lastChild === void 0 ? void 0 : _this_lastChild.node.key) !== null && _this_lastChild_node_key !== void 0 ? _this_lastChild_node_key : null, this.isSSR);
-            this.mutatedNodes.clear();
         }
@@ -270,0 +281,0 @@ this.collectionMutated = false;

dist/Hidden.main.js

@@ -1,4 +0,2 @@
-var $a8uUY$reactdom = require("react-dom");
 var $a8uUY$react = require("react");
-var $a8uUY$reactariassr = require("@react-aria/ssr");
 
@@ -28,4 +26,2 @@
  */ 
-
-
 // React doesn't understand the <template> element, which doesn't have children like a normal element.
@@ -48,7 +44,4 @@ // It will throw an error during hydration when it expects the firstChild to contain content rendered
 const $eaaf60978b89fc58$export$94b6d0abf7d33e8c = /*#__PURE__*/ (0, $a8uUY$react.createContext)(false);
-// Portal to nowhere
-const $eaaf60978b89fc58$var$hiddenFragment = typeof DocumentFragment !== 'undefined' ? new DocumentFragment() : null;
 function $eaaf60978b89fc58$export$8dc98ba7eadeaa56(props) {
     let isHidden = (0, $a8uUY$react.useContext)($eaaf60978b89fc58$export$94b6d0abf7d33e8c);
-    let isSSR = (0, $a8uUY$reactariassr.useIsSSR)();
     if (isHidden) // Don't hide again if we are already hidden.
@@ -59,8 +52,8 @@ return /*#__PURE__*/ (0, ($parcel$interopDefault($a8uUY$react))).createElement((0, ($parcel$interopDefault($a8uUY$react))).Fragment, null, props.children);
     }, props.children);
-    // In SSR, portals are not supported by React. Instead, render into a <template>
+    // In SSR, portals are not supported by React. Instead, always render into a <template>
     // element, which the browser will never display to the user. In addition, the
-    // content is not part of the DOM tree, so it won't affect ids or other accessibility attributes.
-    return isSSR ? /*#__PURE__*/ (0, ($parcel$interopDefault($a8uUY$react))).createElement("template", {
+    // content is not part of the accessible DOM tree, so it won't affect ids or other accessibility attributes.
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($a8uUY$react))).createElement("template", {
         "data-react-aria-hidden": true
-    }, children) : /*#__PURE__*/ (0, $a8uUY$reactdom.createPortal)(children, $eaaf60978b89fc58$var$hiddenFragment);
+    }, children);
 }
@@ -67,0 +60,0 @@ function $eaaf60978b89fc58$export$86427a43e3e48ebb(fn) {

dist/Hidden.module.js

@@ -1,4 +0,2 @@
-import {createPortal as $8SdCi$createPortal} from "react-dom";
 import $8SdCi$react, {createContext as $8SdCi$createContext, useContext as $8SdCi$useContext, forwardRef as $8SdCi$forwardRef} from "react";
-import {useIsSSR as $8SdCi$useIsSSR} from "@react-aria/ssr";
 
@@ -16,4 +14,2 @@ /*
  */ 
-
-
 // React doesn't understand the <template> element, which doesn't have children like a normal element.
@@ -36,7 +32,4 @@ // It will throw an error during hydration when it expects the firstChild to contain content rendered
 const $f39a9eba43920ace$export$94b6d0abf7d33e8c = /*#__PURE__*/ (0, $8SdCi$createContext)(false);
-// Portal to nowhere
-const $f39a9eba43920ace$var$hiddenFragment = typeof DocumentFragment !== 'undefined' ? new DocumentFragment() : null;
 function $f39a9eba43920ace$export$8dc98ba7eadeaa56(props) {
     let isHidden = (0, $8SdCi$useContext)($f39a9eba43920ace$export$94b6d0abf7d33e8c);
-    let isSSR = (0, $8SdCi$useIsSSR)();
     if (isHidden) // Don't hide again if we are already hidden.
@@ -47,8 +40,8 @@ return /*#__PURE__*/ (0, $8SdCi$react).createElement((0, $8SdCi$react).Fragment, null, props.children);
     }, props.children);
-    // In SSR, portals are not supported by React. Instead, render into a <template>
+    // In SSR, portals are not supported by React. Instead, always render into a <template>
     // element, which the browser will never display to the user. In addition, the
-    // content is not part of the DOM tree, so it won't affect ids or other accessibility attributes.
-    return isSSR ? /*#__PURE__*/ (0, $8SdCi$react).createElement("template", {
+    // content is not part of the accessible DOM tree, so it won't affect ids or other accessibility attributes.
+    return /*#__PURE__*/ (0, $8SdCi$react).createElement("template", {
         "data-react-aria-hidden": true
-    }, children) : /*#__PURE__*/ (0, $8SdCi$createPortal)(children, $f39a9eba43920ace$var$hiddenFragment);
+    }, children);
 }
@@ -55,0 +48,0 @@ function $f39a9eba43920ace$export$86427a43e3e48ebb(fn) {

dist/types.d.ts

@@ -21,2 +21,4 @@ import { Collection as _Collection1, Key, Node } from "@react-types/shared";
     readonly render?: (node: Node<any>) => ReactElement;
+    readonly colSpan: number | null;
+    readonly colIndex: number | null;
     constructor(type: string, key: Key);
@@ -54,3 +56,3 @@ get childNodes(): Iterable<Node<T>>;
     /** Values that should invalidate the item cache when using dynamic collections. */
-    dependencies?: any[];
+    dependencies?: ReadonlyArray<any>;
     /** A scope to prepend to all child item ids to ensure they are unique. */
@@ -57,0 +59,0 @@ idScope?: Key;

package.json

 {
   "name": "@react-aria/collections",
-  "version": "3.0.0-nightly-50c7ada5d-241223",
+  "version": "3.0.0-nightly-5334df7f1-250226",
   "description": "Spectrum UI components in React",
@@ -25,7 +25,8 @@ "license": "Apache-2.0",
   "dependencies": {
-    "@react-aria/ssr": "3.0.0-nightly-50c7ada5d-241223",
-    "@react-aria/utils": "3.0.0-nightly-50c7ada5d-241223",
-    "@react-types/shared": "3.0.0-nightly-50c7ada5d-241223",
+    "@react-aria/interactions": "3.0.0-nightly-5334df7f1-250226",
+    "@react-aria/ssr": "3.0.0-nightly-5334df7f1-250226",
+    "@react-aria/utils": "3.0.0-nightly-5334df7f1-250226",
+    "@react-types/shared": "3.0.0-nightly-5334df7f1-250226",
     "@swc/helpers": "^0.5.0",
-    "use-sync-external-store": "^1.2.0"
+    "use-sync-external-store": "^1.4.0"
   },
@@ -32,0 +33,0 @@ "peerDependencies": {

src/BaseCollection.ts

@@ -38,2 +38,4 @@ /*
   readonly render?: (node: Node<any>) => ReactElement;
+  readonly colSpan: number | null = null;
+  readonly colIndex: number | null = null;
 
@@ -65,2 +67,4 @@ constructor(type: string, key: Key) {
     node.render = this.render;
+    node.colSpan = this.colSpan;
+    node.colIndex = this.colIndex;
     return node;
@@ -229,3 +233,3 @@ }
         for (let child of this.getChildren(node.key)) {
-          if (filterFn(child.textValue) || child.type === 'header') {
+          if (shouldKeepNode(child, filterFn, this, newCollection)) {
             let clonedChild: Mutable<CollectionNode<T>> = (child as CollectionNode<T>).clone();
@@ -290,18 +294,21 @@ // eslint-disable-next-line max-depth
         }
-      } else if (filterFn(node.textValue)) {
+      } else {
+        // At this point, the node is either a subdialogtrigger node or a standard row/item
         let clonedNode: Mutable<CollectionNode<T>> = (node as CollectionNode<T>).clone();
-        if (newCollection.firstKey == null) {
-          newCollection.firstKey = clonedNode.key;
-        }
+        if (shouldKeepNode(clonedNode, filterFn, this, newCollection)) {
+          if (newCollection.firstKey == null) {
+            newCollection.firstKey = clonedNode.key;
+          }
 
-        if (lastNode != null && (lastNode.type !== 'section' && lastNode.type !== 'separator') && lastNode.parentKey === clonedNode.parentKey) {
-          lastNode.nextKey = clonedNode.key;
-          clonedNode.prevKey = lastNode.key;
-        } else {
-          clonedNode.prevKey = null;
+          if (lastNode != null && (lastNode.type !== 'section' && lastNode.type !== 'separator') && lastNode.parentKey === clonedNode.parentKey) {
+            lastNode.nextKey = clonedNode.key;
+            clonedNode.prevKey = lastNode.key;
+          } else {
+            clonedNode.prevKey = null;
+          }
+
+          clonedNode.nextKey = null;
+          newCollection.addNode(clonedNode);
+          lastNode = clonedNode;
         }
-
-        clonedNode.nextKey = null;
-        newCollection.addNode(clonedNode);
-        lastNode = clonedNode;
       }
@@ -325,1 +332,20 @@ }
 }
+
+function shouldKeepNode<T>(node: Node<T>, filterFn: (nodeValue: string) => boolean, oldCollection: BaseCollection<T>, newCollection: BaseCollection<T>): boolean {
+  if (node.type === 'subdialogtrigger' || node.type === 'submenutrigger') {
+    // Subdialog wrapper should only have one child, if it passes the filter add it to the new collection since we don't need to
+    // do any extra handling for its first/next key
+    let triggerChild = [...oldCollection.getChildren(node.key)][0];
+    if (triggerChild && filterFn(triggerChild.textValue)) {
+      let clonedChild: Mutable<CollectionNode<T>> = (triggerChild as CollectionNode<T>).clone();
+      newCollection.addNode(clonedChild);
+      return true;
+    } else {
+      return false;
+    }
+  } else if (node.type === 'header') {
+    return true;
+  } else {
+    return filterFn(node.textValue);
+  }
+}

src/Document.ts

@@ -263,2 +263,12 @@ /*
     node.lastChildKey = this.lastChild?.node.key ?? null;
+
+    // Update the colIndex of sibling nodes if this node has a colSpan.
+    if ((node.colSpan != null || node.colIndex != null) && this.nextSibling) {
+      // This queues the next sibling for update, which means this happens recursively.
+      let nextColIndex = (node.colIndex ?? node.index) + (node.colSpan ?? 1);
+      if (nextColIndex !== this.nextSibling.node.colIndex) {
+        let siblingNode = this.ownerDocument.getMutableNode(this.nextSibling);
+        siblingNode.colIndex = nextColIndex;
+      }
+    }
   }
@@ -282,2 +292,6 @@
 
+    if (props.colSpan != null) {
+      node.colSpan = props.colSpan;
+    }
+
     // If this is the first time props have been set, end the transaction started in the constructor
@@ -423,4 +437,4 @@ // so this node can be emitted.
 
+      this.mutatedNodes.clear();
       collection.commit(this.firstChild?.node.key ?? null, this.lastChild?.node.key ?? null, this.isSSR);
-      this.mutatedNodes.clear();
     }
@@ -427,0 +441,0 @@

src/useCachedChildren.ts

@@ -22,3 +22,3 @@ /*
   /** Values that should invalidate the item cache when using dynamic collections. */
-  dependencies?: any[],
+  dependencies?: ReadonlyArray<any>,
   /** A scope to prepend to all child item ids to ensure they are unique. */
@@ -25,0 +25,0 @@ idScope?: Key,

No alert changes

Improved metrics

Total package byte prevSize

334528

increased by4.32%

Lines of code

3924

increased by3.84%

Worsened metrics

Dependency count

8

increased by14.29%

Dependency changes

• + Added@react-aria/interactions@3.0.0-nightly-5334df7f1-250226

• + Added@react-aria/interactions@3.0.0-nightly-5334df7f1-250226(transitive)

• + Added@react-aria/ssr@3.0.0-nightly-5334df7f1-250226(transitive)

• + Added@react-aria/utils@3.0.0-nightly-5334df7f1-250226(transitive)

• + Added@react-stately/flags@3.0.0-nightly-5334df7f1-250226(transitive)

• + Added@react-stately/utils@3.0.0-nightly-5334df7f1-250226(transitive)

• + Added@react-types/shared@3.0.0-nightly-5334df7f1-250226(transitive)

• - Removed@react-aria/ssr@3.0.0-nightly-50c7ada5d-241223(transitive)

• - Removed@react-aria/utils@3.0.0-nightly-50c7ada5d-241223(transitive)

• - Removed@react-stately/utils@3.0.0-nightly-50c7ada5d-241223(transitive)

• - Removed@react-types/shared@3.0.0-nightly-50c7ada5d-241223(transitive)

• Updated@react-aria/ssr@3.0.0-nightly-5334df7f1-250226

• Updated@react-aria/utils@3.0.0-nightly-5334df7f1-250226

• Updated@react-types/shared@3.0.0-nightly-5334df7f1-250226

• Updateduse-sync-external-store@^1.4.0