@notificationapi/react 0.0.37 → 1.0.1

package/dist/components/Notifications/InboxHeader.d.ts

@@ -1,5 +1,5 @@
 export type InboxHeaderProps = {
-    title?: JSX.Element;
+    title?: React.ReactNode;
     button1ClickHandler?: (ids: string[] | 'ALL') => void;
     button2ClickHandler?: () => void;
 };

package/dist/components/Notifications/InboxHeader.js

@@ -1,55 +1,9 @@
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
-import { T as s, R as d } from "../../assets/index3.js";
-import { P as c } from "../../assets/index.js";
-import { B as a } from "../../assets/button.js";
-import { a as m } from "../../assets/presets.js";
-import * as i from "react";
-import { I as f } from "../../assets/AntdIcon.js";
-var u = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M924.8 625.7l-65.5-56c3.1-19 4.7-38.4 4.7-57.8s-1.6-38.8-4.7-57.8l65.5-56a32.03 32.03 0 009.3-35.2l-.9-2.6a443.74 443.74 0 00-79.7-137.9l-1.8-2.1a32.12 32.12 0 00-35.1-9.5l-81.3 28.9c-30-24.6-63.5-44-99.7-57.6l-15.7-85a32.05 32.05 0 00-25.8-25.7l-2.7-.5c-52.1-9.4-106.9-9.4-159 0l-2.7.5a32.05 32.05 0 00-25.8 25.7l-15.8 85.4a351.86 351.86 0 00-99 57.4l-81.9-29.1a32 32 0 00-35.1 9.5l-1.8 2.1a446.02 446.02 0 00-79.7 137.9l-.9 2.6c-4.5 12.5-.8 26.5 9.3 35.2l66.3 56.6c-3.1 18.8-4.6 38-4.6 57.1 0 19.2 1.5 38.4 4.6 57.1L99 625.5a32.03 32.03 0 00-9.3 35.2l.9 2.6c18.1 50.4 44.9 96.9 79.7 137.9l1.8 2.1a32.12 32.12 0 0035.1 9.5l81.9-29.1c29.8 24.5 63.1 43.9 99 57.4l15.8 85.4a32.05 32.05 0 0025.8 25.7l2.7.5a449.4 449.4 0 00159 0l2.7-.5a32.05 32.05 0 0025.8-25.7l15.7-85a350 350 0 0099.7-57.6l81.3 28.9a32 32 0 0035.1-9.5l1.8-2.1c34.8-41.1 61.6-87.5 79.7-137.9l.9-2.6c4.5-12.3.8-26.3-9.3-35zM788.3 465.9c2.5 15.1 3.8 30.6 3.8 46.1s-1.3 31-3.8 46.1l-6.6 40.1 74.7 63.9a370.03 370.03 0 01-42.6 73.6L721 702.8l-31.4 25.8c-23.9 19.6-50.5 35-79.3 45.8l-38.1 14.3-17.9 97a377.5 377.5 0 01-85 0l-17.9-97.2-37.8-14.5c-28.5-10.8-55-26.2-78.7-45.7l-31.4-25.9-93.4 33.2c-17-22.9-31.2-47.6-42.6-73.6l75.5-64.5-6.5-40c-2.4-14.9-3.7-30.3-3.7-45.5 0-15.3 1.2-30.6 3.7-45.5l6.5-40-75.5-64.5c11.3-26.1 25.6-50.7 42.6-73.6l93.4 33.2 31.4-25.9c23.7-19.5 50.2-34.9 78.7-45.7l37.9-14.3 17.9-97.2c28.1-3.2 56.8-3.2 85 0l17.9 97 38.1 14.3c28.7 10.8 55.4 26.2 79.3 45.8l31.4 25.8 92.8-32.9c17 22.9 31.2 47.6 42.6 73.6L781.8 426l6.5 39.9zM512 326c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm79.2 255.2A111.6 111.6 0 01512 614c-29.9 0-58-11.7-79.2-32.8A111.6 111.6 0 01400 502c0-29.9 11.7-58 32.8-79.2C454 401.6 482.1 390 512 390c29.9 0 58 11.6 79.2 32.8A111.6 111.6 0 01624 502c0 29.9-11.7 58-32.8 79.2z" } }] }, name: "setting", theme: "outlined" }, p = function(l, r) {
-  return /* @__PURE__ */ i.createElement(f, m({}, l, {
-    ref: r,
-    icon: u
-  }));
-}, o = /* @__PURE__ */ i.forwardRef(p);
-process.env.NODE_ENV !== "production" && (o.displayName = "SettingOutlined");
-const R = (e) => {
-  const l = e.title ?? /* @__PURE__ */ t(s.Text, { strong: !0, children: "Notifications" });
-  return /* @__PURE__ */ n(
-    "div",
-    {
-      style: {
-        display: "flex",
-        justifyContent: "space-between",
-        paddingRight: 5
-      },
-      children: [
-        l,
-        /* @__PURE__ */ n("div", { children: [
-          /* @__PURE__ */ t(c, { content: "Resolve all", children: /* @__PURE__ */ t(
-            a,
-            {
-              icon: /* @__PURE__ */ t(d, {}),
-              size: "small",
-              type: "text",
-              onClick: () => {
-                e.button1ClickHandler && e.button1ClickHandler("ALL");
-              }
-            }
-          ) }),
-          /* @__PURE__ */ t(c, { content: "Notification Preferences", children: /* @__PURE__ */ t(
-            a,
-            {
-              icon: /* @__PURE__ */ t(o, {}),
-              size: "small",
-              type: "text",
-              onClick: e.button2ClickHandler
-            }
-          ) })
-        ] })
-      ]
-    }
-  );
-};
+import "react/jsx-runtime";
+import "../../assets/Typography.js";
+import "../../assets/Box.js";
+import { I as a } from "../../assets/InboxHeader.js";
+import "../../assets/IconButton.js";
+import "../../assets/Divider.js";
 export {
-  R as InboxHeader
+  a as InboxHeader
 };

package/dist/components/Notifications/Notification.d.ts

@@ -1,11 +1,10 @@
+import { ReactNode } from 'react';
 import { InAppNotification } from '@notificationapi/core/dist/interfaces';
-import { ImageShape } from './interface';
 
 export type NotificationProps = {
     notifications: InAppNotification[];
     markAsArchived: (ids: string[] | 'ALL') => void;
     markAsClicked: (ids: string[]) => void;
-    imageShape: keyof typeof ImageShape;
-    renderer?: (notification: InAppNotification[]) => JSX.Element;
+    renderer?: (notification: InAppNotification[]) => ReactNode;
 };
-export declare const Notification: (props: NotificationProps) => JSX.Element;
+export declare const Notification: (props: NotificationProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Notifications/Notification.js

@@ -1,8 +1,9 @@
 import "react/jsx-runtime";
-import { N as a } from "../../assets/Notification.js";
-import "../../assets/index3.js";
-import "../../assets/button.js";
-import "../../assets/index2.js";
+import { N as f } from "../../assets/Notification.js";
+import "../../assets/DefaultPropsProvider.js";
+import "../../assets/Typography.js";
+import "../../assets/IconButton.js";
+import "../../assets/Badge.js";
 export {
-  a as Notification
+  f as Notification
 };

package/dist/components/Notifications/NotificationCounter.js

@@ -1,9 +1,19 @@
-import { jsx as n } from "react/jsx-runtime";
-import { UnreadBadge as r } from "./UnreadBadge.js";
-const e = (o) => {
-  const t = o.count || "COUNT_UNOPENED_NOTIFICATIONS";
-  return /* @__PURE__ */ n(r, { ...o, count: t });
+import { jsx as r } from "react/jsx-runtime";
+import { UnreadBadge as n } from "./UnreadBadge.js";
+const N = (t) => {
+  const o = t.count || "COUNT_UNOPENED_NOTIFICATIONS";
+  return /* @__PURE__ */ r(
+    n,
+    {
+      ...t,
+      count: o,
+      offset: {
+        top: 0,
+        right: 0
+      }
+    }
+  );
 };
 export {
-  e as NotificationCounter
+  N as NotificationCounter
 };

package/dist/components/Notifications/NotificationFeed.d.ts

@@ -1,10 +1,9 @@
 import { NotificationProps } from './Notification';
 import { InboxHeaderProps } from './InboxHeader';
 import { InAppNotification } from '@notificationapi/core/dist/interfaces';
-import { Filter, ImageShape, Pagination } from './interface';
+import { Filter, Pagination } from './interface';
 
 export type NotificationFeedProps = {
-    imageShape?: keyof typeof ImageShape;
     pagination?: keyof typeof Pagination;
     pageSize?: number;
     pagePosition?: 'top' | 'bottom';

package/dist/components/Notifications/NotificationFeed.js

@@ -1,70 +1,73 @@
-import { jsxs as s, jsx as n } from "react/jsx-runtime";
-import { useState as d, useContext as m, useEffect as h } from "react";
-import { Inbox as u } from "./Inbox.js";
-import { NotificationAPIContext as p } from "../Provider/index.js";
-import { NotificationPreferencesPopup as x } from "../Preferences/NotificationPreferencesPopup.js";
-import { D as S } from "../../assets/PreferenceInput.js";
-import { W as I, R as b } from "../../assets/WebPushOptInMessage.js";
-import { Filter as P } from "./interface.js";
-const L = (e) => {
-  var o, a, l, f;
-  const [c, r] = d(!1), i = m(p);
+import { jsx as n, jsxs as l } from "react/jsx-runtime";
+import { useState as g, useContext as m, useEffect as h } from "react";
+import { I as u } from "../../assets/Inbox.js";
+import { NotificationAPIContext as p } from "../Provider/context.js";
+import { N as x } from "../../assets/NotificationPreferencesPopup.js";
+import { Filter as S } from "./interface.js";
+import { W as I } from "../../assets/WebPushOptInMessage.js";
+import { c as b } from "../../assets/createSvgIcon.js";
+import { D as C } from "../../assets/Divider.js";
+const H = b(/* @__PURE__ */ n("path", {
+  d: "M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2m6.93 6h-2.95c-.32-1.25-.78-2.45-1.38-3.56 1.84.63 3.37 1.91 4.33 3.56M12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96M4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2s.06 1.34.14 2zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56-1.84-.63-3.37-1.9-4.33-3.56m2.95-8H5.08c.96-1.66 2.49-2.93 4.33-3.56C8.81 5.55 8.35 6.75 8.03 8M12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96M14.34 14H9.66c-.09-.66-.16-1.32-.16-2s.07-1.35.16-2h4.68c.09.65.16 1.32.16 2s-.07 1.34-.16 2m.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95c-.96 1.65-2.49 2.93-4.33 3.56M16.36 14c.08-.66.14-1.32.14-2s-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2z"
+}), "Language"), N = (e) => {
+  var o, a, c, s;
+  const [f, r] = g(!1), t = m(p);
   if (h(() => {
-    if (!i) return;
-    i.markAsOpened();
-    const g = setInterval(() => {
-      i.markAsOpened();
+    if (!t) return;
+    t.markAsOpened();
+    const d = setInterval(() => {
+      t.markAsOpened();
     }, 5e3);
-    return () => clearInterval(g);
-  }, [i]), !i)
+    return () => clearInterval(d);
+  }, [t]), !t)
     return null;
-  const t = {
-    imageShape: e.imageShape || "circle",
+  const i = {
     pagination: e.pagination || "INFINITE_SCROLL",
-    pageSize: e.pageSize || 10,
+    pageSize: e.pageSize || 5,
     pagePosition: e.pagePosition || "top",
     style: e.style || {},
-    filter: e.filter || P.ALL,
+    filter: e.filter || S.ALL,
     infiniteScrollHeight: e.infiniteScrollHeight ? e.infiniteScrollHeight : window.innerHeight * 0.75,
     renderers: {
       notification: (o = e.renderers) == null ? void 0 : o.notification
     },
     header: {
       title: (a = e.header) == null ? void 0 : a.title,
-      button1ClickHandler: ((l = e.header) == null ? void 0 : l.button1ClickHandler) ?? i.markAsArchived,
-      button2ClickHandler: ((f = e.header) == null ? void 0 : f.button2ClickHandler) ?? (() => r(!0))
+      button1ClickHandler: ((c = e.header) == null ? void 0 : c.button1ClickHandler) ?? t.markAsArchived,
+      button2ClickHandler: ((s = e.header) == null ? void 0 : s.button2ClickHandler) ?? (() => r(!0))
     }
   };
-  return /* @__PURE__ */ s(
+  return /* @__PURE__ */ l(
     "div",
     {
       style: {
-        padding: 12,
+        padding: "0 12px",
         boxSizing: "border-box",
+        borderRadius: 8,
         background: "#fff",
+        border: "1px solid #dcdcdc",
         ...e.style
       },
       children: [
         /* @__PURE__ */ n(
           u,
           {
-            maxHeight: t.infiniteScrollHeight,
-            pagination: t.pagination,
-            filter: t.filter,
-            imageShape: t.imageShape,
-            pageSize: t.pageSize,
-            pagePosition: t.pagePosition,
-            notificationRenderer: t.renderers.notification,
-            header: t.header
+            maxHeight: i.infiniteScrollHeight,
+            pagination: i.pagination,
+            filter: i.filter,
+            pageSize: i.pageSize,
+            pagePosition: i.pagePosition,
+            notificationRenderer: i.renderers.notification,
+            header: i.header
           }
         ),
-        i.webPushOptInMessage && localStorage.getItem("hideWebPushOptInMessage") !== "true" && /* @__PURE__ */ s("div", { children: [
-          /* @__PURE__ */ n(S, { style: { margin: "10px 0" } }),
+        t.webPushOptInMessage && localStorage.getItem("hideWebPushOptInMessage") !== "true" && /* @__PURE__ */ l("div", { children: [
+          /* @__PURE__ */ n(C, { style: { margin: "10px 0" } }),
           /* @__PURE__ */ n(
             I,
             {
               hideAfterInteraction: !0,
-              icon: /* @__PURE__ */ n(b, { type: "text", style: { marginLeft: "9px" } }),
+              icon: /* @__PURE__ */ n(H, { type: "text", style: { marginLeft: "9px" } }),
               descriptionStyle: {
                 flexDirection: "column",
                 // Stack the elements vertically
@@ -88,7 +91,7 @@ const L = (e) => {
         /* @__PURE__ */ n(
           x,
           {
-            open: c,
+            open: f,
             onClose: () => r(!1)
           }
         )
@@ -97,5 +100,5 @@ const L = (e) => {
   );
 };
 export {
-  L as NotificationFeed
+  N as NotificationFeed
 };

package/dist/components/Notifications/NotificationLauncher.d.ts

@@ -5,6 +5,7 @@ type NotificationLaucherProps = NotificationPopupProps & {
     position?: keyof typeof Position;
     offsetX?: number | string;
     offsetY?: number | string;
+    buttonStyles?: React.CSSProperties;
 };
 export declare const NotificationLauncher: React.FC<NotificationLaucherProps>;
 export {};

package/dist/components/Notifications/NotificationLauncher.js

@@ -1,148 +1,134 @@
-import { jsx as i, jsxs as o, Fragment as h } from "react/jsx-runtime";
-import { Inbox as g } from "./Inbox.js";
-import { UnreadBadge as m } from "./UnreadBadge.js";
-import { useState as s, useContext as b } from "react";
-import { NotificationAPIContext as I } from "../Provider/index.js";
-import { NotificationPreferencesPopup as p } from "../Preferences/NotificationPreferencesPopup.js";
-import { D as x } from "../../assets/PreferenceInput.js";
-import { W as P, R as S } from "../../assets/WebPushOptInMessage.js";
-import { R as C } from "../../assets/channelUtils.js";
-import { P as W } from "../../assets/index.js";
-import { B as O } from "../../assets/button.js";
-const w = (t) => {
-  var r, d, c, u;
-  const [f, a] = s(!1), n = b(I);
+import { jsx as o, jsxs as a } from "react/jsx-runtime";
+import { useState as c, useContext as b } from "react";
+import { I as P } from "../../assets/Inbox.js";
+import { UnreadBadge as x } from "./UnreadBadge.js";
+import { NotificationAPIContext as C } from "../Provider/context.js";
+import { N as O } from "../../assets/NotificationPreferencesPopup.js";
+import { W as S, L as y } from "../../assets/WebPushOptInMessage.js";
+import { N } from "../../assets/channelUtils.js";
+import { I as z } from "../../assets/IconButton.js";
+import { P as k } from "../../assets/Popover.js";
+import { D as A } from "../../assets/Divider.js";
+const D = (e) => {
+  var d, f, u, h;
+  const [g, l] = c(!1), [i, s] = c(!1), n = b(C), [m, p] = c(null);
   if (!n)
     return null;
-  const e = {
-    buttonIcon: t.buttonIcon || /* @__PURE__ */ i(
-      C,
+  const t = {
+    buttonIcon: e.buttonIcon || /* @__PURE__ */ o(
+      N,
       {
         style: {
-          fontSize: t.buttonIconSize || (t.buttonWidth ? t.buttonWidth / 2 : 20),
-          color: t.iconColor || "#000000"
+          fontSize: e.buttonIconSize || 20,
+          color: e.iconColor || "#000000"
         }
       }
     ),
-    buttonWidth: t.buttonWidth || 40,
-    buttonHeight: t.buttonHeight || 40,
-    popupWidth: t.popupWidth || 400,
-    popupHeight: t.popupHeight || 600,
-    buttonIconSize: t.buttonIconSize || (t.buttonWidth ? t.buttonWidth / 2 : 20),
-    imageShape: t.imageShape || "circle",
-    iconColor: t.iconColor || "#000000",
-    pagination: t.pagination || "INFINITE_SCROLL",
-    pageSize: t.pageSize || 10,
-    pagePosition: t.pagePosition || "top",
-    popupZIndex: t.popupZIndex || 1030,
-    unreadBadgeProps: t.unreadBadgeProps ?? {},
-    offsetX: t.offsetX || 16,
-    offsetY: t.offsetY || 16,
-    position: t.position || "BOTTOM_RIGHT",
-    count: t.count || "COUNT_UNOPENED_NOTIFICATIONS",
-    filter: t.filter || "ALL",
+    buttonStyles: {
+      width: 40,
+      height: 40,
+      ...e.buttonStyles
+    },
+    popupWidth: e.popupWidth || 400,
+    popupHeight: e.popupHeight || 600,
+    buttonIconSize: e.buttonIconSize || 20,
+    iconColor: e.iconColor || "#000000",
+    pagination: e.pagination || "INFINITE_SCROLL",
+    pageSize: e.pageSize || 10,
+    pagePosition: e.pagePosition || "top",
+    popupZIndex: e.popupZIndex || 1030,
+    unreadBadgeProps: e.unreadBadgeProps ?? {},
+    offsetX: e.offsetX || 16,
+    offsetY: e.offsetY || 16,
+    position: e.position || "BOTTOM_RIGHT",
+    count: e.count || "COUNT_UNOPENED_NOTIFICATIONS",
+    filter: e.filter || "ALL",
     header: {
-      title: (r = t.header) == null ? void 0 : r.title,
-      button1ClickHandler: ((d = t.header) == null ? void 0 : d.button1ClickHandler) ?? n.markAsArchived,
-      button2ClickHandler: ((c = t.header) == null ? void 0 : c.button2ClickHandler) ?? (() => a(!0))
+      title: (d = e.header) == null ? void 0 : d.title,
+      button1ClickHandler: ((f = e.header) == null ? void 0 : f.button1ClickHandler) ?? n.markAsArchived,
+      button2ClickHandler: ((u = e.header) == null ? void 0 : u.button2ClickHandler) ?? (() => l(!0))
     },
     renderers: {
-      notification: (u = t.renderers) == null ? void 0 : u.notification
+      notification: (h = e.renderers) == null ? void 0 : h.notification
     }
+  }, I = (r) => {
+    s(!i), p(r == null ? void 0 : r.currentTarget), i && n.markAsOpened();
   };
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ a(
     "div",
     {
       style: {
         position: "fixed",
-        right: e.offsetX,
-        bottom: e.offsetY,
-        zIndex: 9999
+        right: t.offsetX,
+        bottom: t.offsetY,
+        zIndex: 999
       },
       children: [
-        /* @__PURE__ */ i(
-          W,
+        /* @__PURE__ */ o(
+          "div",
+          {
+            style: {
+              display: "inline-block"
+            },
+            children: /* @__PURE__ */ o(x, { ...e.unreadBadgeProps, count: t.count, children: /* @__PURE__ */ o(z, { style: t.buttonStyles, onClick: I, children: t.buttonIcon }) })
+          }
+        ),
+        /* @__PURE__ */ a(
+          k,
           {
-            autoAdjustOverflow: !0,
-            trigger: "click",
-            content: /* @__PURE__ */ o(h, { children: [
-              /* @__PURE__ */ i(
-                g,
+            open: i,
+            anchorEl: m,
+            anchorReference: "anchorEl",
+            anchorOrigin: {
+              horizontal: "center",
+              vertical: "top"
+            },
+            transformOrigin: {
+              vertical: "bottom",
+              horizontal: "center"
+            },
+            onClose: () => s(!1),
+            slotProps: {
+              paper: {
+                style: {
+                  width: t.popupWidth,
+                  padding: "0 16px",
+                  borderRadius: 8
+                }
+              }
+            },
+            children: [
+              /* @__PURE__ */ o(
+                P,
                 {
                   maxHeight: 500,
-                  pagination: e.pagination,
-                  filter: e.filter,
-                  imageShape: e.imageShape,
-                  pageSize: e.pageSize,
-                  pagePosition: e.pagePosition,
-                  notificationRenderer: e.renderers.notification,
-                  header: e.header
+                  pagination: t.pagination,
+                  filter: t.filter,
+                  pageSize: t.pageSize,
+                  pagePosition: t.pagePosition,
+                  notificationRenderer: t.renderers.notification,
+                  header: t.header
                 }
               ),
-              n.webPushOptInMessage && localStorage.getItem("hideWebPushOptInMessage") !== "true" && /* @__PURE__ */ o("div", { children: [
-                /* @__PURE__ */ i(x, { style: { margin: "10px 0" } }),
-                /* @__PURE__ */ i(
-                  P,
+              n.webPushOptInMessage && localStorage.getItem("hideWebPushOptInMessage") !== "true" && /* @__PURE__ */ a("div", { children: [
+                /* @__PURE__ */ o(A, { style: { margin: "10px 0" } }),
+                /* @__PURE__ */ o(
+                  S,
                   {
                     hideAfterInteraction: !0,
-                    icon: /* @__PURE__ */ i(
-                      S,
-                      {
-                        type: "text",
-                        style: { marginLeft: "9px" }
-                      }
-                    ),
+                    icon: /* @__PURE__ */ o(y, { type: "text", style: { marginLeft: "9px" } }),
                     alertContainerStyle: { maxWidth: "345px" }
                   }
                 )
               ] })
-            ] }),
-            arrow: !1,
-            overlayStyle: {
-              padding: "0 16px",
-              minWidth: e.popupWidth
-            },
-            onOpenChange: (l) => {
-              l && n.markAsOpened();
-            },
-            children: /* @__PURE__ */ i(
-              "div",
-              {
-                style: {
-                  display: "inline-block"
-                },
-                children: /* @__PURE__ */ i(
-                  m,
-                  {
-                    ...t.unreadBadgeProps,
-                    style: {
-                      top: 5,
-                      right: 5
-                    },
-                    count: e.count,
-                    children: /* @__PURE__ */ i(
-                      O,
-                      {
-                        icon: e.buttonIcon,
-                        style: {
-                          width: e.buttonWidth,
-                          height: e.buttonHeight
-                        },
-                        shape: "circle",
-                        type: "default"
-                      }
-                    )
-                  }
-                )
-              }
-            )
+            ]
           }
         ),
-        /* @__PURE__ */ i(
-          p,
+        /* @__PURE__ */ o(
+          O,
           {
-            open: f,
-            onClose: () => a(!1)
+            open: g,
+            onClose: () => l(!1)
           }
         )
       ]
@@ -150,5 +136,5 @@ const w = (t) => {
   );
 };
 export {
-  w as NotificationLauncher
+  D as NotificationLauncher
 };

package/dist/components/Notifications/NotificationPopup.d.ts

@@ -1,17 +1,16 @@
+import { default as React } from 'react';
 import { UnreadBadgeProps } from './UnreadBadge';
 import { NotificationProps } from './Notification';
 import { InAppNotification } from '@notificationapi/core/dist/interfaces';
 import { InboxHeaderProps } from './InboxHeader';
-import { Filter, ImageShape, Pagination } from './interface';
+import { Filter, Pagination } from './interface';
 
 export type NotificationPopupProps = {
     buttonIcon?: React.ReactNode;
     buttonIconSize?: number;
-    buttonWidth?: number;
-    buttonHeight?: number;
+    buttonStyles?: React.CSSProperties;
     popupWidth?: number | string;
     popupHeight?: number;
-    imageShape?: keyof typeof ImageShape;
     iconColor?: string;
     pagination?: keyof typeof Pagination;
     pageSize?: number;