Skip to content

Commit

Permalink
yarn prettier
Browse files Browse the repository at this point in the history
  • Loading branch information
ZeeshanTamboli committed Aug 25, 2022
1 parent 1bd5294 commit 9eb0c6c
Showing 1 changed file with 13 additions and 5 deletions.
18 changes: 13 additions & 5 deletions docs/data/material/components/tooltips/tooltips.md
Expand Up @@ -47,14 +47,18 @@ If the child is a custom React element, you need to make sure that it spreads it
```jsx
const MyComponent = React.forwardRef(function MyComponent(props, ref) {
// Spread the props to the underlying DOM element.
return <div {...props} ref={ref}>Bin</div>
return (
<div {...props} ref={ref}>
Bin
</div>
);
});

// ...

<Tooltip title="Delete">
<MyComponent />
</Tooltip>
</Tooltip>;
```

You can find a similar concept in the [wrapping components](/material-ui/guides/composition/#wrapping-components) guide.
Expand All @@ -66,9 +70,13 @@ class MyComponent extends React.Component {
render() {
const { innerRef, ...props } = this.props;
// Spread the props to the underlying DOM element.
return <div {...props} ref={innerRef}>Bin</div>
return (
<div {...props} ref={innerRef}>
Bin
</div>
);
}
};
}

// Wrap MyComponent to forward the ref as expected by Tooltip
const WrappedMyComponent = React.forwardRef(function WrappedMyComponent(props, ref) {
Expand All @@ -79,7 +87,7 @@ const WrappedMyComponent = React.forwardRef(function WrappedMyComponent(props, r

<Tooltip title="Delete">
<WrappedMyComponent />
</Tooltip>
</Tooltip>;
```

## Triggers
Expand Down

0 comments on commit 9eb0c6c

Please sign in to comment.