@lumx/react 4.12.1-next.0 → 4.12.1-next.1

package/index.js

@@ -2519,23 +2519,29 @@ const isChipDisabled = chip => chip?.getAttribute('aria-disabled') === 'true';
  */
 
 /**
- * Finds the previous enabled chip before the given chip element using a TreeWalker.
- * If no currentChip is provided, returns the last enabled chip in the container.
+ * Find the nearest enabled chip in the given direction relative to `anchor`.
+ *
+ * - When `anchor` is provided, walks one step in `direction` from it.
+ * - When `anchor` is omitted, returns the first enabled chip from the matching
+ *   end of the container (last chip for 'previous', first for 'next').
  */
-function findPreviousChip(container, currentChip) {
+function findSiblingChip(container, direction, anchor) {
   const walker = createSelectorTreeWalker(container, ENABLED_CHIP_SELECTOR);
-  if (!currentChip) {
-    // Find the last enabled chip by walking to the end.
+  if (anchor) {
+    walker.currentNode = anchor;
+    const node = direction === 'next' ? walker.nextNode() : walker.previousNode();
+    return node || undefined;
+  }
+
+  // No anchor: walk from the matching end of the container.
+  if (direction === 'previous') {
     let last;
     while (walker.nextNode()) {
       last = walker.currentNode;
     }
     return last;
   }
-
-  // Position the walker at the current chip and walk backward.
-  walker.currentNode = currentChip;
-  return walker.previousNode() || undefined;
+  return walker.nextNode() || undefined;
 }
 
 /** Remove an option by its id and call onChange. */
@@ -2574,9 +2580,6 @@ function setupSelectionChipGroupEvents(options) {
   };
 
   // Delegated keydown handler on the chip group container.
-  // Enter/Space trigger removal (like click).
-  // Backspace also removes but explicitly moves focus to previous chip (overriding the
-  // roving tabindex MutationObserver which defaults to moving focus forward).
   const handleKeyDown = evt => {
     const chip = getChip(evt.target);
     const optionId = chip?.dataset.optionId;
@@ -2584,14 +2587,20 @@ function setupSelectionChipGroupEvents(options) {
     if (optionId == null || !activatingKey || isChipDisabled(chip)) {
       return;
     }
+
+    // Compute focus fallback target before removing the chip.
+    let focusTarget;
     if (evt.key === 'Backspace') {
-      // Move focus to previous option (instead of next in listbox)
-      const previousChip = findPreviousChip(container, chip);
-      const focusTarget = previousChip || options.getInput?.();
-      if (focusTarget) {
-        focusTarget.focus();
-        focusTarget.setAttribute('tabindex', '0');
-      }
+      // Custom behavior (not WAI-ARIA recommendation) => focus the previous chip, fallback on input (no more chips)
+      focusTarget = findSiblingChip(container, 'previous', chip) || options.getInput?.() || undefined;
+    } else {
+      // WAI-ARIA recommendation when removing an option in a listbox => focus the next chip, fallback on previous chip
+      // (bonus: we fallback on input when there is no more chips)
+      focusTarget = findSiblingChip(container, 'next', chip) || findSiblingChip(container, 'previous', chip) || options.getInput?.() || undefined;
+    }
+    if (focusTarget) {
+      focusTarget.focus();
+      focusTarget.setAttribute('tabindex', '0');
     }
     evt.preventDefault();
     removeOption(options, optionId);
@@ -2609,7 +2618,7 @@ function setupSelectionChipGroupEvents(options) {
       if (!backspacePressed || !cursorAtStart) return;
       evt.stopPropagation();
       evt.preventDefault();
-      const lastChip = findPreviousChip(container);
+      const lastChip = findSiblingChip(container, 'previous');
       lastChip?.focus();
     };
     input.addEventListener('keydown', inputHandler);