Commit 22c9ce7d by Dominik Prokop

Make tooltips persistent when hovered

parent e03461ce
...@@ -16,7 +16,7 @@ const transitionStyles = { ...@@ -16,7 +16,7 @@ const transitionStyles = {
exiting: { opacity: 0 }, exiting: { opacity: 0 },
}; };
interface Props { interface Props extends React.DOMAttributes<HTMLDivElement> {
renderContent: (content: any) => any; renderContent: (content: any) => any;
show: boolean; show: boolean;
placement?: PopperJS.Placement; placement?: PopperJS.Placement;
...@@ -27,7 +27,7 @@ interface Props { ...@@ -27,7 +27,7 @@ interface Props {
class Popper extends PureComponent<Props> { class Popper extends PureComponent<Props> {
render() { render() {
const { renderContent, show, placement } = this.props; const { renderContent, show, placement, onMouseEnter, onMouseLeave } = this.props;
const { content } = this.props; const { content } = this.props;
return ( return (
...@@ -39,6 +39,8 @@ class Popper extends PureComponent<Props> { ...@@ -39,6 +39,8 @@ class Popper extends PureComponent<Props> {
{({ ref, style, placement, arrowProps }) => { {({ ref, style, placement, arrowProps }) => {
return ( return (
<div <div
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
ref={ref} ref={ref}
style={{ style={{
...style, ...style,
......
...@@ -12,7 +12,12 @@ const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperPro ...@@ -12,7 +12,12 @@ const Tooltip = ({ children, renderContent, ...controllerProps }: UsingPopperPro
{(showPopper, hidePopper, popperProps) => { {(showPopper, hidePopper, popperProps) => {
return ( return (
<> <>
<Popper {...popperProps} referenceElement={tooltipTriggerRef.current} /> <Popper
{...popperProps}
onMouseEnter={showPopper}
onMouseLeave={hidePopper}
referenceElement={tooltipTriggerRef.current}
/>
{React.cloneElement(children, { {React.cloneElement(children, {
ref: tooltipTriggerRef, ref: tooltipTriggerRef,
onMouseEnter: showPopper, onMouseEnter: showPopper,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment