@react-aria/tag - npm Package Compare versions

Comparing version 3.0.0-nightly-dcc0752f8-241031 to 3.0.0-nightly-e14088a7e-241204

dist/useTag.main.js

@@ -46,4 +46,6 @@ var $09704b0efefe5140$exports = require("./useTagGroup.main.js");
     let { descriptionProps: _, ...stateWithoutDescription } = states;
+    let isDisabled = state.disabledKeys.has(item.key) || item.props.isDisabled;
     let onKeyDown = (e)=>{
         if (e.key === 'Delete' || e.key === 'Backspace') {
+            if (isDisabled) return;
             e.preventDefault();
@@ -60,4 +62,6 @@ if (state.selectionManager.isSelected(item.key)) onRemove === null || onRemove === void 0 ? void 0 : onRemove(new Set(state.selectionManager.selectedKeys));
     let descProps = (0, $8p8DL$reactariautils.useDescription)(description);
-    let isFocused = item.key === state.selectionManager.focusedKey;
-    // @ts-ignore - data attributes are ok but TS doesn't know about them.
+    let isItemFocused = item.key === state.selectionManager.focusedKey;
+    let isFocused = state.selectionManager.focusedKey != null;
+    let tabIndex = -1;
+    if (!isDisabled && (isItemFocused || !isFocused)) tabIndex = 0;
     let domProps = (0, $8p8DL$reactariautils.filterDOMProps)(item.props);
@@ -69,3 +73,3 @@ let linkProps = (0, $8p8DL$reactariautils.useSyntheticLinkProps)(item.props);
             'aria-labelledby': `${buttonId} ${rowProps.id}`,
-            isDisabled: state.disabledKeys.has(item.key) || item.props.isDisabled,
+            isDisabled: isDisabled,
             id: buttonId,
@@ -78,3 +82,3 @@ onPress: ()=>onRemove ? onRemove(new Set([
         rowProps: (0, $8p8DL$reactariautils.mergeProps)(rowProps, domProps, linkProps, {
-            tabIndex: isFocused || state.selectionManager.focusedKey == null ? 0 : -1,
+            tabIndex: tabIndex,
             onKeyDown: onRemove ? onKeyDown : undefined,
@@ -81,0 +85,0 @@ 'aria-describedby': descProps['aria-describedby']

dist/useTag.module.js

@@ -40,4 +40,6 @@ import {hookData as $d7323bca8d074eeb$export$653eddfc964b0f8a} from "./useTagGroup.module.js";
     let { descriptionProps: _, ...stateWithoutDescription } = states;
+    let isDisabled = state.disabledKeys.has(item.key) || item.props.isDisabled;
     let onKeyDown = (e)=>{
         if (e.key === 'Delete' || e.key === 'Backspace') {
+            if (isDisabled) return;
             e.preventDefault();
@@ -54,4 +56,6 @@ if (state.selectionManager.isSelected(item.key)) onRemove === null || onRemove === void 0 ? void 0 : onRemove(new Set(state.selectionManager.selectedKeys));
     let descProps = (0, $ioKwR$useDescription)(description);
-    let isFocused = item.key === state.selectionManager.focusedKey;
-    // @ts-ignore - data attributes are ok but TS doesn't know about them.
+    let isItemFocused = item.key === state.selectionManager.focusedKey;
+    let isFocused = state.selectionManager.focusedKey != null;
+    let tabIndex = -1;
+    if (!isDisabled && (isItemFocused || !isFocused)) tabIndex = 0;
     let domProps = (0, $ioKwR$filterDOMProps)(item.props);
@@ -63,3 +67,3 @@ let linkProps = (0, $ioKwR$useSyntheticLinkProps)(item.props);
             'aria-labelledby': `${buttonId} ${rowProps.id}`,
-            isDisabled: state.disabledKeys.has(item.key) || item.props.isDisabled,
+            isDisabled: isDisabled,
             id: buttonId,
@@ -72,3 +76,3 @@ onPress: ()=>onRemove ? onRemove(new Set([
         rowProps: (0, $ioKwR$mergeProps)(rowProps, domProps, linkProps, {
-            tabIndex: isFocused || state.selectionManager.focusedKey == null ? 0 : -1,
+            tabIndex: tabIndex,
             onKeyDown: onRemove ? onKeyDown : undefined,
@@ -75,0 +79,0 @@ 'aria-describedby': descProps['aria-describedby']

package.json

 {
   "name": "@react-aria/tag",
-  "version": "3.0.0-nightly-dcc0752f8-241031",
+  "version": "3.0.0-nightly-e14088a7e-241204",
   "description": "Spectrum UI components in React",
@@ -25,16 +25,16 @@ "license": "Apache-2.0",
   "dependencies": {
-    "@react-aria/gridlist": "^3.0.0-nightly-dcc0752f8-241031",
-    "@react-aria/i18n": "^3.0.0-nightly-dcc0752f8-241031",
-    "@react-aria/interactions": "^3.0.0-nightly-dcc0752f8-241031",
-    "@react-aria/label": "^3.0.0-nightly-dcc0752f8-241031",
-    "@react-aria/selection": "^3.0.0-nightly-dcc0752f8-241031",
-    "@react-aria/utils": "^3.0.0-nightly-dcc0752f8-241031",
-    "@react-stately/list": "^3.0.0-nightly-dcc0752f8-241031",
-    "@react-types/button": "^3.0.0-nightly-dcc0752f8-241031",
-    "@react-types/shared": "^3.0.0-nightly-dcc0752f8-241031",
+    "@react-aria/gridlist": "^3.0.0-nightly-e14088a7e-241204",
+    "@react-aria/i18n": "^3.0.0-nightly-e14088a7e-241204",
+    "@react-aria/interactions": "^3.0.0-nightly-e14088a7e-241204",
+    "@react-aria/label": "^3.0.0-nightly-e14088a7e-241204",
+    "@react-aria/selection": "^3.0.0-nightly-e14088a7e-241204",
+    "@react-aria/utils": "^3.0.0-nightly-e14088a7e-241204",
+    "@react-stately/list": "^3.0.0-nightly-e14088a7e-241204",
+    "@react-types/button": "^3.0.0-nightly-e14088a7e-241204",
+    "@react-types/shared": "^3.0.0-nightly-e14088a7e-241204",
     "@swc/helpers": "^0.5.0"
   },
   "peerDependencies": {
-    "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0",
-    "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0"
+    "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1",
+    "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1"
   },
@@ -44,3 +44,3 @@ "publishConfig": {
   },
-  "stableVersion": "3.4.7"
+  "stableVersion": "3.4.8"
 }

src/useTag.ts

@@ -64,4 +64,9 @@ /*
 
+  let isDisabled = state.disabledKeys.has(item.key) || item.props.isDisabled;
   let onKeyDown = (e: KeyboardEvent) => {
     if (e.key === 'Delete' || e.key === 'Backspace') {
+      if (isDisabled) {
+        return;
+      }
+
       e.preventDefault();
@@ -83,4 +88,9 @@ if (state.selectionManager.isSelected(item.key)) {
 
-  let isFocused = item.key === state.selectionManager.focusedKey;
-  // @ts-ignore - data attributes are ok but TS doesn't know about them.
+  let isItemFocused = item.key === state.selectionManager.focusedKey;
+  let isFocused = state.selectionManager.focusedKey != null;
+  let tabIndex = -1;
+  if (!isDisabled && (isItemFocused || !isFocused)) {
+    tabIndex = 0;
+  }
+
   let domProps = filterDOMProps(item.props);
@@ -92,3 +102,3 @@ let linkProps = useSyntheticLinkProps(item.props);
       'aria-labelledby': `${buttonId} ${rowProps.id}`,
-      isDisabled: state.disabledKeys.has(item.key) || item.props.isDisabled,
+      isDisabled,
       id: buttonId,
@@ -99,3 +109,3 @@ onPress: () => onRemove ? onRemove(new Set([item.key])) : null,
     rowProps: mergeProps(rowProps, domProps, linkProps, {
-      tabIndex: (isFocused || state.selectionManager.focusedKey == null) ? 0 : -1,
+      tabIndex,
       onKeyDown: onRemove ? onKeyDown : undefined,
@@ -102,0 +112,0 @@ 'aria-describedby': descProps['aria-describedby']

No alert changes

Improved metrics

Total package byte prevSize

139628

increased by0.52%

Lines of code

1666

increased by1.22%

Dependency changes

• Updated@react-aria/gridlist@^3.0.0-nightly-e14088a7e-241204

• Updated@react-aria/i18n@^3.0.0-nightly-e14088a7e-241204

• Updated@react-aria/interactions@^3.0.0-nightly-e14088a7e-241204

• Updated@react-aria/label@^3.0.0-nightly-e14088a7e-241204

• Updated@react-aria/selection@^3.0.0-nightly-e14088a7e-241204

• Updated@react-aria/utils@^3.0.0-nightly-e14088a7e-241204

• Updated@react-stately/list@^3.0.0-nightly-e14088a7e-241204

• Updated@react-types/button@^3.0.0-nightly-e14088a7e-241204

• Updated@react-types/shared@^3.0.0-nightly-e14088a7e-241204