Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Tooltip][Joy] Fix arrow does not appear #35473

Merged
merged 2 commits into from Dec 14, 2022

Conversation

siriwatknp
Copy link
Member

@siriwatknp siriwatknp commented Dec 14, 2022

close #35472

Root cause

The ref in additionalProps is not called by useSlot so arrowRef is always null.

Argos

change is expected.

image


@siriwatknp siriwatknp added component: tooltip This is the name of the generic UI component, not the React module! regression A bug, but worse package: joy-ui Specific to @mui/joy labels Dec 14, 2022
@@ -4,7 +4,7 @@ import Tooltip from '@mui/joy/Tooltip';

export default function ArrowTooltips() {
return (
<Tooltip title="Add" arrow>
<Tooltip title="Add" arrow open placement="right">
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This visual regression will help us preventing the regression in the future.

// @ts-ignore `ref` is required for the 'root' slot
useForkRef(resolvedComponentsProps?.ref, name === 'root' ? parameters.ref : undefined),
) as ((instance: any | null) => void) | null;
const ref = useForkRef(internalRef, resolvedComponentsProps?.ref, parameters.ref);
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

useForkRef can receive ...refs, no need to double it.

parameters: (T extends 'root' ? { ref: React.ForwardedRef<any> } : {}) & {
parameters: (T extends 'root' // root slot must pass a `ref` as a parameter
? { ref: React.ForwardedRef<any> }
: { ref?: React.ForwardedRef<any> }) & {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This allows the non-root slot to pass in ref directly.

@mui-bot
Copy link

mui-bot commented Dec 14, 2022

Messages
📖 Netlify deploy preview: https://deploy-preview-35473--material-ui.netlify.app/

Details of bundle changes

Generated by 🚫 dangerJS against e3dac9c

Copy link
Member

@mnajdova mnajdova left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good 👍

@siriwatknp siriwatknp merged commit 362229d into mui:master Dec 14, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: tooltip This is the name of the generic UI component, not the React module! package: joy-ui Specific to @mui/joy regression A bug, but worse
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Joy UI - Tooltip] "arrow" prop not working
3 participants