Merge pull request layer5io#665 from dottharun/feat/infoTooltip

feat: Migrate infoTooltip from cloud

src/custom/CustomTooltip/customTooltip.tsx

@@ -56,3 +56,4 @@ function CustomTooltip({
 }
 
 export default CustomTooltip;
+export type { CustomTooltipProps };

src/custom/CustomTooltip/index.tsx

@@ -1,3 +1,4 @@
 import CustomTooltip from './customTooltip';
+import InfoTooltip from './infoTooltip';
 
-export { CustomTooltip };
+export { CustomTooltip, InfoTooltip };

src/custom/CustomTooltip/infoTooltip.tsx

@@ -0,0 +1,28 @@
+import { iconSmall } from '../../constants/iconsSizes';
+import InfoOutlinedIcon from '../../icons/InfoOutlined/InfoOutlined';
+import CustomTooltip, { CustomTooltipProps } from './customTooltip';
+
+type InfoTooltipProps = {
+  helpText: string | React.ReactNode | JSX.Element;
+  style?: React.CSSProperties;
+} & Omit<CustomTooltipProps, 'title' | 'children'>;
+
+const InfoTooltip = ({ helpText, style = {}, ...props }: InfoTooltipProps) => {
+  return (
+    <CustomTooltip title={helpText} {...props}>
+      <div
+        style={{
+          display: 'flex',
+          flexDirection: 'row',
+          alignItems: 'center',
+          justifyContent: 'center',
+          ...style
+        }}
+      >
+        <InfoOutlinedIcon {...iconSmall} />
+      </div>
+    </CustomTooltip>
+  );
+};
+
+export default InfoTooltip;

src/custom/index.tsx

@@ -8,7 +8,7 @@ import {
   CustomColumnVisibilityControl,
   CustomColumnVisibilityControlProps
 } from './CustomColumnVisibilityControl/CustomColumnVisibilityControl';
-import { CustomTooltip } from './CustomTooltip';
+import { CustomTooltip, InfoTooltip } from './CustomTooltip';
 import {
   CustomDialog,
   StyledDialogActions,
@@ -60,6 +60,7 @@ export {
   Fallback,
   FeedbackButton,
   FlipCard,
+  InfoTooltip,
   LearningCard,
   ModalCard,
   PopperListener,