From 29831c31676c188067a7dc0d0e55c4f0d0533948 Mon Sep 17 00:00:00 2001
From: Robin Wijnant <robin@wijnant.me>
Date: Sun, 31 Jan 2021 13:46:22 +0100
Subject: [PATCH] fix(tooltip): add childrenClassName

---
 src/components/Tooltip/Tooltip.tsx | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/components/Tooltip/Tooltip.tsx b/src/components/Tooltip/Tooltip.tsx
index 122e3d64..f068f32c 100644
--- a/src/components/Tooltip/Tooltip.tsx
+++ b/src/components/Tooltip/Tooltip.tsx
@@ -10,15 +10,23 @@ interface Props {
   content?: React.ReactNode;
   children?: React.ReactNode;
   placement?: Placement;
-  className?: string;
+  contentClassName?: string;
+  childrenClassName?: string;
 }
 
-const Popover: React.FC<Props> = ({ content, children, placement = 'top', className }: Props) => {
+const Popover: React.FC<Props> = ({
+  content,
+  children,
+  placement = 'top',
+  contentClassName,
+  childrenClassName,
+}: Props) => {
   const [isShown, setIsShown] = useState(false);
   const divRef = useRef<HTMLDivElement>(null);
   const contentRef = useRef<HTMLDivElement>(null);
   const [arrowRef, setArrowRef] = useState<HTMLDivElement | null>(null);
-  const contentClassNames = classnames(styles.content, className);
+  const contentClassNames = classnames(styles.content, contentClassName);
+  const childrenClassNames = classnames(styles.triggerContainer, childrenClassName);
 
   const hide = () => setIsShown(false);
   const show = () => setIsShown(true);
@@ -43,7 +51,7 @@ const Popover: React.FC<Props> = ({ content, children, placement = 'top', classN
 
   return (
     <>
-      <div className={styles.triggerContainer} ref={divRef} onMouseEnter={show} onMouseLeave={hide}>
+      <div className={childrenClassNames} ref={divRef} onMouseEnter={show} onMouseLeave={hide}>
         {children}
       </div>