@react-aria/table - npm Package Compare versions

Comparing version 3.0.0-nightly.2426 to 3.0.0-nightly.2430

dist/main.js

@@ -152,3 +152,3 @@ var {
 
-      let firstItem = this.collection.getItem(this.collection.getFirstKey());
+      let firstItem = this.collection.getItem(this.getFirstKey());
       return [...firstItem.childNodes][startItem.index].key;
@@ -160,6 +160,6 @@ } // If focus was on a cell, start searching from the parent row
       key = startItem.parentKey;
-    } // Find the next enabled item
+    } // Find the next item
 
 
-    key = this.findNextKey(item => item.type === 'item' && !this.disabledKeys.has(item.key), key);
+    key = this.findNextKey(item => item.type === 'item', key);
 
@@ -199,6 +199,6 @@ if (key != null) {
       key = startItem.parentKey;
-    } // Find the previous enabled item
+    } // Find the previous item
 
 
-    key = this.findPreviousKey(item => item.type === 'item' && !this.disabledKeys.has(item.key), key);
+    key = this.findPreviousKey(item => item.type === 'item', key);
 
@@ -347,6 +347,6 @@ if (key != null) {
       }
-    } // Find the first enabled row
+    } // Find the first row
 
 
-    key = this.findNextKey(item => item.type === 'item' && !this.disabledKeys.has(item.key)); // If global flag is set, focus the first cell in the first row.
+    key = this.findNextKey(item => item.type === 'item'); // If global flag is set, focus the first cell in the first row.
 
@@ -379,6 +379,6 @@ if (key != null && item && this.isCell(item) && global) {
       }
-    } // Find the last enabled row
+    } // Find the last row
 
 
-    key = this.findPreviousKey(item => item.type === 'item' && !this.disabledKeys.has(item.key)); // If global flag is set, focus the last cell in the last row.
+    key = this.findPreviousKey(item => item.type === 'item'); // If global flag is set, focus the last cell in the last row.
 
@@ -460,7 +460,12 @@ if (key != null && item && this.isCell(item) && global) {
     let pageHeight = this.getPageHeight();
-    let pageY = Math.min(this.getContentHeight() - pageHeight, itemRect.y + pageHeight);
+    let pageY = Math.min(this.getContentHeight(), itemRect.y + pageHeight);
 
     while (itemRect && itemRect.maxY < pageY) {
-      key = this.getKeyBelow(key);
-      itemRect = this.getItemRect(key);
+      let nextKey = this.getKeyBelow(key);
+      itemRect = this.getItemRect(nextKey); // Guard against case where maxY of the last key is barely less than pageY due to rounding
+      // and thus it attempts to set key to null
+
+      if (nextKey != null) {
+        key = nextKey;
+      }
     }
@@ -580,3 +585,4 @@
     ref,
-    isVirtualized
+    isVirtualized,
+    isDisabled
   } = props; // Handles focusing the cell. If there is a focusable child,
@@ -608,3 +614,5 @@ // it is focused, otherwise the cell itself is focused.
     pressProps
-  } = usePress(itemProps); // Grid cells can have focusable elements inside them. In this case, focus should
+  } = usePress(_babelRuntimeHelpersExtends({}, itemProps, {
+    isDisabled
+  })); // Grid cells can have focusable elements inside them. In this case, focus should
   // be marshalled to that element rather than focusing the cell itself.
@@ -656,3 +664,4 @@
     colspan,
-    ref
+    ref,
+    isDisabled
   } = props;
@@ -665,3 +674,3 @@ let {
   } = usePress({
-    isDisabled: !node.props.allowsSorting,
+    isDisabled: !node.props.allowsSorting || isDisabled,
 
@@ -712,3 +721,4 @@ onPress() {
     isVirtualized,
-    isSelected
+    isSelected,
+    isDisabled
   } = props;
@@ -725,3 +735,5 @@ let {
     pressProps
-  } = usePress(itemProps);
+  } = usePress(_babelRuntimeHelpersExtends({}, itemProps, {
+    isDisabled
+  }));
 
@@ -762,6 +774,11 @@ let rowProps = _babelRuntimeHelpersExtends({
   let {
-    key
+    key,
+    isDisabled
   } = props;
+  let manager = state.selectionManager;
   let checkboxId = useId();
-  let isSelected = state.selectionManager.isSelected(key);
+  let isSelected = state.selectionManager.isSelected(key) && !isDisabled;
+
+  let onChange = () => manager.select(key);
+
   return {
@@ -773,3 +790,3 @@ checkboxProps: {
       isSelected,
-      onChange: () => state.selectionManager.toggleSelection(key)
+      onChange
     }
@@ -776,0 +793,0 @@ };

dist/module.js

@@ -120,3 +120,3 @@ import { usePress, isFocusVisible } from "@react-aria/interactions";
 
-      let firstItem = this.collection.getItem(this.collection.getFirstKey());
+      let firstItem = this.collection.getItem(this.getFirstKey());
       return [...firstItem.childNodes][startItem.index].key;
@@ -128,6 +128,6 @@ } // If focus was on a cell, start searching from the parent row
       key = startItem.parentKey;
-    } // Find the next enabled item
+    } // Find the next item
 
 
-    key = this.findNextKey(item => item.type === 'item' && !this.disabledKeys.has(item.key), key);
+    key = this.findNextKey(item => item.type === 'item', key);
 
@@ -167,6 +167,6 @@ if (key != null) {
       key = startItem.parentKey;
-    } // Find the previous enabled item
+    } // Find the previous item
 
 
-    key = this.findPreviousKey(item => item.type === 'item' && !this.disabledKeys.has(item.key), key);
+    key = this.findPreviousKey(item => item.type === 'item', key);
 
@@ -315,6 +315,6 @@ if (key != null) {
       }
-    } // Find the first enabled row
+    } // Find the first row
 
 
-    key = this.findNextKey(item => item.type === 'item' && !this.disabledKeys.has(item.key)); // If global flag is set, focus the first cell in the first row.
+    key = this.findNextKey(item => item.type === 'item'); // If global flag is set, focus the first cell in the first row.
 
@@ -347,6 +347,6 @@ if (key != null && item && this.isCell(item) && global) {
       }
-    } // Find the last enabled row
+    } // Find the last row
 
 
-    key = this.findPreviousKey(item => item.type === 'item' && !this.disabledKeys.has(item.key)); // If global flag is set, focus the last cell in the last row.
+    key = this.findPreviousKey(item => item.type === 'item'); // If global flag is set, focus the last cell in the last row.
 
@@ -428,7 +428,12 @@ if (key != null && item && this.isCell(item) && global) {
     let pageHeight = this.getPageHeight();
-    let pageY = Math.min(this.getContentHeight() - pageHeight, itemRect.y + pageHeight);
+    let pageY = Math.min(this.getContentHeight(), itemRect.y + pageHeight);
 
     while (itemRect && itemRect.maxY < pageY) {
-      key = this.getKeyBelow(key);
-      itemRect = this.getItemRect(key);
+      let nextKey = this.getKeyBelow(key);
+      itemRect = this.getItemRect(nextKey); // Guard against case where maxY of the last key is barely less than pageY due to rounding
+      // and thus it attempts to set key to null
+
+      if (nextKey != null) {
+        key = nextKey;
+      }
     }
@@ -545,3 +550,4 @@
     ref,
-    isVirtualized
+    isVirtualized,
+    isDisabled
   } = props; // Handles focusing the cell. If there is a focusable child,
@@ -573,3 +579,5 @@ // it is focused, otherwise the cell itself is focused.
     pressProps
-  } = usePress(itemProps); // Grid cells can have focusable elements inside them. In this case, focus should
+  } = usePress(_babelRuntimeHelpersEsmExtends({}, itemProps, {
+    isDisabled
+  })); // Grid cells can have focusable elements inside them. In this case, focus should
   // be marshalled to that element rather than focusing the cell itself.
@@ -618,3 +626,4 @@
     colspan,
-    ref
+    ref,
+    isDisabled
   } = props;
@@ -627,3 +636,3 @@ let {
   } = usePress({
-    isDisabled: !node.props.allowsSorting,
+    isDisabled: !node.props.allowsSorting || isDisabled,
 
@@ -668,3 +677,4 @@ onPress() {
     isVirtualized,
-    isSelected
+    isSelected,
+    isDisabled
   } = props;
@@ -681,3 +691,5 @@ let {
     pressProps
-  } = usePress(itemProps);
+  } = usePress(_babelRuntimeHelpersEsmExtends({}, itemProps, {
+    isDisabled
+  }));
 
@@ -712,6 +724,11 @@ let rowProps = _babelRuntimeHelpersEsmExtends({
   let {
-    key
+    key,
+    isDisabled
   } = props;
+  let manager = state.selectionManager;
   let checkboxId = useId();
-  let isSelected = state.selectionManager.isSelected(key);
+  let isSelected = state.selectionManager.isSelected(key) && !isDisabled;
+
+  let onChange = () => manager.select(key);
+
   return {
@@ -723,3 +740,3 @@ checkboxProps: {
       isSelected,
-      onChange: () => state.selectionManager.toggleSelection(key)
+      onChange
     }
@@ -726,0 +743,0 @@ };

dist/types.d.ts

@@ -21,2 +21,3 @@ import { AriaLabelingProps, DOMProps, KeyboardDelegate, Node } from "@react-types/shared";
     isVirtualized?: boolean;
+    isDisabled?: boolean;
 }
@@ -32,2 +33,3 @@ interface GridCellAria {
     colspan?: number;
+    isDisabled?: boolean;
 }
@@ -47,2 +49,3 @@ interface ColumnHeaderAria {
     isSelected?: boolean;
+    isDisabled?: boolean;
 }
@@ -57,2 +60,3 @@ interface RowAria {
     isVirtualized?: boolean;
+    isDisabled?: boolean;
 }
@@ -65,2 +69,3 @@ interface RowHeaderAria {
     key: Key;
+    isDisabled?: boolean;
 }
@@ -67,0 +72,0 @@ interface SelectionCheckboxAria {

package.json

 {
   "name": "@react-aria/table",
-  "version": "3.0.0-nightly.2426+6e9f55a7",
+  "version": "3.0.0-nightly.2430+d6206f77",
   "description": "Spectrum UI components in React",
@@ -21,13 +21,13 @@ "license": "Apache-2.0",
     "@babel/runtime": "^7.6.2",
-    "@react-aria/focus": "3.0.0-nightly.748+6e9f55a7",
-    "@react-aria/i18n": "3.0.0-nightly.748+6e9f55a7",
-    "@react-aria/interactions": "3.0.0-nightly.748+6e9f55a7",
-    "@react-aria/selection": "3.0.0-nightly.748+6e9f55a7",
-    "@react-aria/utils": "3.0.0-nightly.748+6e9f55a7",
-    "@react-stately/collections": "3.0.0-nightly.748+6e9f55a7",
-    "@react-stately/table": "3.0.0-nightly.2426+6e9f55a7",
-    "@react-stately/virtualizer": "3.1.3-nightly.2426+6e9f55a7",
-    "@react-types/checkbox": "3.0.0-nightly.748+6e9f55a7",
-    "@react-types/shared": "3.0.0-nightly.748+6e9f55a7",
-    "@react-types/table": "3.0.0-nightly.2426+6e9f55a7"
+    "@react-aria/focus": "3.0.0-nightly.752+d6206f77",
+    "@react-aria/i18n": "3.0.0-nightly.752+d6206f77",
+    "@react-aria/interactions": "3.0.0-nightly.752+d6206f77",
+    "@react-aria/selection": "3.0.0-nightly.752+d6206f77",
+    "@react-aria/utils": "3.0.0-nightly.752+d6206f77",
+    "@react-stately/collections": "3.0.0-nightly.752+d6206f77",
+    "@react-stately/table": "3.0.0-nightly.2430+d6206f77",
+    "@react-stately/virtualizer": "3.1.3-nightly.2430+d6206f77",
+    "@react-types/checkbox": "3.0.0-nightly.752+d6206f77",
+    "@react-types/shared": "3.0.0-nightly.752+d6206f77",
+    "@react-types/table": "3.0.0-nightly.2430+d6206f77"
   },
@@ -40,3 +40,3 @@ "peerDependencies": {
   },
-  "gitHead": "6e9f55a7cebf5f61cdd89057f7cc8b00d021d4d7"
+  "gitHead": "d6206f778338e478a9dfa0589bd79cecd97c403c"
 }

src/TableKeyboardDelegate.ts

@@ -92,3 +92,3 @@ /*
 
-      let firstItem = this.collection.getItem(this.collection.getFirstKey());
+      let firstItem = this.collection.getItem(this.getFirstKey());
       return [...firstItem.childNodes][startItem.index].key;
@@ -102,4 +102,4 @@ }
 
-    // Find the next enabled item
-    key = this.findNextKey(item => item.type === 'item' && !this.disabledKeys.has(item.key), key);
+    // Find the next item
+    key = this.findNextKey(item => item.type === 'item', key);
     if (key != null) {
@@ -138,4 +138,4 @@ // If focus was on a cell, focus the cell with the same index in the next row.
 
-    // Find the previous enabled item
-    key = this.findPreviousKey(item => item.type === 'item' && !this.disabledKeys.has(item.key), key);
+    // Find the previous item
+    key = this.findPreviousKey(item => item.type === 'item', key);
     if (key != null) {
@@ -288,4 +288,4 @@ // If focus was on a cell, focus the cell with the same index in the previous row.
 
-    // Find the first enabled row
-    key = this.findNextKey(item => item.type === 'item' && !this.disabledKeys.has(item.key));
+    // Find the first row
+    key = this.findNextKey(item => item.type === 'item');
 
@@ -319,4 +319,4 @@ // If global flag is set, focus the first cell in the first row.
 
-    // Find the last enabled row
-    key = this.findPreviousKey(item => item.type === 'item' && !this.disabledKeys.has(item.key));
+    // Find the last row
+    key = this.findPreviousKey(item => item.type === 'item');
 
@@ -383,2 +383,3 @@ // If global flag is set, focus the last cell in the last row.
     let itemRect = this.getItemRect(key);
+
     if (!itemRect) {
@@ -389,7 +390,13 @@ return null;
     let pageHeight = this.getPageHeight();
-    let pageY = Math.min(this.getContentHeight() - pageHeight, itemRect.y + pageHeight);
+    let pageY = Math.min(this.getContentHeight(), itemRect.y + pageHeight);
 
     while (itemRect && itemRect.maxY < pageY) {
-      key = this.getKeyBelow(key);
-      itemRect = this.getItemRect(key);
+      let nextKey = this.getKeyBelow(key);
+      itemRect = this.getItemRect(nextKey);
+
+      // Guard against case where maxY of the last key is barely less than pageY due to rounding
+      // and thus it attempts to set key to null
+      if (nextKey != null) {
+        key = nextKey;
+      }
     }
@@ -396,0 +403,0 @@

src/useTableCell.ts

@@ -24,3 +24,4 @@ /*
   ref: RefObject<HTMLElement>,
-  isVirtualized?: boolean
+  isVirtualized?: boolean,
+  isDisabled?: boolean
 }
@@ -36,3 +37,4 @@
     ref,
-    isVirtualized
+    isVirtualized,
+    isDisabled
   } = props;
@@ -61,3 +63,3 @@
   // TODO: move into useSelectableItem?
-  let {pressProps} = usePress(itemProps);
+  let {pressProps} = usePress({...itemProps, isDisabled});
 
@@ -64,0 +66,0 @@ // Grid cells can have focusable elements inside them. In this case, focus should

src/useTableColumnHeader.ts

@@ -27,3 +27,4 @@ /*
   isVirtualized?: boolean,
-  colspan?: number
+  colspan?: number,
+  isDisabled?: boolean
 }
@@ -36,7 +37,7 @@
 export function useTableColumnHeader<T>(props: ColumnHeaderProps, state: TableState<T>): ColumnHeaderAria {
-  let {node, colspan, ref} = props;
+  let {node, colspan, ref, isDisabled} = props;
   let {gridCellProps} = useTableCell(props, state);
 
   let {pressProps} = usePress({
-    isDisabled: !node.props.allowsSorting,
+    isDisabled: !node.props.allowsSorting || isDisabled,
     onPress() {
@@ -43,0 +44,0 @@ state.sort(node.key);

src/useTableRow.ts

@@ -24,3 +24,4 @@ /*
   isVirtualized?: boolean,
-  isSelected?: boolean
+  isSelected?: boolean,
+  isDisabled?: boolean
 }
@@ -37,3 +38,4 @@
     isVirtualized,
-    isSelected
+    isSelected,
+    isDisabled
   } = props;
@@ -49,3 +51,3 @@
   // TODO: move into useSelectableItem?
-  let {pressProps} = usePress(itemProps);
+  let {pressProps} = usePress({...itemProps, isDisabled});
 
@@ -52,0 +54,0 @@ let rowProps: HTMLAttributes<HTMLElement> = {

src/useTableRowHeader.ts

@@ -22,3 +22,4 @@ /*
   ref: RefObject<HTMLElement>,
-  isVirtualized?: boolean
+  isVirtualized?: boolean,
+  isDisabled?: boolean
 }
@@ -25,0 +26,0 @@

src/useTableSelectionCheckbox.ts

@@ -20,3 +20,4 @@ /*
 interface SelectionCheckboxProps {
-  key: Key
+  key: Key,
+  isDisabled?: boolean
 }
@@ -30,8 +31,12 @@
   let {
-    key
+    key,
+    isDisabled
   } = props;
 
+  let manager = state.selectionManager;
   let checkboxId = useId();
-  let isSelected = state.selectionManager.isSelected(key);
+  let isSelected = state.selectionManager.isSelected(key) && !isDisabled;
 
+  let onChange = () => manager.select(key);
+
   return {
@@ -43,3 +48,3 @@ checkboxProps: {
       isSelected,
-      onChange: () => state.selectionManager.toggleSelection(key)
+      onChange
     }
@@ -46,0 +51,0 @@ };

New alerts

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Fixed alerts

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

193701

increased by0.89%

Lines of code

2072

increased by2.37%

Dependency changes

• Updated@react-aria/focus@3.0.0-nightly.752+d6206f77

• Updated@react-aria/i18n@3.0.0-nightly.752+d6206f77

• Updated@react-aria/interactions@3.0.0-nightly.752+d6206f77

• Updated@react-aria/selection@3.0.0-nightly.752+d6206f77

• Updated@react-aria/utils@3.0.0-nightly.752+d6206f77

• Updated@react-stately/collections@3.0.0-nightly.752+d6206f77

• Updated@react-stately/table@3.0.0-nightly.2430+d6206f77

• Updated@react-stately/virtualizer@3.1.3-nightly.2430+d6206f77

• Updated@react-types/checkbox@3.0.0-nightly.752+d6206f77

• Updated@react-types/shared@3.0.0-nightly.752+d6206f77

• Updated@react-types/table@3.0.0-nightly.2430+d6206f77