Skip to content

Commit

Permalink
fixup! fix(react-link): support Enter and Space interaction, if rende…
Browse files Browse the repository at this point in the history
…red as span
  • Loading branch information
mainframev committed Jan 10, 2025
1 parent 02c67fe commit 335ef30
Showing 1 changed file with 9 additions and 12 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -36,24 +36,21 @@ export const useLinkState_unstable = (state: LinkState): LinkState => {
};

// Disallow keydown event when component is disabled and eat events when disabledFocusable is set to true.
state.root.onKeyDown = mergeCallbacks(
state.root.onKeyDown,
(ev: React.KeyboardEvent<HTMLAnchorElement & HTMLButtonElement>) => {
const keyPressed = ev.key === Enter || ev.key === Space;

if ((disabled || disabledFocusable) && keyPressed) {
ev.preventDefault();
ev.stopPropagation();
return;
}
state.root.onKeyDown = (ev: React.KeyboardEvent<HTMLAnchorElement & HTMLButtonElement>) => {
const keyPressed = ev.key === Enter || ev.key === Space;

if ((disabled || disabledFocusable) && keyPressed) {
ev.preventDefault();
ev.stopPropagation();
} else {
onKeyDown?.(ev);
// if there is already onKeyDown provided - respect it
if (state.root.as === 'span' && !!state.root.onClick && !onKeyDown && keyPressed) {
ev.preventDefault();
ev.currentTarget.click();
}
},
);
}
};

// Set the aria-disabled and disabled props correctly.
state.disabled = disabled || disabledFocusable;
Expand Down

0 comments on commit 335ef30

Please sign in to comment.