@edusight/notification-widget 1.0.41 → 1.0.44

package/dist/index.esm.js

@@ -1,52 +1,52 @@
-import { jsx as u, jsxs as A } from "react/jsx-runtime";
-import { NotificationClient as $ } from "@edusight/notification-sdk";
-import F, { useState as v, useCallback as T, useEffect as k, Component as j, createContext as J, useReducer as G, useRef as Q, useContext as X } from "react";
-import { io as Y } from "socket.io-client";
-import { u as Z, c as K } from "./hooks-S0z2_-4B.js";
-import { M as ee, a as te, C as x, B as P, S as ne, I as re, L as ie } from "./components-CWbjrQKA.js";
-import { N as Ce, P as ve } from "./components-CWbjrQKA.js";
-const oe = () => window.__notificationSDK?.client, ae = ({
+import { jsx as f, jsxs as A } from "react/jsx-runtime";
+import { NotificationClient as G } from "@edusight/notification-sdk";
+import L, { useState as v, useCallback as T, useEffect as k, Component as Q, createContext as X, useReducer as Y, useRef as Z, useContext as ee } from "react";
+import { io as te } from "socket.io-client";
+import { u as ne, c as P } from "./hooks-S0z2_-4B.js";
+import { M as re, a as ie, C as D, B as R, S as oe, I as ae, L as se } from "./components-DUT08KJF.js";
+import { N as Oe, P as xe } from "./components-DUT08KJF.js";
+const ce = () => window.__notificationSDK?.client, le = ({
   onPreferencesLoaded: t,
   onError: n
 }) => {
-  const f = oe(), [h, a] = v(!0), [l, s] = v(null), [r, d] = v(null), m = T(async () => {
+  const u = ce(), [h, a] = v(!0), [d, s] = v(null), [r, l] = v(null), y = T(async () => {
     try {
-      if (a(!0), s(null), !f)
+      if (a(!0), s(null), !u)
         throw new Error("Notification client not available");
       const p = window.__notificationSDK?.config;
       if (!p)
         throw new Error("SDK configuration not available");
-      const { subscriberId: E, tenantId: I, environmentId: b } = p;
-      if (!E || !I || !b)
+      const { subscriberId: g, tenantId: b, environmentId: I } = p;
+      if (!g || !b || !I)
         throw new Error("SubscriberId, TenantId or EnvironmentId not available in config");
-      const w = await f.preferences.get(
-        I,
-        E,
-        b
+      const S = await u.preferences.get(
+        b,
+        g,
+        I
       );
       let c = null;
       try {
-        c = await f.preferences.getSchedule(
-          I,
-          E,
-          b
+        c = await u.preferences.getSchedule(
+          b,
+          g,
+          I
         );
       } catch {
       }
       const N = {
         channels: {
-          email: w.emailEnabled ?? !0,
-          push: w.pushEnabled ?? !0,
-          sms: w.smsEnabled ?? !1,
-          inApp: w.inAppEnabled ?? !0
+          email: S.emailEnabled ?? !0,
+          push: S.pushEnabled ?? !0,
+          sms: S.smsEnabled ?? !1,
+          inApp: S.inAppEnabled ?? !0
         },
         subscriptions: [],
         deliverySchedule: {
           enabled: c?.isEnabled || !1,
           timezone: "UTC",
           quietHours: {
-            start: w.quietHoursStart ?? "22:00",
-            end: w.quietHoursEnd ?? "08:00"
+            start: S.quietHoursStart ?? "22:00",
+            end: S.quietHoursEnd ?? "08:00"
           },
           weekdays: c?.weeklySchedule ? [
             !!c.weeklySchedule.monday,
@@ -60,7 +60,7 @@ const oe = () => window.__notificationSDK?.client, ae = ({
           weeklySchedule: c?.weeklySchedule || void 0
         }
       };
-      w.categories && Object.entries(w.categories).forEach(([C, _]) => {
+      S.categories && Object.entries(S.categories).forEach(([C, _]) => {
         N.subscriptions.push({
           workflowId: C,
           name: C,
@@ -72,11 +72,11 @@ const oe = () => window.__notificationSDK?.client, ae = ({
             inApp: _.inAppEnabled ?? !0
           }
         });
-      }), d(N), t(N);
+      }), l(N), t(N);
     } catch (p) {
-      const E = p instanceof Error ? p : new Error("Failed to load preferences");
-      p?.response?.status === 404 || p?.status === 404 || (s(E), n?.(E));
-      const b = {
+      const g = p instanceof Error ? p : new Error("Failed to load preferences");
+      p?.response?.status === 404 || p?.status === 404 || (s(g), n?.(g));
+      const I = {
         channels: {
           email: !0,
           push: !0,
@@ -94,62 +94,62 @@ const oe = () => window.__notificationSDK?.client, ae = ({
           weekdays: [!0, !0, !0, !0, !0, !1, !1]
         }
       };
-      d(b), t(b);
+      l(I), t(I);
     } finally {
       a(!1);
     }
-  }, [f, t, n]);
+  }, [u, t, n]);
   return k(() => {
-    f && m();
-  }, [f, m]), {
+    u && y();
+  }, [u, y]), {
     isLoading: h,
-    error: l,
+    error: d,
     preferences: r
   };
-}, se = () => window.__notificationSDK?.client, ce = () => {
-  const t = se(), [n, f] = v([]), [h, a] = v(!1), [l, s] = v(!0), [r, d] = v(0), m = 5, p = T(async () => {
-    if (!(!t || h || !l))
+}, de = () => window.__notificationSDK?.client, fe = () => {
+  const t = de(), [n, u] = v([]), [h, a] = v(!1), [d, s] = v(!0), [r, l] = v(0), y = 5, p = T(async () => {
+    if (!(!t || h || !d))
       try {
         a(!0);
-        const I = window.__notificationSDK?.config;
-        if (!I) return;
-        const b = await t.preferences.listSpecific(
-          I.tenantId,
-          I.subscriberId,
+        const b = window.__notificationSDK?.config;
+        if (!b) return;
+        const I = await t.preferences.listSpecific(
+          b.tenantId,
+          b.subscriberId,
           {
             includeWorkflows: !0,
             includeTemplates: !1,
             activeOnly: !0,
-            limit: m,
+            limit: y,
             offset: r
           }
-        ), w = (b.items || []).map((c) => ({
+        ), S = (I.items || []).map((c) => ({
           workflowId: c.identifier,
           name: c.name,
           enabled: c.preference.enabled,
           channels: c.preference.channels
         }));
-        f((c) => {
-          const N = new Set(c.map((_) => _.workflowId)), C = w.filter((_) => !N.has(_.workflowId));
+        u((c) => {
+          const N = new Set(c.map((_) => _.workflowId)), C = S.filter((_) => !N.has(_.workflowId));
           return [...c, ...C];
-        }), d((c) => c + m), (w.length < m || b.total !== void 0 && n.length + w.length >= b.total) && s(!1);
+        }), l((c) => c + y), (S.length < y || I.total !== void 0 && n.length + S.length >= I.total) && s(!1);
       } catch {
       } finally {
         a(!1);
       }
-  }, [t, r, l, h, n.length]);
+  }, [t, r, d, h, n.length]);
   return k(() => {
     t && r === 0 && n.length === 0 && p();
   }, [t, p, r, n.length]), {
     specificPreferences: n,
     isLoading: h,
-    hasMore: l,
+    hasMore: d,
     loadMore: p,
     refetch: async () => {
-      f([]), d(0), s(!0);
+      u([]), l(0), s(!0);
     }
   };
-}, de = ({ error: t, onRetry: n }) => /* @__PURE__ */ A(
+}, ue = ({ error: t, onRetry: n }) => /* @__PURE__ */ A(
   "div",
   {
     className: "p-4 bg-[var(--widget-error)]/10 border border-[var(--widget-error)]/20 rounded-lg",
@@ -157,12 +157,12 @@ const oe = () => window.__notificationSDK?.client, ae = ({
     "data-testid": "error-boundary-fallback",
     children: [
       /* @__PURE__ */ A("div", { className: "flex items-center mb-2", children: [
-        /* @__PURE__ */ u(ee, { className: "w-6 h-6 text-[var(--widget-error)] mr-2", "aria-hidden": "true" }),
-        /* @__PURE__ */ u("h3", { className: "text-sm font-medium text-[var(--widget-error)]", children: "Something went wrong" })
+        /* @__PURE__ */ f(re, { className: "w-6 h-6 text-[var(--widget-error)] mr-2", "aria-hidden": "true" }),
+        /* @__PURE__ */ f("h3", { className: "text-sm font-medium text-[var(--widget-error)]", children: "Something went wrong" })
       ] }),
-      /* @__PURE__ */ u("p", { className: "text-sm mb-3 text-[var(--widget-error)]/80", children: "The notification widget encountered an error and couldn't load properly." }),
+      /* @__PURE__ */ f("p", { className: "text-sm mb-3 text-[var(--widget-error)]/80", children: "The notification widget encountered an error and couldn't load properly." }),
       process.env.NODE_ENV === "development" && t && /* @__PURE__ */ A("details", { className: "mb-3", children: [
-        /* @__PURE__ */ u("summary", { className: "text-xs cursor-pointer text-[var(--widget-error)] hover:text-[var(--widget-error)]/80 transition-colors", children: "Error details (development only)" }),
+        /* @__PURE__ */ f("summary", { className: "text-xs cursor-pointer text-[var(--widget-error)] hover:text-[var(--widget-error)]/80 transition-colors", children: "Error details (development only)" }),
         /* @__PURE__ */ A("pre", { className: "mt-2 text-xs bg-[var(--widget-error)]/5 p-2 rounded overflow-auto max-h-32 text-[var(--widget-error)]", children: [
           t.message,
           t.stack && `
@@ -178,7 +178,7 @@ ${t.stack}`
           onClick: n,
           "data-testid": "error-retry-button",
           children: [
-            /* @__PURE__ */ u(te, { className: "mr-1 w-4 h-4", "aria-hidden": "true" }),
+            /* @__PURE__ */ f(ie, { className: "mr-1 w-4 h-4", "aria-hidden": "true" }),
             "Try again"
           ]
         }
@@ -186,7 +186,7 @@ ${t.stack}`
     ]
   }
 );
-class le extends j {
+class pe extends Q {
   constructor(n) {
     super(n), this.handleRetry = () => {
       this.setState({
@@ -206,21 +206,21 @@ class le extends j {
       error: n
     };
   }
-  componentDidCatch(n, f) {
+  componentDidCatch(n, u) {
     this.setState({
-      errorInfo: f
-    }), this.props.onError && this.props.onError(n, f);
+      errorInfo: u
+    }), this.props.onError && this.props.onError(n, u);
   }
   render() {
-    return this.state.hasError ? /* @__PURE__ */ u(de, { error: this.state.error, onRetry: this.handleRetry }) : this.props.children;
+    return this.state.hasError ? /* @__PURE__ */ f(ue, { error: this.state.error, onRetry: this.handleRetry }) : this.props.children;
   }
 }
-const L = J(null), ue = () => {
-  const t = X(L);
+const U = X(null), me = () => {
+  const t = ee(U);
   if (!t)
     throw new Error("useSDK must be used within a NotificationWidget");
   return t;
-}, fe = {
+}, he = {
   notifications: [],
   unreadCount: 0,
   preferences: {
@@ -251,11 +251,11 @@ const L = J(null), ue = () => {
     connected: !1,
     reconnecting: !1
   }
-}, pe = ({
+}, we = ({
   config: t,
   children: n
 }) => {
-  const [f, h] = F.useState({
+  const [u, h] = L.useState({
     client: null,
     isInitialized: !1,
     error: null
@@ -273,7 +273,7 @@ const L = J(null), ue = () => {
           });
           return;
         }
-        const r = new $({
+        const r = new G({
           apiUrl: t.baseUrl,
           apiKey: t.apiKey,
           tenantId: t.tenantId,
@@ -294,37 +294,37 @@ const L = J(null), ue = () => {
     })(), () => {
       a = !1;
     };
-  }, [t]), /* @__PURE__ */ u(L.Provider, { value: f, children: n });
-}, he = (t, n) => {
+  }, [t]), /* @__PURE__ */ f(U.Provider, { value: u, children: n });
+}, ye = (t, n) => {
   switch (n.type) {
     case "SET_NOTIFICATIONS":
       return {
         ...t,
         notifications: n.payload,
-        unreadCount: n.payload.filter((l) => !l.isRead).length
+        unreadCount: n.payload.filter((d) => !d.isRead).length
       };
     case "ADD_NOTIFICATION":
-      const f = [n.payload, ...t.notifications];
+      const u = [n.payload, ...t.notifications];
       return {
         ...t,
-        notifications: f,
-        unreadCount: f.filter((l) => !l.isRead).length
+        notifications: u,
+        unreadCount: u.filter((d) => !d.isRead).length
       };
     case "UPDATE_NOTIFICATION":
       const h = t.notifications.map(
-        (l) => l.id === n.payload.id ? { ...l, ...n.payload.updates } : l
+        (d) => d.id === n.payload.id ? { ...d, ...n.payload.updates } : d
       );
       return {
         ...t,
         notifications: h,
-        unreadCount: h.filter((l) => !l.isRead).length
+        unreadCount: h.filter((d) => !d.isRead).length
       };
     case "DELETE_NOTIFICATION":
-      const a = t.notifications.filter((l) => l.id !== n.payload);
+      const a = t.notifications.filter((d) => d.id !== n.payload);
       return {
         ...t,
         notifications: a,
-        unreadCount: a.filter((l) => !l.isRead).length
+        unreadCount: a.filter((d) => !d.isRead).length
       };
     case "SET_PREFERENCES":
       return {
@@ -344,52 +344,52 @@ const L = J(null), ue = () => {
     default:
       return t;
   }
-}, me = ({
+}, Se = ({
   position: t = "right",
   size: n = "medium",
-  theme: f = "light",
+  theme: u = "light",
   className: h = "",
   onError: a,
-  onMorePreferencesClick: l
+  onMorePreferencesClick: d
 }) => {
-  const [s, r] = G(he, fe), { client: d, isInitialized: m, error: p } = ue(), E = Q(null), I = T((e) => {
+  const [s, r] = Y(ye, he), { client: l, isInitialized: y, error: p } = me(), g = Z(null), b = T((e) => {
     r({
       type: "SET_PREFERENCES",
       payload: e
     });
-  }, []), b = T(
+  }, []), I = T(
     (e) => {
       a && a(e);
     },
     [a]
-  ), { error: w } = ae({
-    onPreferencesLoaded: I,
-    onError: b
+  ), { error: S } = le({
+    onPreferencesLoaded: b,
+    onError: I
   }), {
     specificPreferences: c,
     isLoading: N,
     hasMore: C,
     loadMore: _
-  } = ce(), {
-    updatePreference: U,
-    isSaving: D,
-    error: R
-  } = Z({
+  } = fe(), {
+    updatePreference: W,
+    isSaving: K,
+    error: F
+  } = ne({
     preferences: s.preferences,
-    onPreferencesChange: I,
-    onError: b
+    onPreferencesChange: b,
+    onError: I
   });
   k(() => {
     if (c.length > 0) {
       const i = [...s.preferences.subscriptions];
       let o = !1;
-      c.forEach((g) => {
-        const y = i.findIndex((S) => S.workflowId === g.workflowId);
-        if (y === -1)
-          i.push(g), o = !0;
+      c.forEach((E) => {
+        const m = i.findIndex((w) => w.workflowId === E.workflowId);
+        if (m === -1)
+          i.push(E), o = !0;
         else {
-          const S = i[y];
-          S.name === S.workflowId && g.name && g.name !== g.workflowId && (i[y] = { ...S, name: g.name }, o = !0);
+          const w = i[m];
+          w.name === w.workflowId && E.name && E.name !== E.workflowId && (i[m] = { ...w, name: E.name }, o = !0);
         }
       }), o && r({
         type: "SET_PREFERENCES",
@@ -400,18 +400,18 @@ const L = J(null), ue = () => {
       });
     }
   }, [c]);
-  const W = F.useMemo(() => c.map((e) => s.preferences.subscriptions.find((o) => o.workflowId === e.workflowId) || e), [c, s.preferences.subscriptions]), O = T((e) => {
+  const M = L.useMemo(() => c.map((e) => s.preferences.subscriptions.find((o) => o.workflowId === e.workflowId) || e), [c, s.preferences.subscriptions]), x = T((e) => {
     try {
-      const i = K();
+      const i = P();
       switch (e.type) {
         case "notification_received": {
           const o = e.data;
           if (!i.validateWebSocketPayload(o))
             break;
-          const g = i.toWidgetNotificationFromWebSocket(o);
+          const E = i.toWidgetNotificationFromWebSocket(o);
           r({
             type: "ADD_NOTIFICATION",
-            payload: g
+            payload: E
           });
           break;
         }
@@ -440,8 +440,8 @@ const L = J(null), ue = () => {
       }
     } catch {
     }
-  }, []), M = T(async () => {
-    if (!(!d || !m || E.current))
+  }, []), B = T(async () => {
+    if (!(!l || !y || g.current))
       try {
         r({
           type: "SET_WEBSOCKET_STATE",
@@ -450,61 +450,70 @@ const L = J(null), ue = () => {
         const e = window.__notificationSDK?.config;
         if (!e)
           throw new Error("SDK configuration not available for WebSocket connection");
-        const g = `${d.getApiHost()}/v1/notifications`, y = Y(g, {
+        const E = `${l.getApiHost()}/v1/notifications`, m = te(E, {
           query: {
             tenantId: e.tenantId,
             subscriberId: e.subscriberId,
             environmentId: e.environmentId
           },
-          transports: ["websocket"],
+          transports: ["websocket", "polling"],
           autoConnect: !1,
           reconnection: !0,
           reconnectionAttempts: 10,
           reconnectionDelay: 1e3,
           reconnectionDelayMax: 5e3
         });
-        E.current = y, y.on("notification", (S) => {
-          O({
+        g.current = m;
+        let w = null;
+        const j = () => {
+          w && clearInterval(w), w = setInterval(() => {
+            m.connected && m.emit("ping", { timestamp: Date.now() });
+          }, 3e3);
+        }, J = () => {
+          w && (clearInterval(w), w = null);
+        };
+        m.on("notification", (O) => {
+          x({
             type: "notification_received",
-            data: S
+            data: O
           });
-        }), y.on("connect", () => {
+        }), m.on("connect", () => {
           r({
             type: "SET_WEBSOCKET_STATE",
             payload: { connected: !0, reconnecting: !1 }
-          });
-        }), y.on("disconnect", (S) => {
+          }), j();
+        }), m.on("disconnect", (O) => {
           r({
             type: "SET_WEBSOCKET_STATE",
             payload: { connected: !1, reconnecting: !1 }
-          });
-        }), y.on("reconnect_attempt", (S) => {
+          }), J();
+        }), m.on("reconnect_attempt", (O) => {
           r({
             type: "SET_WEBSOCKET_STATE",
             payload: { connected: !1, reconnecting: !0 }
           });
-        }), y.on("connect_error", (S) => {
+        }), m.on("connect_error", (O) => {
           r({
             type: "SET_WEBSOCKET_STATE",
             payload: { connected: !1, reconnecting: !1 }
-          }), a && a(S);
-        }), y.connect();
+          }), a && a(O);
+        }), m.connect();
       } catch (e) {
         r({
           type: "SET_WEBSOCKET_STATE",
           payload: { connected: !1, reconnecting: !1 }
         }), a && a(e);
       }
-  }, [d, m, O, a]), B = T(() => {
-    if (E.current)
+  }, [l, y, x, a]), V = T(() => {
+    if (g.current)
       try {
-        E.current.disconnect && E.current.disconnect(), E.current = null, r({
+        g.current.disconnect && g.current.disconnect(), g.current = null, r({
           type: "SET_WEBSOCKET_STATE",
           payload: { connected: !1, reconnecting: !1 }
         });
       } catch {
       }
-  }, []), V = T(() => {
+  }, []), H = T(() => {
     r({
       type: "SET_UI_STATE",
       payload: { isOpen: !s.ui.isOpen }
@@ -519,9 +528,9 @@ const L = J(null), ue = () => {
       type: "SET_UI_STATE",
       payload: { currentView: e }
     });
-  }, []), H = T(
+  }, []), $ = T(
     async (e, i) => {
-      if (!d || !m)
+      if (!l || !y)
         return;
       const o = window.__notificationSDK?.config;
       if (o) {
@@ -530,7 +539,7 @@ const L = J(null), ue = () => {
         try {
           switch (i.type) {
             case "mark_read":
-              await d.inbox.markAsRead(
+              await l.inbox.markAsRead(
                 e,
                 o.tenantId,
                 o.environmentId,
@@ -538,7 +547,7 @@ const L = J(null), ue = () => {
               );
               break;
             case "mark_unread":
-              await d.inbox.markAsUnread(
+              await l.inbox.markAsUnread(
                 e,
                 o.tenantId,
                 o.environmentId,
@@ -546,7 +555,7 @@ const L = J(null), ue = () => {
               );
               break;
             case "archive":
-              await d.inbox.archive(
+              await l.inbox.archive(
                 e,
                 o.tenantId,
                 o.environmentId,
@@ -554,7 +563,7 @@ const L = J(null), ue = () => {
               );
               break;
             case "delete":
-              await d.inbox.delete(
+              await l.inbox.delete(
                 e,
                 o.tenantId,
                 o.environmentId,
@@ -591,15 +600,15 @@ const L = J(null), ue = () => {
               });
               break;
           }
-        } catch (g) {
-          a && a(g);
+        } catch (E) {
+          a && a(E);
         }
       }
     },
-    [d]
+    [l]
   );
   return k(() => {
-    if (!d || !m) return;
+    if (!l || !y) return;
     (async () => {
       try {
         r({
@@ -609,7 +618,7 @@ const L = J(null), ue = () => {
         const i = window.__notificationSDK?.config;
         if (!i)
           throw new Error("SDK configuration not available");
-        const o = K(), y = ((await d.inbox.getRenderedNotifications(
+        const o = P(), m = ((await l.inbox.getRenderedNotifications(
           {
             channel: "in_app",
             limit: 50,
@@ -619,11 +628,11 @@ const L = J(null), ue = () => {
           i.environmentId,
           i.subscriberId
         ))?.items || []).map(
-          (S) => o.toWidgetNotification(S)
+          (w) => o.toWidgetNotification(w)
         );
         r({
           type: "SET_NOTIFICATIONS",
-          payload: y
+          payload: m
         }), r({
           type: "SET_UI_STATE",
           payload: { isLoading: !1, error: null }
@@ -638,16 +647,16 @@ const L = J(null), ue = () => {
         }), a && a(i);
       }
     })();
-  }, [d, m, a]), k(() => (d && m && M(), () => {
-    B();
-  }), [d]), k(() => {
-    if (!d || !m || s.websocket.connected) return;
+  }, [l, y, a]), k(() => (l && y && B(), () => {
+    V();
+  }), [l]), k(() => {
+    if (!l || !y || s.websocket.connected) return;
     const e = setInterval(async () => {
       try {
         const i = window.__notificationSDK?.config;
         if (!i)
           return;
-        const o = K(), y = ((await d.inbox.getRenderedNotifications(
+        const o = P(), m = ((await l.inbox.getRenderedNotifications(
           {
             channel: "in_app",
             limit: 50,
@@ -657,68 +666,68 @@ const L = J(null), ue = () => {
           i.environmentId,
           i.subscriberId
         ))?.items || []).map(
-          (S) => o.toWidgetNotification(S)
+          (w) => o.toWidgetNotification(w)
         );
         r({
           type: "SET_NOTIFICATIONS",
-          payload: y
+          payload: m
         });
       } catch {
       }
     }, 3e4);
     return () => clearInterval(e);
-  }, [d, s.websocket.connected]), k(() => {
+  }, [l, s.websocket.connected]), k(() => {
     const e = (i) => {
       if (i.key === "notification_widget_sync" && i.newValue)
         try {
           const o = JSON.parse(i.newValue);
-          O(o);
+          x(o);
         } catch {
         }
     };
     return window.addEventListener("storage", e), () => window.removeEventListener("storage", e);
-  }, [O]), k(() => {
+  }, [x]), k(() => {
     r({
       type: "SET_UI_STATE",
-      payload: { isLoading: D }
+      payload: { isLoading: K }
     });
-  }, [D]), k(() => {
-    const e = p || R || w;
+  }, [K]), k(() => {
+    const e = p || F || S;
     e && r({
       type: "SET_UI_STATE",
       payload: { error: e }
     });
-  }, [p, R, w]), !m && !p ? /* @__PURE__ */ u(
+  }, [p, F, S]), !y && !p ? /* @__PURE__ */ f(
     "div",
     {
       className: `mx-widget-root relative inline-block ${h}`,
       "data-mx-widget": "root",
       "data-widget-size": n || "small",
-      "data-theme": f,
+      "data-theme": u,
       "data-testid": "notification-widget",
-      children: /* @__PURE__ */ u(x, { componentName: "BellComponent", children: /* @__PURE__ */ u(P, { unreadCount: 0, onClick: () => {
+      children: /* @__PURE__ */ f(D, { componentName: "BellComponent", children: /* @__PURE__ */ f(R, { unreadCount: 0, onClick: () => {
       }, size: n, disabled: !0 }) })
     }
-  ) : p ? /* @__PURE__ */ u(
+  ) : p ? /* @__PURE__ */ f(
     "div",
     {
       className: `mx-widget-root relative inline-block ${h}`,
       "data-mx-widget": "root",
       "data-widget-size": n || "small",
-      "data-theme": f,
+      "data-theme": u,
       "data-testid": "notification-widget",
-      children: /* @__PURE__ */ u(
-        x,
+      children: /* @__PURE__ */ f(
+        D,
         {
           componentName: "BellComponent",
-          fallback: /* @__PURE__ */ u(
-            ne,
+          fallback: /* @__PURE__ */ f(
+            oe,
             {
               error: p.message,
               onRetry: () => window.location.reload()
             }
           ),
-          children: /* @__PURE__ */ u(P, { unreadCount: 0, onClick: () => {
+          children: /* @__PURE__ */ f(R, { unreadCount: 0, onClick: () => {
           }, size: n, disabled: !0 })
         }
       )
@@ -726,28 +735,28 @@ const L = J(null), ue = () => {
   ) : /* @__PURE__ */ A(
     "div",
     {
-      className: `mx-widget-root relative inline-block ${h}`,
+      className: `mx-widget-root  min-w-[20rem] relative inline-block ${h}`,
       "data-mx-widget": "root",
       "data-widget-size": n || "small",
-      "data-theme": f,
+      "data-theme": u,
       "data-testid": "notification-widget",
       children: [
-        /* @__PURE__ */ u(x, { componentName: "BellComponent", children: /* @__PURE__ */ u(
-          P,
+        /* @__PURE__ */ f(D, { componentName: "BellComponent", children: /* @__PURE__ */ f(
+          R,
           {
             unreadCount: s.unreadCount,
-            onClick: V,
+            onClick: H,
             size: n,
             disabled: s.ui.isLoading
           }
         ) }),
-        /* @__PURE__ */ u(
-          x,
+        /* @__PURE__ */ f(
+          D,
           {
             componentName: "InboxPopover",
-            fallback: /* @__PURE__ */ u(ie, { message: "Unable to load notifications" }),
-            children: /* @__PURE__ */ u(
-              re,
+            fallback: /* @__PURE__ */ f(se, { message: "Unable to load notifications" }),
+            children: /* @__PURE__ */ f(
+              ae,
               {
                 isOpen: s.ui.isOpen,
                 onClose: q,
@@ -755,15 +764,15 @@ const L = J(null), ue = () => {
                 currentView: s.ui.currentView,
                 onViewChange: z,
                 notifications: s.notifications,
-                onNotificationAction: H,
+                onNotificationAction: $,
                 preferences: s.preferences,
-                onPreferenceChange: U,
-                isPreferencesLoading: D,
-                specificPreferences: W,
+                onPreferenceChange: W,
+                isPreferencesLoading: K,
+                specificPreferences: M,
                 onLoadMoreSpecific: _,
                 hasMoreSpecific: C,
                 isListLoading: N,
-                onMorePreferencesClick: l
+                onMorePreferencesClick: d
               }
             )
           }
@@ -771,15 +780,15 @@ const L = J(null), ue = () => {
       ]
     }
   );
-}, Ie = ({ sdkConfig: t, ...n }) => /* @__PURE__ */ u(le, { onError: n.onError, children: /* @__PURE__ */ u(pe, { config: t, children: /* @__PURE__ */ u(me, { ...n }) }) }), Te = "3.0.0", _e = "@edusight/notification-widget";
+}, ke = ({ sdkConfig: t, ...n }) => /* @__PURE__ */ f(pe, { onError: n.onError, children: /* @__PURE__ */ f(we, { config: t, children: /* @__PURE__ */ f(Se, { ...n }) }) }), Ne = "3.0.0", Ce = "@edusight/notification-widget";
 export {
-  P as BellComponent,
-  re as InboxPopover,
-  Ce as NotificationItem,
-  Ie as NotificationWidget,
-  le as NotificationWidgetErrorBoundary,
-  ve as PreferencesView,
-  Te as VERSION,
-  _e as WIDGET_NAME
+  R as BellComponent,
+  ae as InboxPopover,
+  Oe as NotificationItem,
+  ke as NotificationWidget,
+  pe as NotificationWidgetErrorBoundary,
+  xe as PreferencesView,
+  Ne as VERSION,
+  Ce as WIDGET_NAME
 };
 //# sourceMappingURL=index.esm.js.map