Skip to content

Commit

Permalink
Improve isFocusVisible types
Browse files Browse the repository at this point in the history
  • Loading branch information
DiegoAndai committed Jun 28, 2024
1 parent 37b0dd4 commit 45f9abe
Show file tree
Hide file tree
Showing 2 changed files with 10 additions and 10 deletions.
18 changes: 9 additions & 9 deletions packages/mui-joy/src/Tooltip/Tooltip.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -274,7 +274,7 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {

React.useEffect(() => stopTouchInteraction, [stopTouchInteraction]);

const handleOpen = (event: React.MouseEvent<HTMLElement>) => {
const handleOpen = (event: React.SyntheticEvent<HTMLElement>) => {
hystersisTimer.clear();
hystersisOpen = true;

Expand Down Expand Up @@ -303,7 +303,7 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
});
});

const handleMouseOver = (event: React.MouseEvent<HTMLElement>) => {
const handleMouseOver = (event: React.SyntheticEvent<HTMLElement>) => {
if (ignoreNonTouchEvents.current && event.type !== 'touchstart') {
return;
}
Expand All @@ -326,7 +326,7 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
}
};

const handleMouseLeave = (event: React.MouseEvent<HTMLElement>) => {
const handleMouseLeave = (event: React.SyntheticEvent<HTMLElement>) => {
enterTimer.clear();
leaveTimer.start(leaveDelay, () => {
handleClose(event);
Expand All @@ -336,24 +336,24 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
// We don't necessarily care about the focusVisible state (which is safe to access via ref anyway).
// We just need to re-render the Tooltip if the focus-visible state changes.
const [, setChildIsFocusVisible] = React.useState(false);
const handleBlur = (event: React.FocusEvent<HTMLElement> | React.MouseEvent<HTMLElement>) => {
if (!isFocusVisible(event.target as EventTarget & Element)) {
const handleBlur = (event: React.FocusEvent<HTMLElement>) => {
if (!isFocusVisible(event.target)) {
setChildIsFocusVisible(false);
handleMouseLeave(event as React.MouseEvent<HTMLElement>);
handleMouseLeave(event);
}
};

const handleFocus = (event: React.FocusEvent<HTMLElement> | React.MouseEvent<HTMLElement>) => {
const handleFocus = (event: React.FocusEvent<HTMLElement>) => {
// Workaround for https://github.com/facebook/react/issues/7769
// The autoFocus of React might trigger the event before the componentDidMount.
// We need to account for this eventuality.
if (!childNode) {
setChildNode(event.currentTarget);
}

if (!isFocusVisible(event.target as EventTarget & Element)) {
if (isFocusVisible(event.target as Element)) {
setChildIsFocusVisible(true);
handleMouseOver(event as React.MouseEvent<HTMLElement>);
handleMouseOver(event);
}
};

Expand Down
2 changes: 1 addition & 1 deletion packages/mui-utils/src/isFocusVisible/isFocusVisible.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
/**
* Returns a boolean indicating if the event's target has :focus-visible
*/
export default function isFocusVisible(element: EventTarget & Element): boolean {
export default function isFocusVisible(element: Element): boolean {
try {
return element.matches(':focus-visible');
} catch (error) {
Expand Down

0 comments on commit 45f9abe

Please sign in to comment.