@terraware/web-components 5.0.27-rc.0 → 5.0.27

package/components/IconTooltip/index.js

@@ -1,50 +1,61 @@
-import { jsx } from "react/jsx-runtime";
-import react from "react";
-import { Tooltip, useTheme } from "@mui/material";
-import { useDeviceInfo } from "../../utils/index.js";
-import Icon from "../Icon/Icon.js";
-function IconTooltip({ iconName = 'info', placement = 'top-start', title, disableRightMargin }) {
-    const [open, setOpen] = react.useState(false);
-    const { isMobile } = useDeviceInfo();
-    const theme = useTheme();
-    const handleTooltipClose = ()=>{
-        setOpen(false);
-    };
-    const handleTooltipOpen = ()=>{
-        setOpen(true);
-    };
-    return /*#__PURE__*/ jsx(Tooltip, {
-        arrow: true,
-        onClose: handleTooltipClose,
-        open: isMobile ? open : void 0,
-        placement: placement,
-        sx: {
-            maxWidth: isMobile ? '342px' : '464px',
-            '& .MuiTooltip-arrow': {
-                color: theme.palette.TwClrBaseGray800
-            },
-            '& .MuiTooltip-tooltip': {
-                backgroundColor: theme.palette.TwClrBaseGray800,
-                color: theme.palette.TwClrBaseWhite,
-                padding: '8px',
-                '& a': {
-                    color: theme.palette.TwClrBaseWhite
-                }
-            }
-        },
-        title: title,
-        children: /*#__PURE__*/ jsx("span", {
-            onClick: handleTooltipOpen,
-            children: /*#__PURE__*/ jsx(Icon, {
-                name: iconName,
-                style: {
-                    fill: theme.palette.TwClrIcnSecondary,
-                    marginLeft: '4px',
-                    marginRight: disableRightMargin ? '0px' : '4px',
-                    verticalAlign: 'text-top'
-                }
-            })
-        })
-    });
+import React from 'react';
+import { useTheme, Tooltip } from '@mui/material';
+import 'lodash';
+import 'luxon';
+import useDeviceInfo from '../../utils/useDeviceInfo.js';
+import Icon from '../Icon/Icon.js';
+import { jsx } from 'react/jsx-runtime';
+
+function IconTooltip({
+  iconName = 'info',
+  placement = 'top-start',
+  title,
+  disableRightMargin
+}) {
+  const [open, setOpen] = React.useState(false);
+  const {
+    isMobile
+  } = useDeviceInfo();
+  const theme = useTheme();
+  const handleTooltipClose = () => {
+    setOpen(false);
+  };
+  const handleTooltipOpen = () => {
+    setOpen(true);
+  };
+  return /*#__PURE__*/jsx(Tooltip, {
+    arrow: true,
+    onClose: handleTooltipClose,
+    open: isMobile ? open : undefined,
+    placement: placement,
+    sx: {
+      maxWidth: isMobile ? '342px' : '464px',
+      '& .MuiTooltip-arrow': {
+        color: theme.palette.TwClrBaseGray800
+      },
+      '& .MuiTooltip-tooltip': {
+        backgroundColor: theme.palette.TwClrBaseGray800,
+        color: theme.palette.TwClrBaseWhite,
+        padding: '8px',
+        '& a': {
+          color: theme.palette.TwClrBaseWhite
+        }
+      }
+    },
+    title: title,
+    children: /*#__PURE__*/jsx("span", {
+      onClick: handleTooltipOpen,
+      children: /*#__PURE__*/jsx(Icon, {
+        name: iconName,
+        style: {
+          fill: theme.palette.TwClrIcnSecondary,
+          marginLeft: '4px',
+          marginRight: disableRightMargin ? '0px' : '4px',
+          verticalAlign: 'text-top'
+        }
+      })
+    })
+  });
 }
-export default IconTooltip;
+
+export { IconTooltip as default };