react-aria-components 1.17.0 → 1.19.0

package/dist/private/Table.cjs

@@ -8,7 +8,6 @@ var $5724b511a2687756$exports = require("./intlStrings.cjs");
 var $61557b2a9b2862a8$exports = require("./SelectionIndicator.cjs");
 var $9a60bd90621ebc78$exports = require("./SharedElementTransition.cjs");
 var $56f56e0916461149$exports = require("./TreeDropTargetDelegate.cjs");
-var $4d5fb986d6106af2$exports = require("./TableLayout.cjs");
 var $ke19Y$reactariaprivatecollectionsBaseCollection = require("react-aria/private/collections/BaseCollection");
 var $ke19Y$reactstatelyprivatetableTableCollection = require("react-stately/private/table/TableCollection");
 var $ke19Y$reactariaCollection = require("react-aria/Collection");
@@ -56,6 +55,7 @@ $parcel$export(module.exports, "TableHeader", function () { return $af9b3e5459f1
 $parcel$export(module.exports, "Column", function () { return $af9b3e5459f1bf61$export$816b5d811295e6bc; });
 $parcel$export(module.exports, "ColumnResizer", function () { return $af9b3e5459f1bf61$export$ee689e97a7664bfd; });
 $parcel$export(module.exports, "TableBody", function () { return $af9b3e5459f1bf61$export$76ccd210b9029917; });
+$parcel$export(module.exports, "TableFooter", function () { return $af9b3e5459f1bf61$export$1f116082bba1f9a8; });
 $parcel$export(module.exports, "Row", function () { return $af9b3e5459f1bf61$export$b59bdbef9ce70de2; });
 $parcel$export(module.exports, "Cell", function () { return $af9b3e5459f1bf61$export$f6f0c3fe4ec306ea; });
 $parcel$export(module.exports, "TableLoadMoreItem", function () { return $af9b3e5459f1bf61$export$8f5bea0338ed243c; });
@@ -94,7 +94,6 @@ $parcel$export(module.exports, "TableLoadMoreItem", function () { return $af9b3e
 
 
 
-
 
 
 class $af9b3e5459f1bf61$var$TableCollection extends (0, $ke19Y$reactariaprivatecollectionsBaseCollection.BaseCollection) {
@@ -102,23 +101,36 @@ class $af9b3e5459f1bf61$var$TableCollection extends (0, $ke19Y$reactariaprivatec
         let collection = this.clone();
         collection.expandedKeys = expandedKeys;
         collection.frozen = this.frozen;
-        collection.rows = Array.from(collection.getChildren(collection.body.key));
+        collection.rows = Array.from(collection.getRows());
         return collection;
     }
     addNode(node) {
         super.addNode(node);
         this.columnsDirty ||= node.type === 'column';
         if (node.type === 'tableheader') this.head = node;
-        if (node.type === 'tablebody') this.body = node;
+    }
+    getRows() {
+        let rows = [];
+        for (let child of this)if (child.type === 'tablebody' || child.type === 'tablefooter') rows.push(...this.getChildren(child.key));
+        return rows;
+    }
+    // backward compatibility
+    get body() {
+        for (let child of this){
+            if (child.type === 'tablebody') return child;
+        }
+        return new $af9b3e5459f1bf61$var$TableBodyNode(-2);
     }
     commit(firstKey, lastKey, isSSR = false) {
         this.updateColumns(isSSR);
+        this.firstKey = firstKey;
+        this.lastKey = lastKey;
         this.rows = [];
-        for (let row of this.getChildren(this.body.key)){
+        for (let row of this.getRows()){
             let lastChildKey = row.lastChildKey;
             if (lastChildKey != null) {
                 let lastCell = this.getItem(lastChildKey);
-                while(lastCell && lastCell.type !== 'cell')lastCell = lastCell.prevKey ? this.getItem(lastCell.prevKey) : null;
+                while(lastCell && lastCell.type !== 'cell')lastCell = lastCell.prevKey != null ? this.getItem(lastCell.prevKey) : null;
                 if (lastCell) {
                     let numberOfCellsInRow = (lastCell.colIndex ?? lastCell.index) + (lastCell.colSpan ?? 1);
                     if (numberOfCellsInRow !== this.columns.length && !isSSR) throw new Error(`Cell count must match column count. Found ${numberOfCellsInRow} cells and ${this.columns.length} columns.`);
@@ -155,16 +167,21 @@ class $af9b3e5459f1bf61$var$TableCollection extends (0, $ke19Y$reactariaprivatec
         return this.columns.length;
     }
     *[Symbol.iterator]() {
-        // Wait until the collection is initialized.
-        if (this.head.key === -1) return;
-        yield this.head;
-        yield this.body;
+        let key = this.firstKey;
+        while(key != null){
+            let node = this.getItem(key);
+            if (node) yield node;
+            key = node?.nextKey ?? null;
+        }
     }
     getFirstKey() {
-        return this.body.firstChildKey;
+        for (let child of this){
+            if (child.type === 'tablebody') return child.firstChildKey ?? null;
+        }
+        return null;
     }
     getLastKey() {
-        let key = this.body.lastChildKey;
+        let key = this.lastKey;
         if (key == null) return null;
         let node = this.getItem(key);
         while(node?.lastChildKey != null && (node.type !== 'item' || this.expandedKeys.has(node.key)))node = this.getItem(node.lastChildKey);
@@ -196,23 +213,25 @@ class $af9b3e5459f1bf61$var$TableCollection extends (0, $ke19Y$reactariaprivatec
             k = node?.key ?? null;
         }
         if (k == null) k = node.parentKey;
-        if (k != null && this.getItem(k)?.type === 'tablebody') return null;
+        if (k != null && this.getItem(k)?.type === 'tableheader') return null;
         return k;
     }
     getChildren(key) {
-        if (!this.getItem(key)) for (let row of this.headerRows){
+        let item = this.getItem(key);
+        if (!item) for (let row of this.headerRows){
             if (row.key === key) return row.childNodes;
         }
         // Flatten all rows into the body.
         let self = this;
-        if (key === this.body.key) return {
+        if (item?.type === 'tablebody' || item?.type === 'tablefooter') return {
             *[Symbol.iterator] () {
-                let firstKey = self.getFirstKey();
+                let firstKey = item.firstChildKey;
                 let node = firstKey != null ? self.getItem(firstKey) : null;
                 while(node){
                     yield node;
                     let key = self.getKeyAfter(node.key);
-                    node = key ? self.getItem(key) : null;
+                    node = key != null ? self.getItem(key) : null;
+                    if (node && node.parentKey === item.parentKey) break;
                 }
             }
         };
@@ -236,7 +255,6 @@ class $af9b3e5459f1bf61$var$TableCollection extends (0, $ke19Y$reactariaprivatec
         collection.rows = this.rows;
         collection.rowHeaderColumnKeys = this.rowHeaderColumnKeys;
         collection.head = this.head;
-        collection.body = this.body;
         return collection;
     }
     getTextValue(key) {
@@ -255,7 +273,7 @@ class $af9b3e5459f1bf61$var$TableCollection extends (0, $ke19Y$reactariaprivatec
         return text.join(' ');
     }
     constructor(...args){
-        super(...args), this.headerRows = [], this.columns = [], this.rows = [], this.rowHeaderColumnKeys = new Set(), this.head = new $af9b3e5459f1bf61$var$TableHeaderNode(-1), this.body = new $af9b3e5459f1bf61$var$TableBodyNode(-2), this.columnsDirty = true, this.expandedKeys = new Set();
+        super(...args), this.headerRows = [], this.columns = [], this.rows = [], this.rowHeaderColumnKeys = new Set(), this.head = new $af9b3e5459f1bf61$var$TableHeaderNode(-1), this.columnsDirty = true, this.expandedKeys = new Set();
     }
 }
 const $af9b3e5459f1bf61$var$ResizableTableContainerContext = /*#__PURE__*/ (0, $ke19Y$react.createContext)(null);
@@ -359,11 +377,11 @@ let $af9b3e5459f1bf61$var$TableElementType = /*#__PURE__*/ (0, $ke19Y$react.forw
     });
 });
 const $af9b3e5459f1bf61$var$EXPANSION_KEYS = {
-    'expand': {
+    expand: {
         ltr: 'ArrowRight',
         rtl: 'ArrowLeft'
     },
-    'collapse': {
+    collapse: {
         ltr: 'ArrowLeft',
         rtl: 'ArrowRight'
     }
@@ -642,6 +660,14 @@ function $af9b3e5459f1bf61$var$TableHeaderRow({ item: item }) {
                         selection: checkboxProps
                     }
                 }
+            ],
+            [
+                (0, $365d89633c2041bc$exports.CheckboxFieldContext),
+                {
+                    slots: {
+                        selection: checkboxProps
+                    }
+                }
             ]
         ]
     }, /*#__PURE__*/ (0, ($parcel$interopDefault($ke19Y$react))).createElement(CollectionBranch, {
@@ -844,7 +870,7 @@ let $af9b3e5459f1bf61$var$TableBodyElementType = /*#__PURE__*/ (0, $ke19Y$react.
         ref: ref
     });
 });
-const $af9b3e5459f1bf61$export$76ccd210b9029917 = /*#__PURE__*/ (0, $ke19Y$reactariaCollectionBuilder.createBranchComponent)($af9b3e5459f1bf61$var$TableBodyNode, (props, ref)=>{
+const $af9b3e5459f1bf61$export$76ccd210b9029917 = /*#__PURE__*/ (0, $ke19Y$reactariaCollectionBuilder.createBranchComponent)($af9b3e5459f1bf61$var$TableBodyNode, (props, ref, node)=>{
     let state = (0, $ke19Y$react.useContext)($af9b3e5459f1bf61$export$38de1cb0526c21fb);
     let { isVirtualized: isVirtualized } = (0, $ke19Y$react.useContext)((0, $f7b82bedbb70abac$exports.CollectionRendererContext));
     let collection = state.collection;
@@ -900,10 +926,53 @@ const $af9b3e5459f1bf61$export$76ccd210b9029917 = /*#__PURE__*/ (0, $ke19Y$react
         "data-empty": isEmpty || undefined
     }, isDroppable && /*#__PURE__*/ (0, ($parcel$interopDefault($ke19Y$react))).createElement($af9b3e5459f1bf61$var$RootDropIndicator, null), /*#__PURE__*/ (0, ($parcel$interopDefault($ke19Y$react))).createElement(CollectionBranch, {
         collection: collection,
-        parent: collection.body,
+        parent: node,
         renderDropIndicator: (0, $d3d8871226fc64f2$exports.useRenderDropIndicator)(dragAndDropHooks, dropState)
     }), emptyState);
 });
+class $af9b3e5459f1bf61$var$TableFooterNode extends (0, $ke19Y$reactariaprivatecollectionsBaseCollection.FilterableNode) {
+    static{
+        this.type = 'tablefooter';
+    }
+}
+let $af9b3e5459f1bf61$var$TableFooterElementType = /*#__PURE__*/ (0, $ke19Y$react.forwardRef)(function TableFooterElementType(props, ref) {
+    let { isVirtualized: isVirtualized } = (0, $ke19Y$react.useContext)((0, $f7b82bedbb70abac$exports.CollectionRendererContext));
+    if (isVirtualized) return /*#__PURE__*/ (0, ($parcel$interopDefault($ke19Y$react))).createElement((0, $048d76b84370f141$exports.dom).div, {
+        ...props,
+        ref: ref
+    });
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($ke19Y$react))).createElement((0, $048d76b84370f141$exports.dom).tfoot, {
+        ...props,
+        ref: ref
+    });
+});
+const $af9b3e5459f1bf61$export$1f116082bba1f9a8 = /*#__PURE__*/ (0, $ke19Y$reactariaCollectionBuilder.createBranchComponent)($af9b3e5459f1bf61$var$TableFooterNode, (props, ref, node)=>{
+    let state = (0, $ke19Y$react.useContext)($af9b3e5459f1bf61$export$38de1cb0526c21fb);
+    let collection = state.collection;
+    let { CollectionBranch: CollectionBranch } = (0, $ke19Y$react.useContext)((0, $f7b82bedbb70abac$exports.CollectionRendererContext));
+    let { dragAndDropHooks: dragAndDropHooks, dropState: dropState } = (0, $ke19Y$react.useContext)((0, $d3d8871226fc64f2$exports.DragAndDropContext));
+    let { rowGroupProps: rowGroupProps } = (0, $ke19Y$reactariauseTable.useTableRowGroup)();
+    let DOMProps = (0, $ke19Y$reactariafilterDOMProps.filterDOMProps)(props, {
+        global: true
+    });
+    let renderProps = (0, $048d76b84370f141$exports.useRenderProps)({
+        style: props.style,
+        className: props.className,
+        defaultClassName: 'react-aria-TableFooter',
+        values: {}
+    });
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($ke19Y$react))).createElement($af9b3e5459f1bf61$var$TableFooterElementType, {
+        ...(0, $ke19Y$reactariamergeProps.mergeProps)(DOMProps, renderProps, rowGroupProps),
+        ref: ref
+    }, /*#__PURE__*/ (0, ($parcel$interopDefault($ke19Y$react))).createElement(CollectionBranch, {
+        collection: collection,
+        parent: node,
+        renderDropIndicator: (0, $d3d8871226fc64f2$exports.useRenderDropIndicator)(dragAndDropHooks, dropState)
+    }));
+});
+const $af9b3e5459f1bf61$export$1a75e308b53225a6 = /*#__PURE__*/ (0, $ke19Y$react.createContext)({
+    isFocusVisibleWithinRow: false
+});
 class $af9b3e5459f1bf61$var$TableRowNode extends (0, $ke19Y$reactariaprivatecollectionsBaseCollection.CollectionNode) {
     static{
         this.type = 'item';
@@ -934,6 +1003,7 @@ const $af9b3e5459f1bf61$export$b59bdbef9ce70de2 = /*#__PURE__*/ (0, $ke19Y$react
     let state = (0, $ke19Y$react.useContext)($af9b3e5459f1bf61$export$38de1cb0526c21fb);
     let { dragAndDropHooks: dragAndDropHooks, dragState: dragState, dropState: dropState } = (0, $ke19Y$react.useContext)((0, $d3d8871226fc64f2$exports.DragAndDropContext));
     let { isVirtualized: isVirtualized, CollectionBranch: CollectionBranch } = (0, $ke19Y$react.useContext)((0, $f7b82bedbb70abac$exports.CollectionRendererContext));
+    let isDraggable = dragState && !(dragState.isDisabled || dragState.selectionManager.isDisabled(item.key));
     let { rowProps: rowProps, expandButtonProps: expandButtonProps, ...states } = (0, $ke19Y$reactariauseTable.useTableRow)({
         node: item,
         shouldSelectOnPressUp: !!dragState,
@@ -944,7 +1014,9 @@ const $af9b3e5459f1bf61$export$b59bdbef9ce70de2 = /*#__PURE__*/ (0, $ke19Y$react
         within: true
     });
     let { hoverProps: hoverProps, isHovered: isHovered } = (0, $ke19Y$reactariauseHover.useHover)({
-        isDisabled: !states.allowsSelection && !states.hasAction,
+        // because of https://bugs.webkit.org/show_bug.cgi?id=214609, supporting hover styles when a item is ONLY isDraggable
+        // results in hover styles sticking around after a reorder/drop operation...
+        isDisabled: !states.allowsSelection && !states.hasAction && !isDraggable,
         onHoverStart: props.onHoverStart,
         onHoverChange: props.onHoverChange,
         onHoverEnd: props.onHoverEnd
@@ -987,6 +1059,7 @@ const $af9b3e5459f1bf61$export$b59bdbef9ce70de2 = /*#__PURE__*/ (0, $ke19Y$react
         },
         values: {
             ...states,
+            state: state,
             isHovered: isHovered,
             isFocused: isFocused,
             isFocusVisible: isFocusVisible,
@@ -1049,6 +1122,15 @@ const $af9b3e5459f1bf61$export$b59bdbef9ce70de2 = /*#__PURE__*/ (0, $ke19Y$react
                     }
                 }
             ],
+            [
+                (0, $365d89633c2041bc$exports.CheckboxFieldContext),
+                {
+                    slots: {
+                        [(0, $048d76b84370f141$exports.DEFAULT_SLOT)]: {},
+                        selection: checkboxProps
+                    }
+                }
+            ],
             [
                 (0, $16c7f9b22cce3838$exports.ButtonContext),
                 {
@@ -1070,6 +1152,12 @@ const $af9b3e5459f1bf61$export$b59bdbef9ce70de2 = /*#__PURE__*/ (0, $ke19Y$react
                 {
                     isSelected: states.isSelected
                 }
+            ],
+            [
+                $af9b3e5459f1bf61$export$1a75e308b53225a6,
+                {
+                    isFocusVisibleWithinRow: isFocusVisibleWithin
+                }
             ]
         ]
     }, /*#__PURE__*/ (0, ($parcel$interopDefault($ke19Y$react))).createElement(CollectionBranch, {
@@ -1116,6 +1204,7 @@ const $af9b3e5459f1bf61$export$f6f0c3fe4ec306ea = /*#__PURE__*/ (0, $ke19Y$react
     }, state, ref);
     let { isFocused: isFocused, isFocusVisible: isFocusVisible, focusProps: focusProps } = (0, $ke19Y$reactariauseFocusRing.useFocusRing)();
     let { hoverProps: hoverProps, isHovered: isHovered } = (0, $ke19Y$reactariauseHover.useHover)({});
+    let { isFocusVisibleWithinRow: isFocusVisibleWithinRow } = (0, $ke19Y$react.useContext)($af9b3e5459f1bf61$export$1a75e308b53225a6);
     let isSelected = cell.parentKey != null ? state.selectionManager.isSelected(cell.parentKey) : false;
     // colIndex is null, when there is so span, falling back to using the index
     let columnIndex = cell.colIndex || cell.index;
@@ -1130,6 +1219,7 @@ const $af9b3e5459f1bf61$export$f6f0c3fe4ec306ea = /*#__PURE__*/ (0, $ke19Y$react
         values: {
             isFocused: isFocused,
             isFocusVisible: isFocusVisible,
+            isFocusVisibleWithinRow: isFocusVisibleWithinRow,
             isPressed: isPressed,
             isHovered: isHovered,
             isSelected: isSelected,
@@ -1151,6 +1241,7 @@ const $af9b3e5459f1bf61$export$f6f0c3fe4ec306ea = /*#__PURE__*/ (0, $ke19Y$react
         ref: ref,
         "data-focused": isFocused || undefined,
         "data-focus-visible": isFocusVisible || undefined,
+        "data-focus-visible-within-row": isFocusVisibleWithinRow || undefined,
         "data-pressed": isPressed || undefined,
         "data-selected": isSelected || undefined,
         "data-column-index": columnIndex,