@wavelengthusaf/components 1.2.5 → 1.2.6

package/dist/index.d.mts

@@ -312,6 +312,7 @@ declare function WavelengthSnackbar(props: ConfirmationSnackbarProps): React__de
 interface StandardSnackbarProps {
     type: "success" | "error" | "disabled";
     show: boolean;
+    closeIcon: ReactNode | React__default.JSX.Element;
     icon?: ReactNode;
     toggleShow: (on: boolean) => void;
     horryAlign?: "left" | "right" | "center";
@@ -321,13 +322,19 @@ interface StandardSnackbarProps {
     message?: string | ReactNode;
     customVertyAlign?: string;
 }
-declare function WavelengthStandardSnackbar({ type, show, icon, horryAlign, vertyAlign, durationSb, width, message, customVertyAlign, toggleShow }: StandardSnackbarProps): React__default.JSX.Element;
+declare function WavelengthStandardSnackbar({ type, show, icon, horryAlign, vertyAlign, durationSb, width, message, customVertyAlign, toggleShow, closeIcon }: StandardSnackbarProps): React__default.JSX.Element;
 
-interface TestProps {
-    openProp: boolean;
-    toggleOpen: React__default.Dispatch<React__default.SetStateAction<boolean>>;
-    Sbduration?: number;
+interface Testprops {
+    isPopUpOpen: boolean;
+    type: "success" | "error" | "disabled";
+    icon?: ReactNode;
+    width?: string | number;
+    message?: string | ReactNode;
+    img: React__default.JSX.Element | ReactNode;
+    toggleOpen: (value: React__default.SetStateAction<boolean>) => void;
+    customVertyAlign?: string;
 }
-declare function TestSnackbar({ openProp, toggleOpen, Sbduration }: TestProps): React__default.JSX.Element;
+declare const useOutsideClick: (callback: () => void) => React__default.RefObject<HTMLDivElement>;
+declare function TestSnackbar({ isPopUpOpen, toggleOpen, type, message, customVertyAlign, width, img }: Testprops): React__default.JSX.Element;
 
-export { AceOfSpadesComponent, AppLogo, ArrowIcon, BomberBeeIcon, ButtonIcon, ButtonMenu, DefaultIcon, ManyPlanesComponent, NotAvailablePage, Old563EWSLogo, PortalIcon, RapidrefIcon, type SearchResult, SearchTextField, SquadronIcon, SwarmIcon, TestSnackbar, type ThemeProperties, WavelengthAppTheme, WavelengthAutocomplete, WavelengthBannerHeader, WavelengthBox, WavelengthButton, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFooter, WavelengthIcon, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthSearch, WavelengthSideBar, WavelengthSnackbar, WavelengthStandardSnackbar, WavelengthTitleBar, add, concat, findBestStringMatch, type menuItemProps, useThemeContext };
+export { AceOfSpadesComponent, AppLogo, ArrowIcon, BomberBeeIcon, ButtonIcon, ButtonMenu, DefaultIcon, ManyPlanesComponent, NotAvailablePage, Old563EWSLogo, PortalIcon, RapidrefIcon, type SearchResult, SearchTextField, SquadronIcon, SwarmIcon, TestSnackbar, type ThemeProperties, WavelengthAppTheme, WavelengthAutocomplete, WavelengthBannerHeader, WavelengthBox, WavelengthButton, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFooter, WavelengthIcon, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthSearch, WavelengthSideBar, WavelengthSnackbar, WavelengthStandardSnackbar, WavelengthTitleBar, add, concat, findBestStringMatch, type menuItemProps, useOutsideClick, useThemeContext };

package/dist/index.d.ts

@@ -312,6 +312,7 @@ declare function WavelengthSnackbar(props: ConfirmationSnackbarProps): React__de
 interface StandardSnackbarProps {
     type: "success" | "error" | "disabled";
     show: boolean;
+    closeIcon: ReactNode | React__default.JSX.Element;
     icon?: ReactNode;
     toggleShow: (on: boolean) => void;
     horryAlign?: "left" | "right" | "center";
@@ -321,13 +322,19 @@ interface StandardSnackbarProps {
     message?: string | ReactNode;
     customVertyAlign?: string;
 }
-declare function WavelengthStandardSnackbar({ type, show, icon, horryAlign, vertyAlign, durationSb, width, message, customVertyAlign, toggleShow }: StandardSnackbarProps): React__default.JSX.Element;
+declare function WavelengthStandardSnackbar({ type, show, icon, horryAlign, vertyAlign, durationSb, width, message, customVertyAlign, toggleShow, closeIcon }: StandardSnackbarProps): React__default.JSX.Element;
 
-interface TestProps {
-    openProp: boolean;
-    toggleOpen: React__default.Dispatch<React__default.SetStateAction<boolean>>;
-    Sbduration?: number;
+interface Testprops {
+    isPopUpOpen: boolean;
+    type: "success" | "error" | "disabled";
+    icon?: ReactNode;
+    width?: string | number;
+    message?: string | ReactNode;
+    img: React__default.JSX.Element | ReactNode;
+    toggleOpen: (value: React__default.SetStateAction<boolean>) => void;
+    customVertyAlign?: string;
 }
-declare function TestSnackbar({ openProp, toggleOpen, Sbduration }: TestProps): React__default.JSX.Element;
+declare const useOutsideClick: (callback: () => void) => React__default.RefObject<HTMLDivElement>;
+declare function TestSnackbar({ isPopUpOpen, toggleOpen, type, message, customVertyAlign, width, img }: Testprops): React__default.JSX.Element;
 
-export { AceOfSpadesComponent, AppLogo, ArrowIcon, BomberBeeIcon, ButtonIcon, ButtonMenu, DefaultIcon, ManyPlanesComponent, NotAvailablePage, Old563EWSLogo, PortalIcon, RapidrefIcon, type SearchResult, SearchTextField, SquadronIcon, SwarmIcon, TestSnackbar, type ThemeProperties, WavelengthAppTheme, WavelengthAutocomplete, WavelengthBannerHeader, WavelengthBox, WavelengthButton, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFooter, WavelengthIcon, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthSearch, WavelengthSideBar, WavelengthSnackbar, WavelengthStandardSnackbar, WavelengthTitleBar, add, concat, findBestStringMatch, type menuItemProps, useThemeContext };
+export { AceOfSpadesComponent, AppLogo, ArrowIcon, BomberBeeIcon, ButtonIcon, ButtonMenu, DefaultIcon, ManyPlanesComponent, NotAvailablePage, Old563EWSLogo, PortalIcon, RapidrefIcon, type SearchResult, SearchTextField, SquadronIcon, SwarmIcon, TestSnackbar, type ThemeProperties, WavelengthAppTheme, WavelengthAutocomplete, WavelengthBannerHeader, WavelengthBox, WavelengthButton, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFooter, WavelengthIcon, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthSearch, WavelengthSideBar, WavelengthSnackbar, WavelengthStandardSnackbar, WavelengthTitleBar, add, concat, findBestStringMatch, type menuItemProps, useOutsideClick, useThemeContext };

package/dist/index.js

@@ -1341,6 +1341,7 @@ __export(src_exports, {
   add: () => add,
   concat: () => concat,
   findBestStringMatch: () => findBestStringMatch,
+  useOutsideClick: () => useOutsideClick,
   useThemeContext: () => useThemeContext
 });
 module.exports = __toCommonJS(src_exports);
@@ -5034,10 +5035,8 @@ function WavelengthSnackbar(props) {
 // src/components/snackbars/WavelengthStandardSnackbar.tsx
 var import_react35 = __toESM(require("react"));
 var import_Snackbar = __toESM(require("@mui/material/Snackbar"));
-var import_IconButton2 = __toESM(require("@mui/material/IconButton"));
-var import_Close3 = __toESM(require("@mui/icons-material/Close"));
 var import_SnackbarContent = __toESM(require("@mui/material/SnackbarContent"));
-function WavelengthStandardSnackbar({ type, show, icon, horryAlign, vertyAlign, durationSb, width: width2, message, customVertyAlign, toggleShow }) {
+function WavelengthStandardSnackbar({ type, show, icon, horryAlign, vertyAlign, durationSb, width: width2, message, customVertyAlign, toggleShow, closeIcon }) {
   const handleClose = () => {
     toggleShow(false);
   };
@@ -5082,7 +5081,7 @@ function WavelengthStandardSnackbar({ type, show, icon, horryAlign, vertyAlign,
             }
           },
           /* @__PURE__ */ import_react35.default.createElement("div", { style: { marginTop: 4, gridColumnStart: 2, gridColumnEnd: 5, textAlign: "center", display: "flex", flexDirection: "row", justifyContent: "center" }, id: "snackbar" }, /* @__PURE__ */ import_react35.default.createElement("div", null, sIcon), /* @__PURE__ */ import_react35.default.createElement("div", { style: { fontSize: "1rem", marginLeft: "10px" } }, message ? message : "Insert Message Here")),
-          /* @__PURE__ */ import_react35.default.createElement("div", { style: { gridColumnStart: 6 } }, " ", /* @__PURE__ */ import_react35.default.createElement(import_IconButton2.default, { size: "small", "aria-label": "close", color: "inherit" }, /* @__PURE__ */ import_react35.default.createElement(import_Close3.default, { fontSize: "small" })))
+          /* @__PURE__ */ import_react35.default.createElement("div", { style: { gridColumnStart: 6 }, onClick: handleClose }, closeIcon)
         )
       }
     )
@@ -5090,18 +5089,69 @@ function WavelengthStandardSnackbar({ type, show, icon, horryAlign, vertyAlign,
 }
 
 // src/components/snackbars/TestSnackbar.tsx
-var import_material15 = require("@mui/material");
 var import_react36 = __toESM(require("react"));
-var import_Close4 = __toESM(require("@mui/icons-material/Close"));
-function TestSnackbar({ openProp, toggleOpen, Sbduration }) {
-  const handleClose = (event, reason) => {
-    if (reason === "clickaway") {
-      return;
-    }
+var import_material15 = require("@mui/material");
+var useOutsideClick = (callback) => {
+  const ref = (0, import_react36.useRef)(null);
+  (0, import_react36.useEffect)(() => {
+    const handleClickOutside = (event) => {
+      if (ref.current && !ref.current.contains(event.target)) {
+        callback();
+      }
+    };
+    document.addEventListener("mouseup", handleClickOutside);
+    document.addEventListener("touchend", handleClickOutside);
+    return () => {
+      document.removeEventListener("mouseup", handleClickOutside);
+      document.removeEventListener("touchend", handleClickOutside);
+    };
+  }, [callback]);
+  return ref;
+};
+function TestSnackbar({ isPopUpOpen, toggleOpen, type, message, customVertyAlign, width: width2, img }) {
+  const ref = useOutsideClick(() => {
     toggleOpen(false);
-  };
-  const action = /* @__PURE__ */ import_react36.default.createElement(import_react36.default.Fragment, null, /* @__PURE__ */ import_react36.default.createElement(import_material15.Button, { color: "secondary", size: "small", onClick: handleClose }, "UNDO"), /* @__PURE__ */ import_react36.default.createElement(import_material15.IconButton, { size: "small", "aria-label": "close", color: "inherit", onClick: handleClose }, /* @__PURE__ */ import_react36.default.createElement(import_Close4.default, { fontSize: "small" })));
-  return /* @__PURE__ */ import_react36.default.createElement(import_react36.default.Fragment, null, /* @__PURE__ */ import_react36.default.createElement(import_material15.Snackbar, { open: openProp, autoHideDuration: Sbduration, onClose: handleClose, message: "Note archived", action }));
+  });
+  let bgColor = "";
+  if (type == "success") {
+    bgColor = "#25ab21";
+  } else if (type == "error") {
+    bgColor = "#FF4646";
+  } else if (type == "disabled") {
+    bgColor = "#737373";
+  }
+  return /* @__PURE__ */ import_react36.default.createElement(import_react36.default.Fragment, null, isPopUpOpen && /* @__PURE__ */ import_react36.default.createElement(
+    import_material15.Box,
+    {
+      sx: { position: "fixed", right: "auto", top: "24px", left: "50%", transform: "translateX(-50%)" },
+      ref,
+      style: {
+        height: "50px",
+        width: width2,
+        backgroundColor: bgColor,
+        borderRadius: "1px",
+        display: "flex",
+        justifyContent: "space-between",
+        alignItems: "center",
+        paddingRight: "20px",
+        paddingLeft: "20px",
+        zIndex: 2800,
+        marginTop: customVertyAlign ? `${customVertyAlign}` : ""
+      }
+    },
+    /* @__PURE__ */ import_react36.default.createElement("div", { style: { backgroundColor: "red" } }),
+    /* @__PURE__ */ import_react36.default.createElement("div", { style: { color: "white", fontSize: "1rem" } }, message),
+    /* @__PURE__ */ import_react36.default.createElement(
+      import_material15.Button,
+      {
+        variant: "text",
+        onClick: () => {
+          toggleOpen(false);
+        }
+      },
+      img
+    )
+  ));
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -5143,6 +5193,7 @@ function TestSnackbar({ openProp, toggleOpen, Sbduration }) {
   add,
   concat,
   findBestStringMatch,
+  useOutsideClick,
   useThemeContext
 });
 /*! Bundled license information: