@wavelengthusaf/components 1.0.8 → 1.0.10

package/dist/index.mjs

@@ -4399,10 +4399,31 @@ import React28 from "react";
 import Menu from "@mui/material/Menu";
 import MenuItem from "@mui/material/MenuItem";
 import Box3 from "@mui/material/Box";
+import Slide from "@mui/material/Slide";
 import { Divider as Divider2, IconButton as IconButton3 } from "@mui/material";
 import { HelpOutline } from "@mui/icons-material";
+import styled4 from "styled-components";
 var customStyle = { marginLeft: 16, marginRight: 16, marginTop: 8, marginBottom: 8 };
-function WavelengthPopUpMenu({ menuItems, customIcon, width: width2, menuDirection }) {
+var emailStyle = {
+  marginLeft: 16,
+  marginRight: 16,
+  marginTop: 8,
+  marginBottom: 8
+};
+function WavelengthPopUpMenu({ menuItems, customIcon, width: width2, menuDirection, color: color2, emailHoverColor }) {
+  const NavLink = styled4.a``;
+  const Links = styled4(NavLink)`
+    color: inherit;
+    textdecoration: none;
+
+    &:hover,
+    &:focus {
+      color: ${emailHoverColor};
+    }
+    &:active {
+      color: ${emailHoverColor};
+    }
+  `;
   const [anchorEl, setAnchorEl] = React28.useState(null);
   const open = Boolean(anchorEl);
   let icon;
@@ -4415,7 +4436,7 @@ function WavelengthPopUpMenu({ menuItems, customIcon, width: width2, menuDirecti
   if (customIcon) {
     icon = customIcon;
   } else {
-    icon = /* @__PURE__ */ React28.createElement(HelpOutline, { fontSize: "medium" });
+    icon = /* @__PURE__ */ React28.createElement(HelpOutline, { fontSize: "medium", sx: { color: color2 } });
   }
   const anchor = menuDirection == "top" || menuDirection == void 0 ? "top" : "bottom";
   const transform = menuDirection == "top" || menuDirection == void 0 ? "bottom" : "top";
@@ -4426,6 +4447,7 @@ function WavelengthPopUpMenu({ menuItems, customIcon, width: width2, menuDirecti
       sx: { width: width2 },
       onClose: handleClose,
       anchorEl,
+      TransitionComponent: Slide,
       anchorOrigin: { vertical: anchor, horizontal: "center" },
       transformOrigin: { vertical: transform, horizontal: "center" }
     },
@@ -4443,7 +4465,11 @@ function WavelengthPopUpMenu({ menuItems, customIcon, width: width2, menuDirecti
           if (items.link) {
             return /* @__PURE__ */ React28.createElement(Box3, { key: index }, /* @__PURE__ */ React28.createElement(MenuItem, null, /* @__PURE__ */ React28.createElement("a", { style: { textDecoration: "!important", color: "inherit" }, href: items.link }, items.label)), /* @__PURE__ */ React28.createElement(Divider2, null));
           } else {
-            return /* @__PURE__ */ React28.createElement(Box3, { key: index }, /* @__PURE__ */ React28.createElement("p", { style: customStyle }, items.label), /* @__PURE__ */ React28.createElement(Divider2, null));
+            if (items.email) {
+              return /* @__PURE__ */ React28.createElement(Box3, { key: index }, /* @__PURE__ */ React28.createElement(Links, { href: items.email, style: emailStyle }, items.label), /* @__PURE__ */ React28.createElement(Divider2, null));
+            } else {
+              return /* @__PURE__ */ React28.createElement(Box3, { key: index }, /* @__PURE__ */ React28.createElement("p", { style: customStyle }, items.label), /* @__PURE__ */ React28.createElement(Divider2, null));
+            }
           }
         }
       } else if (items.end == void 0 || items.end == false || items.end == null) {
@@ -4459,7 +4485,11 @@ function WavelengthPopUpMenu({ menuItems, customIcon, width: width2, menuDirecti
           if (items.link) {
             return /* @__PURE__ */ React28.createElement(MenuItem, { key: index }, items.label);
           } else {
-            return /* @__PURE__ */ React28.createElement("p", { key: index, style: customStyle }, items.label);
+            if (items.email) {
+              return /* @__PURE__ */ React28.createElement(Links, { key: index, style: emailStyle, href: items.email }, items.label);
+            } else {
+              return /* @__PURE__ */ React28.createElement("p", { key: index, style: customStyle }, items.label);
+            }
           }
         }
       }
@@ -4468,8 +4498,9 @@ function WavelengthPopUpMenu({ menuItems, customIcon, width: width2, menuDirecti
 }
 
 // src/components/snackbars/WavelengthSnackbar.tsx
-import { Snackbar, SnackbarContent } from "@mui/material";
+import { IconButton as IconButton4, Snackbar, SnackbarContent } from "@mui/material";
 import React29 from "react";
+import CloseIcon2 from "@mui/icons-material/Close";
 function WavelengthSnackbar(props) {
   const { show, setShow } = props;
   const handleClose = () => {
@@ -4494,10 +4525,12 @@ function WavelengthSnackbar(props) {
         style: {
           backgroundColor: props.snackBarColor ? props.snackBarColor : palette2.primary,
           color: props.textColor ? props.textColor : palette2.secondary,
-          display: "block",
-          textAlign: "center"
+          display: "flex",
+          textAlign: "center",
+          width: props.width
         },
-        message: /* @__PURE__ */ React29.createElement("span", { id: "snackbar" }, props.message ? props.message : "Insert Message Here")
+        message: /* @__PURE__ */ React29.createElement("span", { id: "snackbar" }, props.message ? props.message : "Insert Message Here"),
+        action: /* @__PURE__ */ React29.createElement(React29.Fragment, null, /* @__PURE__ */ React29.createElement(IconButton4, { size: "small", "aria-label": "close", color: "inherit", onClick: handleClose }, /* @__PURE__ */ React29.createElement(CloseIcon2, { fontSize: "small" })))
       }
     )
   );