@novu/react 3.7.0 → 3.8.0

package/dist/cjs/hooks/useNotifications.cjs

@@ -23,8 +23,9 @@ __export(useNotifications_exports, {
   useNotifications: () => useNotifications
 });
 module.exports = __toCommonJS(useNotifications_exports);
-var import_react = require("react");
 var import_js = require("@novu/js");
+var import_react = require("react");
+var import_useWebsocketEvent = require("./internal/useWebsocketEvent.cjs");
 var import_NovuProvider = require("./NovuProvider.cjs");
 var useNotifications = (props) => {
   const {
@@ -39,7 +40,8 @@ var useNotifications = (props) => {
     onError
   } = props || {};
   const filterRef = (0, import_react.useRef)(void 0);
-  const { notifications, on } = (0, import_NovuProvider.useNovu)();
+  const { notifications } = (0, import_NovuProvider.useNovu)();
+  const getCurrentFilter = (0, import_react.useCallback)(() => filterRef.current || { tags, data: dataFilter }, [tags, dataFilter]);
   const [data, setData] = (0, import_react.useState)();
   const [error, setError] = (0, import_react.useState)();
   const [isLoading, setIsLoading] = (0, import_react.useState)(true);
@@ -47,19 +49,53 @@ var useNotifications = (props) => {
   const [hasMore, setHasMore] = (0, import_react.useState)(false);
   const length = data == null ? void 0 : data.length;
   const after = length ? data[length - 1].id : void 0;
-  const sync = (event) => {
-    if (!event.data || filterRef.current && !(0, import_js.isSameFilter)(filterRef.current, event.data.filter)) {
-      return;
+  (0, import_useWebsocketEvent.useWebSocketEvent)({
+    event: "notifications.unread_count_changed",
+    eventHandler: () => {
+      void refetch();
     }
-    setData(event.data.notifications);
-    setHasMore(event.data.hasMore);
-  };
-  (0, import_react.useEffect)(() => {
-    const cleanup = on("notifications.list.updated", sync);
-    return () => {
-      cleanup();
-    };
-  }, []);
+  });
+  (0, import_useWebsocketEvent.useWebSocketEvent)({
+    event: "notifications.unseen_count_changed",
+    eventHandler: () => {
+      void refetch();
+    }
+  });
+  (0, import_useWebsocketEvent.useWebSocketEvent)({
+    event: "notifications.notification_received",
+    eventHandler: ({ result: notification }) => {
+      const currentFilter = getCurrentFilter();
+      const matches = (0, import_js.checkNotificationMatchesFilter)(notification, currentFilter);
+      if (matches) void refetch();
+    }
+  });
+  const fetchNotifications = (0, import_react.useCallback)(
+    async (options) => {
+      if (options == null ? void 0 : options.refetch) {
+        setError(void 0);
+        setIsLoading(true);
+        setIsFetching(false);
+      }
+      setIsFetching(true);
+      const currentFilter = getCurrentFilter();
+      const response = await notifications.list({
+        ...currentFilter,
+        limit,
+        after: (options == null ? void 0 : options.refetch) ? void 0 : after
+      });
+      if (response.error) {
+        setError(response.error);
+        onError == null ? void 0 : onError(response.error);
+      } else if (response.data) {
+        onSuccess == null ? void 0 : onSuccess(response.data.notifications);
+        setData(response.data.notifications);
+        setHasMore(response.data.hasMore);
+      }
+      setIsLoading(false);
+      setIsFetching(false);
+    },
+    [notifications, getCurrentFilter, limit, after, onError, onSuccess]
+  );
   (0, import_react.useEffect)(() => {
     const newFilter = { tags, data: dataFilter, read, archived, snoozed, seen };
     if (filterRef.current && (0, import_js.isSameFilter)(filterRef.current, newFilter)) {
@@ -68,37 +104,10 @@ var useNotifications = (props) => {
     notifications.clearCache({ filter: filterRef.current });
     filterRef.current = newFilter;
     fetchNotifications({ refetch: true });
-  }, [tags, dataFilter, read, archived, snoozed, seen]);
-  const fetchNotifications = async (options) => {
-    if (options == null ? void 0 : options.refetch) {
-      setError(void 0);
-      setIsLoading(true);
-      setIsFetching(false);
-    }
-    setIsFetching(true);
-    const response = await notifications.list({
-      tags,
-      data: dataFilter,
-      read,
-      archived,
-      snoozed,
-      seen,
-      limit,
-      after: (options == null ? void 0 : options.refetch) ? void 0 : after
-    });
-    if (response.error) {
-      setError(response.error);
-      onError == null ? void 0 : onError(response.error);
-    } else {
-      onSuccess == null ? void 0 : onSuccess(response.data.notifications);
-      setData(response.data.notifications);
-      setHasMore(response.data.hasMore);
-    }
-    setIsLoading(false);
-    setIsFetching(false);
-  };
+  }, [tags, dataFilter, read, archived, snoozed, seen, notifications, fetchNotifications]);
   const refetch = () => {
-    notifications.clearCache({ filter: { tags, read, archived, snoozed, seen, data: dataFilter } });
+    const filter = getCurrentFilter();
+    notifications.clearCache({ filter });
     return fetchNotifications({ refetch: true });
   };
   const fetchMore = async () => {
@@ -106,16 +115,20 @@ var useNotifications = (props) => {
     return fetchNotifications();
   };
   const readAll = async () => {
-    return await notifications.readAll({ tags, data: dataFilter });
+    const { tags: tags2, data: data2 } = getCurrentFilter();
+    return await notifications.readAll({ tags: tags2, data: data2 });
   };
   const seenAll = async () => {
-    return await notifications.seenAll({ tags, data: dataFilter });
+    const { tags: tags2, data: data2 } = getCurrentFilter();
+    return await notifications.seenAll({ tags: tags2, data: data2 });
   };
   const archiveAll = async () => {
-    return await notifications.archiveAll({ tags, data: dataFilter });
+    const { tags: tags2, data: data2 } = getCurrentFilter();
+    return await notifications.archiveAll({ tags: tags2, data: data2 });
   };
   const archiveAllRead = async () => {
-    return await notifications.archiveAllRead({ tags, data: dataFilter });
+    const { tags: tags2, data: data2 } = getCurrentFilter();
+    return await notifications.archiveAllRead({ tags: tags2, data: data2 });
   };
   return {
     readAll,

package/dist/cjs/hooks/useNotifications.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useNotifications.ts"],"sourcesContent":["import { useState, useEffect, useRef } from 'react';\nimport { ListNotificationsResponse, Notification, NovuError, isSameFilter, NotificationFilter } from '@novu/js';\nimport { useNovu } from './NovuProvider';\n\n/**\n * Props for the useNotifications hook.\n *\n * @example\n * ```tsx\n * // Get unread notifications\n * const { notifications } = useNotifications({\n *   read: false\n * });\n *\n * // Get unseen notifications with specific tags\n * const { notifications } = useNotifications({\n *   seen: false,\n *   tags: ['important']\n * });\n *\n * // Get seen but unread notifications\n * const { notifications } = useNotifications({\n *   seen: true,\n *   read: false\n * });\n * ```\n */\nexport type UseNotificationsProps = {\n  tags?: string[];\n  data?: Record<string, unknown>;\n  read?: boolean;\n  archived?: boolean;\n  snoozed?: boolean;\n  seen?: boolean;\n  limit?: number;\n  onSuccess?: (data: Notification[]) => void;\n  onError?: (error: NovuError) => void;\n};\n\nexport type UseNotificationsResult = {\n  notifications?: Notification[];\n  error?: NovuError;\n  isLoading: boolean;\n  isFetching: boolean;\n  hasMore: boolean;\n  readAll: () => Promise<{\n    data?: void | undefined;\n    error?: NovuError | undefined;\n  }>;\n  seenAll: () => Promise<{\n    data?: void | undefined;\n    error?: NovuError | undefined;\n  }>;\n  archiveAll: () => Promise<{\n    data?: void | undefined;\n    error?: NovuError | undefined;\n  }>;\n  archiveAllRead: () => Promise<{\n    data?: void | undefined;\n    error?: NovuError | undefined;\n  }>;\n  refetch: () => Promise<void>;\n  fetchMore: () => Promise<void>;\n};\n\nexport const useNotifications = (props?: UseNotificationsProps): UseNotificationsResult => {\n  const {\n    tags,\n    data: dataFilter,\n    read,\n    archived = false,\n    snoozed = false,\n    seen,\n    limit,\n    onSuccess,\n    onError,\n  } = props || {};\n  const filterRef = useRef<NotificationFilter | undefined>(undefined);\n  const { notifications, on } = useNovu();\n  const [data, setData] = useState<Array<Notification>>();\n  const [error, setError] = useState<NovuError>();\n  const [isLoading, setIsLoading] = useState(true);\n  const [isFetching, setIsFetching] = useState(false);\n  const [hasMore, setHasMore] = useState(false);\n  const length = data?.length;\n  const after = length ? data[length - 1].id : undefined;\n\n  const sync = (event: { data?: ListNotificationsResponse }) => {\n    if (!event.data || (filterRef.current && !isSameFilter(filterRef.current, event.data.filter))) {\n      return;\n    }\n    setData(event.data.notifications);\n    setHasMore(event.data.hasMore);\n  };\n\n  useEffect(() => {\n    const cleanup = on('notifications.list.updated', sync);\n\n    return () => {\n      cleanup();\n    };\n  }, []);\n\n  useEffect(() => {\n    const newFilter = { tags, data: dataFilter, read, archived, snoozed, seen };\n    if (filterRef.current && isSameFilter(filterRef.current, newFilter)) {\n      return;\n    }\n    notifications.clearCache({ filter: filterRef.current });\n    filterRef.current = newFilter;\n\n    fetchNotifications({ refetch: true });\n  }, [tags, dataFilter, read, archived, snoozed, seen]);\n\n  const fetchNotifications = async (options?: { refetch: boolean }) => {\n    if (options?.refetch) {\n      setError(undefined);\n      setIsLoading(true);\n      setIsFetching(false);\n    }\n    setIsFetching(true);\n    const response = await notifications.list({\n      tags,\n      data: dataFilter,\n      read,\n      archived,\n      snoozed,\n      seen,\n      limit,\n      after: options?.refetch ? undefined : after,\n    });\n    if (response.error) {\n      setError(response.error);\n      onError?.(response.error);\n    } else {\n      onSuccess?.(response.data!.notifications);\n      setData(response.data!.notifications);\n      setHasMore(response.data!.hasMore);\n    }\n    setIsLoading(false);\n    setIsFetching(false);\n  };\n\n  const refetch = () => {\n    notifications.clearCache({ filter: { tags, read, archived, snoozed, seen, data: dataFilter } });\n\n    return fetchNotifications({ refetch: true });\n  };\n\n  const fetchMore = async () => {\n    if (!hasMore || isFetching) return;\n\n    return fetchNotifications();\n  };\n\n  const readAll = async () => {\n    return await notifications.readAll({ tags, data: dataFilter });\n  };\n\n  const seenAll = async () => {\n    return await notifications.seenAll({ tags, data: dataFilter });\n  };\n\n  const archiveAll = async () => {\n    return await notifications.archiveAll({ tags, data: dataFilter });\n  };\n\n  const archiveAllRead = async () => {\n    return await notifications.archiveAllRead({ tags, data: dataFilter });\n  };\n\n  return {\n    readAll,\n    seenAll,\n    archiveAll,\n    archiveAllRead,\n    notifications: data,\n    error,\n    isLoading,\n    isFetching,\n    refetch,\n    fetchMore,\n    hasMore,\n  };\n};\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/hooks/useNotifications.ts"],"sourcesContent":["import { checkNotificationMatchesFilter, isSameFilter, Notification, NotificationFilter, NovuError } from '@novu/js';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport { useWebSocketEvent } from './internal/useWebsocketEvent';\nimport { useNovu } from './NovuProvider';\n\n/**\n * Props for the useNotifications hook.\n *\n * @example\n * ```tsx\n * // Get unread notifications\n * const { notifications } = useNotifications({\n *   read: false\n * });\n *\n * // Get unseen notifications with specific tags\n * const { notifications } = useNotifications({\n *   seen: false,\n *   tags: ['important']\n * });\n *\n * // Get notifications (auto-updates in real time when new notifications arrive)\n * const { notifications } = useNotifications({\n *   read: false\n * });\n * ```\n */\nexport type UseNotificationsProps = {\n  tags?: string[];\n  data?: Record<string, unknown>;\n  read?: boolean;\n  archived?: boolean;\n  snoozed?: boolean;\n  seen?: boolean;\n  limit?: number;\n  onSuccess?: (data: Notification[]) => void;\n  onError?: (error: NovuError) => void;\n};\n\nexport type UseNotificationsResult = {\n  notifications?: Notification[];\n  error?: NovuError;\n  isLoading: boolean;\n  isFetching: boolean;\n  hasMore: boolean;\n  readAll: () => Promise<{\n    data?: void | undefined;\n    error?: NovuError | undefined;\n  }>;\n  seenAll: () => Promise<{\n    data?: void | undefined;\n    error?: NovuError | undefined;\n  }>;\n  archiveAll: () => Promise<{\n    data?: void | undefined;\n    error?: NovuError | undefined;\n  }>;\n  archiveAllRead: () => Promise<{\n    data?: void | undefined;\n    error?: NovuError | undefined;\n  }>;\n  refetch: () => Promise<void>;\n  fetchMore: () => Promise<void>;\n};\n\nexport const useNotifications = (props?: UseNotificationsProps): UseNotificationsResult => {\n  const {\n    tags,\n    data: dataFilter,\n    read,\n    archived = false,\n    snoozed = false,\n    seen,\n    limit,\n    onSuccess,\n    onError,\n  } = props || {};\n  const filterRef = useRef<NotificationFilter | undefined>(undefined);\n  const { notifications } = useNovu();\n\n  const getCurrentFilter = useCallback(() => filterRef.current || { tags, data: dataFilter }, [tags, dataFilter]);\n  const [data, setData] = useState<Array<Notification>>();\n  const [error, setError] = useState<NovuError>();\n  const [isLoading, setIsLoading] = useState(true);\n  const [isFetching, setIsFetching] = useState(false);\n  const [hasMore, setHasMore] = useState(false);\n  const length = data?.length;\n  const after = length ? data[length - 1].id : undefined;\n\n  useWebSocketEvent({\n    event: 'notifications.unread_count_changed',\n    eventHandler: () => {\n      void refetch();\n    },\n  });\n\n  useWebSocketEvent({\n    event: 'notifications.unseen_count_changed',\n    eventHandler: () => {\n      void refetch();\n    },\n  });\n\n  useWebSocketEvent({\n    event: 'notifications.notification_received',\n    eventHandler: ({ result: notification }) => {\n      const currentFilter = getCurrentFilter();\n      const matches = checkNotificationMatchesFilter(notification, currentFilter);\n      if (matches) void refetch();\n    },\n  });\n\n  const fetchNotifications = useCallback(\n    async (options?: { refetch: boolean }) => {\n      if (options?.refetch) {\n        setError(undefined);\n        setIsLoading(true);\n        setIsFetching(false);\n      }\n      setIsFetching(true);\n\n      const currentFilter = getCurrentFilter();\n\n      const response = await notifications.list({\n        ...currentFilter,\n        limit,\n        after: options?.refetch ? undefined : after,\n      });\n\n      if (response.error) {\n        setError(response.error);\n        onError?.(response.error);\n      } else if (response.data) {\n        onSuccess?.(response.data.notifications);\n        setData(response.data.notifications);\n        setHasMore(response.data.hasMore);\n      }\n      setIsLoading(false);\n      setIsFetching(false);\n    },\n    [notifications, getCurrentFilter, limit, after, onError, onSuccess]\n  );\n\n  useEffect(() => {\n    const newFilter = { tags, data: dataFilter, read, archived, snoozed, seen };\n    if (filterRef.current && isSameFilter(filterRef.current, newFilter)) {\n      return;\n    }\n    notifications.clearCache({ filter: filterRef.current });\n    filterRef.current = newFilter;\n\n    fetchNotifications({ refetch: true });\n  }, [tags, dataFilter, read, archived, snoozed, seen, notifications, fetchNotifications]);\n\n  const refetch = () => {\n    const filter = getCurrentFilter();\n    notifications.clearCache({ filter });\n    return fetchNotifications({ refetch: true });\n  };\n\n  const fetchMore = async () => {\n    if (!hasMore || isFetching) return;\n\n    return fetchNotifications();\n  };\n\n  const readAll = async () => {\n    const { tags, data } = getCurrentFilter();\n    return await notifications.readAll({ tags, data });\n  };\n\n  const seenAll = async () => {\n    const { tags, data } = getCurrentFilter();\n    return await notifications.seenAll({ tags, data });\n  };\n\n  const archiveAll = async () => {\n    const { tags, data } = getCurrentFilter();\n    return await notifications.archiveAll({ tags, data });\n  };\n\n  const archiveAllRead = async () => {\n    const { tags, data } = getCurrentFilter();\n    return await notifications.archiveAllRead({ tags, data });\n  };\n\n  return {\n    readAll,\n    seenAll,\n    archiveAll,\n    archiveAllRead,\n    notifications: data,\n    error,\n    isLoading,\n    isFetching,\n    refetch,\n    fetchMore,\n    hasMore,\n  };\n};\n"],"mappings":"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","names":["tags","data"]}

package/dist/cjs/hooks/useNotifications.d.cts

@@ -16,9 +16,8 @@ import { Notification, NovuError } from '@novu/js';
  *   tags: ['important']
  * });
  *
- * // Get seen but unread notifications
+ * // Get notifications (auto-updates in real time when new notifications arrive)
  * const { notifications } = useNotifications({
- *   seen: true,
  *   read: false
  * });
  * ```

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export type {\n  FiltersCountResponse,\n  ListNotificationsResponse,\n  NovuError,\n  Preference,\n  PreferencesResponse,\n  ChannelPreference,\n  Notification,\n  ChannelType,\n  InboxNotification,\n  NotificationFilter,\n  NotificationStatus,\n  NovuOptions,\n  PreferenceLevel,\n  WebSocketEvent,\n  EventHandler,\n  Events,\n  SocketEventNames,\n} from '@novu/js';\n\nexport type {\n  Appearance,\n  AppearanceKey,\n  Elements,\n  ElementStyles,\n  Localization,\n  LocalizationKey,\n  NotificationActionClickHandler,\n  NotificationClickHandler,\n  NotificationRenderer,\n  PreferencesFilter,\n  PreferenceGroups,\n  RouterPush,\n  Tab,\n  Variables,\n} from '@novu/js/ui';\n\nexport { Inbox, Bell, InboxContent, Notifications, NovuProvider, Preferences } from './components';\nexport { useNovu, useCounts, useNotifications, usePreferences } from './hooks';\n\nexport type { InboxProps, BellProps, InboxContentProps, NotificationProps, NovuProviderProps } from './components';\n\nexport type {\n  UseCountsProps,\n  UseCountsResult,\n  UseNotificationsProps,\n  UseNotificationsResult,\n  UsePreferencesProps,\n  UsePreferencesResult,\n} from './hooks';\n\nexport type {\n  NotificationsRenderer,\n  SubjectRenderer,\n  BodyRenderer,\n  BellRenderer,\n  DefaultInboxProps,\n  BaseProps,\n  NotificationRendererProps,\n  SubjectBodyRendererProps,\n  NoRendererProps,\n  DefaultProps,\n  WithChildrenProps,\n} from './utils/types';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqCA,wBAAoF;AACpF,mBAAqE;","names":[]}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export type {\n  ChannelPreference,\n  ChannelType,\n  EventHandler,\n  Events,\n  FiltersCountResponse,\n  InboxNotification,\n  ListNotificationsResponse,\n  Notification,\n  NotificationFilter,\n  NotificationStatus,\n  NovuError,\n  NovuOptions,\n  Preference,\n  PreferenceLevel,\n  PreferencesResponse,\n  SocketEventNames,\n  WebSocketEvent,\n} from '@novu/js';\n\nexport type {\n  Appearance,\n  AppearanceKey,\n  ElementStyles,\n  Elements,\n  Localization,\n  LocalizationKey,\n  NotificationActionClickHandler,\n  NotificationClickHandler,\n  NotificationRenderer,\n  PreferenceGroups,\n  PreferencesFilter,\n  RouterPush,\n  Tab,\n  Variables,\n} from '@novu/js/ui';\nexport type { BellProps, InboxContentProps, InboxProps, NotificationProps, NovuProviderProps } from './components';\nexport { Bell, Inbox, InboxContent, Notifications, NovuProvider, Preferences } from './components';\nexport type {\n  UseCountsProps,\n  UseCountsResult,\n  UseNotificationsProps,\n  UseNotificationsResult,\n  UsePreferencesProps,\n  UsePreferencesResult,\n} from './hooks';\nexport { useCounts, useNotifications, useNovu, usePreferences } from './hooks';\n\nexport type {\n  BaseProps,\n  BellRenderer,\n  BodyRenderer,\n  DefaultInboxProps,\n  DefaultProps,\n  NoRendererProps,\n  NotificationRendererProps,\n  NotificationsRenderer,\n  SubjectBodyRendererProps,\n  SubjectRenderer,\n  WithChildrenProps,\n} from './utils/types';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqCA,wBAAoF;AASpF,mBAAqE;","names":[]}

package/dist/cjs/index.d.cts

@@ -1,14 +1,14 @@
 export { ChannelPreference, ChannelType, EventHandler, Events, FiltersCountResponse, InboxNotification, ListNotificationsResponse, Notification, NotificationFilter, NotificationStatus, NovuError, NovuOptions, Preference, PreferenceLevel, PreferencesResponse, SocketEventNames, WebSocketEvent } from '@novu/js';
 export { Appearance, AppearanceKey, ElementStyles, Elements, Localization, LocalizationKey, NotificationActionClickHandler, NotificationClickHandler, NotificationRenderer, PreferenceGroups, PreferencesFilter, RouterPush, Tab, Variables } from '@novu/js/ui';
+export { NovuProvider, NovuProviderProps, useNovu } from './hooks/NovuProvider.cjs';
 export { Bell, BellProps } from './components/Bell.cjs';
 export { Inbox, InboxProps } from './components/Inbox.cjs';
-export { Preferences } from './components/Preferences.cjs';
-export { NotificationProps, Notifications } from './components/Notifications.cjs';
 export { InboxContent, InboxContentProps } from './components/InboxContent.cjs';
-export { NovuProvider, NovuProviderProps, useNovu } from './hooks/NovuProvider.cjs';
+export { NotificationProps, Notifications } from './components/Notifications.cjs';
+export { Preferences } from './components/Preferences.cjs';
+export { UseCountsProps, UseCountsResult, useCounts } from './hooks/useCounts.cjs';
 export { UseNotificationsProps, UseNotificationsResult, useNotifications } from './hooks/useNotifications.cjs';
 export { UsePreferencesProps, UsePreferencesResult, usePreferences } from './hooks/usePreferences.cjs';
-export { UseCountsProps, UseCountsResult, useCounts } from './hooks/useCounts.cjs';
 export { BaseProps, BellRenderer, BodyRenderer, DefaultInboxProps, DefaultProps, NoRendererProps, NotificationRendererProps, NotificationsRenderer, SubjectBodyRendererProps, SubjectRenderer, WithChildrenProps } from './utils/types.cjs';
-import 'react';
 import 'react/jsx-runtime';
+import 'react';

package/dist/cjs/server/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/server/index.tsx"],"sourcesContent":["import type {\n  UseNotificationsProps,\n  UseNotificationsResult,\n  UsePreferencesProps,\n  UsePreferencesResult,\n} from '../hooks';\nimport type { UseCountsProps, UseCountsResult } from '../hooks/useCounts';\nimport type { InboxProps } from '../components/Inbox';\nimport type { NovuProviderProps } from '../hooks/NovuProvider';\nimport { ShadowRootDetector } from '../components/ShadowRootDetector';\n\n/**\n * Exporting all components from the components folder\n * as empty functions to fix build errors in SSR\n * This will be replaced with actual components\n * when we implement the SSR components in @novu/js/ui\n */\nexport function Inbox(props: InboxProps) {\n  return <ShadowRootDetector />;\n}\n\nexport function InboxContent() {}\n\nexport function Notifications() {}\n\nexport function Preferences() {}\n\nexport function Bell() {}\n\nexport function NovuProvider(props: NovuProviderProps) {}\n\nexport function useNovu() {\n  return null;\n}\n\nexport function useCounts(_: UseCountsProps): UseCountsResult {\n  return {\n    isLoading: false,\n    isFetching: false,\n    refetch: () => Promise.resolve(),\n  };\n}\n\nexport function useNotifications(_: UseNotificationsProps): UseNotificationsResult {\n  return {\n    isLoading: false,\n    isFetching: false,\n    hasMore: false,\n    readAll: () => Promise.resolve({ data: undefined, error: undefined }),\n    seenAll: () => Promise.resolve({ data: undefined, error: undefined }),\n    archiveAll: () => Promise.resolve({ data: undefined, error: undefined }),\n    archiveAllRead: () => Promise.resolve({ data: undefined, error: undefined }),\n    refetch: () => Promise.resolve(),\n    fetchMore: () => Promise.resolve(),\n  };\n}\n\nexport function usePreferences(_: UsePreferencesProps): UsePreferencesResult {\n  return {\n    isLoading: false,\n    isFetching: false,\n    refetch: () => Promise.resolve(),\n  };\n}\n\nexport type {\n  FiltersCountResponse,\n  ListNotificationsResponse,\n  NovuError,\n  Preference,\n  ChannelPreference,\n  Notification,\n  ChannelType,\n  InboxNotification,\n  NotificationFilter,\n  NotificationStatus,\n  NovuOptions,\n  PreferenceLevel,\n} from '@novu/js';\n\nexport type {\n  Appearance,\n  AppearanceKey,\n  Elements,\n  ElementStyles,\n  Localization,\n  LocalizationKey,\n  NotificationActionClickHandler,\n  NotificationClickHandler,\n  NotificationRenderer,\n  PreferencesFilter,\n  PreferenceGroups,\n  RouterPush,\n  Tab,\n  Variables,\n} from '@novu/js/ui';\n\nexport type { InboxProps, BellProps, InboxContentProps, NotificationProps, NovuProviderProps } from '../components';\n\nexport type {\n  UseCountsProps,\n  UseCountsResult,\n  UseNotificationsProps,\n  UseNotificationsResult,\n  UsePreferencesProps,\n  UsePreferencesResult,\n} from '../hooks';\n\nexport type {\n  NotificationsRenderer,\n  SubjectRenderer,\n  BodyRenderer,\n  BellRenderer,\n  DefaultInboxProps,\n  BaseProps,\n  NotificationRendererProps,\n  SubjectBodyRendererProps,\n  NoRendererProps,\n  DefaultProps,\n  WithChildrenProps,\n} from '../utils/types';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA,gCAAmC;AAS1B;AADF,SAAS,MAAM,OAAmB;AACvC,SAAO,4CAAC,gDAAmB;AAC7B;AAEO,SAAS,eAAe;AAAC;AAEzB,SAAS,gBAAgB;AAAC;AAE1B,SAAS,cAAc;AAAC;AAExB,SAAS,OAAO;AAAC;AAEjB,SAAS,aAAa,OAA0B;AAAC;AAEjD,SAAS,UAAU;AACxB,SAAO;AACT;AAEO,SAAS,UAAU,GAAoC;AAC5D,SAAO;AAAA,IACL,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,SAAS,MAAM,QAAQ,QAAQ;AAAA,EACjC;AACF;AAEO,SAAS,iBAAiB,GAAkD;AACjF,SAAO;AAAA,IACL,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,SAAS,MAAM,QAAQ,QAAQ,EAAE,MAAM,QAAW,OAAO,OAAU,CAAC;AAAA,IACpE,SAAS,MAAM,QAAQ,QAAQ,EAAE,MAAM,QAAW,OAAO,OAAU,CAAC;AAAA,IACpE,YAAY,MAAM,QAAQ,QAAQ,EAAE,MAAM,QAAW,OAAO,OAAU,CAAC;AAAA,IACvE,gBAAgB,MAAM,QAAQ,QAAQ,EAAE,MAAM,QAAW,OAAO,OAAU,CAAC;AAAA,IAC3E,SAAS,MAAM,QAAQ,QAAQ;AAAA,IAC/B,WAAW,MAAM,QAAQ,QAAQ;AAAA,EACnC;AACF;AAEO,SAAS,eAAe,GAA8C;AAC3E,SAAO;AAAA,IACL,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,SAAS,MAAM,QAAQ,QAAQ;AAAA,EACjC;AACF;","names":[]}
+{"version":3,"sources":["../../../src/server/index.tsx"],"sourcesContent":["import type { InboxProps } from '../components/Inbox';\nimport { ShadowRootDetector } from '../components/ShadowRootDetector';\nimport type {\n  UseNotificationsProps,\n  UseNotificationsResult,\n  UsePreferencesProps,\n  UsePreferencesResult,\n} from '../hooks';\nimport type { NovuProviderProps } from '../hooks/NovuProvider';\nimport type { UseCountsProps, UseCountsResult } from '../hooks/useCounts';\n\n/**\n * Exporting all components from the components folder\n * as empty functions to fix build errors in SSR\n * This will be replaced with actual components\n * when we implement the SSR components in @novu/js/ui\n */\nexport function Inbox(props: InboxProps) {\n  return <ShadowRootDetector />;\n}\n\nexport function InboxContent() {}\n\nexport function Notifications() {}\n\nexport function Preferences() {}\n\nexport function Bell() {}\n\nexport function NovuProvider(props: NovuProviderProps) {}\n\nexport function useNovu() {\n  return null;\n}\n\nexport function useCounts(_: UseCountsProps): UseCountsResult {\n  return {\n    isLoading: false,\n    isFetching: false,\n    refetch: () => Promise.resolve(),\n  };\n}\n\nexport function useNotifications(_: UseNotificationsProps): UseNotificationsResult {\n  return {\n    isLoading: false,\n    isFetching: false,\n    hasMore: false,\n    readAll: () => Promise.resolve({ data: undefined, error: undefined }),\n    seenAll: () => Promise.resolve({ data: undefined, error: undefined }),\n    archiveAll: () => Promise.resolve({ data: undefined, error: undefined }),\n    archiveAllRead: () => Promise.resolve({ data: undefined, error: undefined }),\n    refetch: () => Promise.resolve(),\n    fetchMore: () => Promise.resolve(),\n  };\n}\n\nexport function usePreferences(_: UsePreferencesProps): UsePreferencesResult {\n  return {\n    isLoading: false,\n    isFetching: false,\n    refetch: () => Promise.resolve(),\n  };\n}\n\nexport type {\n  ChannelPreference,\n  ChannelType,\n  FiltersCountResponse,\n  InboxNotification,\n  ListNotificationsResponse,\n  Notification,\n  NotificationFilter,\n  NotificationStatus,\n  NovuError,\n  NovuOptions,\n  Preference,\n  PreferenceLevel,\n} from '@novu/js';\n\nexport type {\n  Appearance,\n  AppearanceKey,\n  ElementStyles,\n  Elements,\n  Localization,\n  LocalizationKey,\n  NotificationActionClickHandler,\n  NotificationClickHandler,\n  NotificationRenderer,\n  PreferenceGroups,\n  PreferencesFilter,\n  RouterPush,\n  Tab,\n  Variables,\n} from '@novu/js/ui';\n\nexport type { BellProps, InboxContentProps, InboxProps, NotificationProps, NovuProviderProps } from '../components';\n\nexport type {\n  UseCountsProps,\n  UseCountsResult,\n  UseNotificationsProps,\n  UseNotificationsResult,\n  UsePreferencesProps,\n  UsePreferencesResult,\n} from '../hooks';\n\nexport type {\n  BaseProps,\n  BellRenderer,\n  BodyRenderer,\n  DefaultInboxProps,\n  DefaultProps,\n  NoRendererProps,\n  NotificationRendererProps,\n  NotificationsRenderer,\n  SubjectBodyRendererProps,\n  SubjectRenderer,\n  WithChildrenProps,\n} from '../utils/types';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,gCAAmC;AAiB1B;AADF,SAAS,MAAM,OAAmB;AACvC,SAAO,4CAAC,gDAAmB;AAC7B;AAEO,SAAS,eAAe;AAAC;AAEzB,SAAS,gBAAgB;AAAC;AAE1B,SAAS,cAAc;AAAC;AAExB,SAAS,OAAO;AAAC;AAEjB,SAAS,aAAa,OAA0B;AAAC;AAEjD,SAAS,UAAU;AACxB,SAAO;AACT;AAEO,SAAS,UAAU,GAAoC;AAC5D,SAAO;AAAA,IACL,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,SAAS,MAAM,QAAQ,QAAQ;AAAA,EACjC;AACF;AAEO,SAAS,iBAAiB,GAAkD;AACjF,SAAO;AAAA,IACL,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,SAAS,MAAM,QAAQ,QAAQ,EAAE,MAAM,QAAW,OAAO,OAAU,CAAC;AAAA,IACpE,SAAS,MAAM,QAAQ,QAAQ,EAAE,MAAM,QAAW,OAAO,OAAU,CAAC;AAAA,IACpE,YAAY,MAAM,QAAQ,QAAQ,EAAE,MAAM,QAAW,OAAO,OAAU,CAAC;AAAA,IACvE,gBAAgB,MAAM,QAAQ,QAAQ,EAAE,MAAM,QAAW,OAAO,OAAU,CAAC;AAAA,IAC3E,SAAS,MAAM,QAAQ,QAAQ;AAAA,IAC/B,WAAW,MAAM,QAAQ,QAAQ;AAAA,EACnC;AACF;AAEO,SAAS,eAAe,GAA8C;AAC3E,SAAO;AAAA,IACL,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,SAAS,MAAM,QAAQ,QAAQ;AAAA,EACjC;AACF;","names":[]}

package/dist/cjs/server/index.d.cts

@@ -1,14 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { InboxProps } from '../components/Inbox.cjs';
+import { NovuProviderProps } from '../hooks/NovuProvider.cjs';
+import { UseCountsProps, UseCountsResult } from '../hooks/useCounts.cjs';
 import { UseNotificationsProps, UseNotificationsResult } from '../hooks/useNotifications.cjs';
 import { UsePreferencesProps, UsePreferencesResult } from '../hooks/usePreferences.cjs';
-import { UseCountsProps, UseCountsResult } from '../hooks/useCounts.cjs';
-import { NovuProviderProps } from '../hooks/NovuProvider.cjs';
-import { InboxProps } from '../components/Inbox.cjs';
 export { ChannelPreference, ChannelType, FiltersCountResponse, InboxNotification, ListNotificationsResponse, Notification, NotificationFilter, NotificationStatus, NovuError, NovuOptions, Preference, PreferenceLevel } from '@novu/js';
 export { Appearance, AppearanceKey, ElementStyles, Elements, Localization, LocalizationKey, NotificationActionClickHandler, NotificationClickHandler, NotificationRenderer, PreferenceGroups, PreferencesFilter, RouterPush, Tab, Variables } from '@novu/js/ui';
 export { BellProps } from '../components/Bell.cjs';
-export { NotificationProps } from '../components/Notifications.cjs';
 export { InboxContentProps } from '../components/InboxContent.cjs';
+export { NotificationProps } from '../components/Notifications.cjs';
 export { BaseProps, BellRenderer, BodyRenderer, DefaultInboxProps, DefaultProps, NoRendererProps, NotificationRendererProps, NotificationsRenderer, SubjectBodyRendererProps, SubjectRenderer, WithChildrenProps } from '../utils/types.cjs';
 import 'react';
 

package/dist/cjs/utils/appearance.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/appearance.ts"],"sourcesContent":["import type { Appearance as JsAppearance, IconRenderer, IconOverrides as JsIconOverrides, IconKey } from '@novu/js/ui';\n\nimport type { ReactAppearance, ReactIconRenderer } from './types';\nimport { MountedElement } from '../context/RendererContext';\n\nexport function adaptAppearanceForJs(\n  appearance: ReactAppearance,\n  mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void\n): JsAppearance | undefined {\n  if (!appearance) {\n    return undefined;\n  }\n\n  const jsAppearance: JsAppearance = JSON.parse(JSON.stringify(appearance));\n\n  if (appearance.icons) {\n    const jsIcons: JsIconOverrides = {};\n    const reactIcons = appearance.icons;\n    const iconKeys = Object.keys(reactIcons) as IconKey[];\n\n    for (const iconKey of iconKeys) {\n      const reactRenderer = reactIcons[iconKey];\n\n      if (reactRenderer) {\n        jsIcons[iconKey] = (el: HTMLDivElement, props: { class?: string }) => {\n          return mountElement(el, reactRenderer(props));\n        };\n      }\n    }\n\n    // JsAppearance also has .icons directly (from JsTheme part of JsAppearance)\n    jsAppearance.icons = jsIcons;\n  } else {\n    // If original didn't have icons, ensure the clone doesn't either\n    delete jsAppearance.icons;\n  }\n\n  return jsAppearance;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKO,SAAS,qBACd,YACA,cAC0B;AAC1B,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AAEA,QAAM,eAA6B,KAAK,MAAM,KAAK,UAAU,UAAU,CAAC;AAExE,MAAI,WAAW,OAAO;AACpB,UAAM,UAA2B,CAAC;AAClC,UAAM,aAAa,WAAW;AAC9B,UAAM,WAAW,OAAO,KAAK,UAAU;AAEvC,eAAW,WAAW,UAAU;AAC9B,YAAM,gBAAgB,WAAW,OAAO;AAExC,UAAI,eAAe;AACjB,gBAAQ,OAAO,IAAI,CAAC,IAAoB,UAA8B;AACpE,iBAAO,aAAa,IAAI,cAAc,KAAK,CAAC;AAAA,QAC9C;AAAA,MACF;AAAA,IACF;AAGA,iBAAa,QAAQ;AAAA,EACvB,OAAO;AAEL,WAAO,aAAa;AAAA,EACtB;AAEA,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../../src/utils/appearance.ts"],"sourcesContent":["import type { IconKey, IconRenderer, Appearance as JsAppearance, IconOverrides as JsIconOverrides } from '@novu/js/ui';\nimport { MountedElement } from '../context/RendererContext';\nimport type { ReactAppearance, ReactIconRenderer } from './types';\n\nexport function adaptAppearanceForJs(\n  appearance: ReactAppearance,\n  mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void\n): JsAppearance | undefined {\n  if (!appearance) {\n    return undefined;\n  }\n\n  const jsAppearance: JsAppearance = JSON.parse(JSON.stringify(appearance));\n\n  if (appearance.icons) {\n    const jsIcons: JsIconOverrides = {};\n    const reactIcons = appearance.icons;\n    const iconKeys = Object.keys(reactIcons) as IconKey[];\n\n    for (const iconKey of iconKeys) {\n      const reactRenderer = reactIcons[iconKey];\n\n      if (reactRenderer) {\n        jsIcons[iconKey] = (el: HTMLDivElement, props: { class?: string }) => {\n          return mountElement(el, reactRenderer(props));\n        };\n      }\n    }\n\n    // JsAppearance also has .icons directly (from JsTheme part of JsAppearance)\n    jsAppearance.icons = jsIcons;\n  } else {\n    // If original didn't have icons, ensure the clone doesn't either\n    delete jsAppearance.icons;\n  }\n\n  return jsAppearance;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIO,SAAS,qBACd,YACA,cAC0B;AAC1B,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AAEA,QAAM,eAA6B,KAAK,MAAM,KAAK,UAAU,UAAU,CAAC;AAExE,MAAI,WAAW,OAAO;AACpB,UAAM,UAA2B,CAAC;AAClC,UAAM,aAAa,WAAW;AAC9B,UAAM,WAAW,OAAO,KAAK,UAAU;AAEvC,eAAW,WAAW,UAAU;AAC9B,YAAM,gBAAgB,WAAW,OAAO;AAExC,UAAI,eAAe;AACjB,gBAAQ,OAAO,IAAI,CAAC,IAAoB,UAA8B;AACpE,iBAAO,aAAa,IAAI,cAAc,KAAK,CAAC;AAAA,QAC9C;AAAA,MACF;AAAA,IACF;AAGA,iBAAa,QAAQ;AAAA,EACvB,OAAO;AAEL,WAAO,aAAa;AAAA,EACtB;AAEA,SAAO;AACT;","names":[]}

package/dist/cjs/utils/appearance.d.cts

@@ -1,9 +1,9 @@
 import { Appearance } from '@novu/js/ui';
-import { ReactAppearance } from './types.cjs';
 import { MountedElement } from '../context/RendererContext.cjs';
-import '@novu/js';
-import 'react';
+import { ReactAppearance } from './types.cjs';
 import 'react/jsx-runtime';
+import 'react';
+import '@novu/js';
 
 declare function adaptAppearanceForJs(appearance: ReactAppearance, mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void): Appearance | undefined;
 

package/dist/cjs/utils/types.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/types.ts"],"sourcesContent":["import type {\n  Notification,\n  NotificationClickHandler,\n  NotificationActionClickHandler,\n  Tab,\n  Appearance as JsAppearance,\n  Theme as JsTheme,\n  IconKey,\n  Localization,\n  RouterPush,\n  PreferencesFilter,\n  PreferenceGroups,\n  InboxProps,\n  InboxPage,\n} from '@novu/js/ui';\nimport type { Subscriber } from '@novu/js';\nimport type { ReactNode } from 'react';\n\nexport type NotificationsRenderer = (notification: Notification) => React.ReactNode;\nexport type SubjectRenderer = (notification: Notification) => React.ReactNode;\nexport type BodyRenderer = (notification: Notification) => React.ReactNode;\nexport type BellRenderer = (unreadCount: number) => React.ReactNode;\n\nexport type ReactIconRendererProps = { class?: string };\nexport type ReactIconRenderer = (props: ReactIconRendererProps) => ReactNode;\n\nexport type ReactIconOverrides = {\n  [key in IconKey]?: ReactIconRenderer;\n};\n\nexport type ReactTheme = Omit<JsTheme, 'icons'> & {\n  icons?: ReactIconOverrides;\n};\n\nexport type ReactAppearance = ReactTheme & {\n  baseTheme?: JsTheme | JsTheme[];\n};\n\nexport type DefaultInboxProps = {\n  open?: boolean;\n  renderNotification?: NotificationsRenderer;\n  renderSubject?: SubjectRenderer;\n  renderBody?: BodyRenderer;\n  renderBell?: BellRenderer;\n  onNotificationClick?: NotificationClickHandler;\n  onPrimaryActionClick?: NotificationActionClickHandler;\n  onSecondaryActionClick?: NotificationActionClickHandler;\n  placement?: InboxProps['placement'];\n  placementOffset?: InboxProps['placementOffset'];\n};\n\ntype KeylessBaseProps = {} & { [K in string]?: never }; // empty object,disallows all unknown keys\n\ntype StandardBaseProps = {\n  applicationIdentifier: string;\n  subscriberHash?: string;\n  backendUrl?: string;\n  socketUrl?: string;\n  appearance?: ReactAppearance;\n  localization?: Localization;\n  tabs?: Array<Tab>;\n  preferencesFilter?: PreferencesFilter;\n  preferenceGroups?: PreferenceGroups;\n  routerPush?: RouterPush;\n} & (\n  | {\n      // TODO: Backward compatibility support - remove in future versions (see NV-5801)\n      /** @deprecated Use subscriber prop instead */\n      subscriberId: string;\n      subscriber?: never;\n    }\n  | {\n      subscriber: Subscriber | string;\n      subscriberId?: never;\n    }\n);\n\nexport type BaseProps = KeylessBaseProps | StandardBaseProps;\n\nexport type NotificationRendererProps = {\n  renderNotification: NotificationsRenderer;\n  renderSubject?: never;\n  renderBody?: never;\n};\n\nexport type SubjectBodyRendererProps = {\n  renderNotification?: never;\n  renderSubject?: SubjectRenderer;\n  renderBody?: BodyRenderer;\n};\n\nexport type NoRendererProps = {\n  renderNotification?: undefined;\n  renderSubject?: undefined;\n  renderBody?: undefined;\n};\n\nexport type DefaultProps = BaseProps &\n  DefaultInboxProps & {\n    children?: never;\n  } & (NotificationRendererProps | SubjectBodyRendererProps | NoRendererProps);\n\nexport type WithChildrenProps = BaseProps & {\n  children: React.ReactNode;\n};\n"],"mappings":";;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}
+{"version":3,"sources":["../../../src/utils/types.ts"],"sourcesContent":["import type { Subscriber } from '@novu/js';\nimport type {\n  IconKey,\n  InboxPage,\n  InboxProps,\n  Appearance as JsAppearance,\n  Theme as JsTheme,\n  Localization,\n  Notification,\n  NotificationActionClickHandler,\n  NotificationClickHandler,\n  PreferenceGroups,\n  PreferencesFilter,\n  RouterPush,\n  Tab,\n} from '@novu/js/ui';\nimport type { ReactNode } from 'react';\n\nexport type NotificationsRenderer = (notification: Notification) => React.ReactNode;\nexport type SubjectRenderer = (notification: Notification) => React.ReactNode;\nexport type BodyRenderer = (notification: Notification) => React.ReactNode;\nexport type BellRenderer = (unreadCount: number) => React.ReactNode;\n\nexport type ReactIconRendererProps = { class?: string };\nexport type ReactIconRenderer = (props: ReactIconRendererProps) => ReactNode;\n\nexport type ReactIconOverrides = {\n  [key in IconKey]?: ReactIconRenderer;\n};\n\nexport type ReactTheme = Omit<JsTheme, 'icons'> & {\n  icons?: ReactIconOverrides;\n};\n\nexport type ReactAppearance = ReactTheme & {\n  baseTheme?: JsTheme | JsTheme[];\n};\n\nexport type DefaultInboxProps = {\n  open?: boolean;\n  renderNotification?: NotificationsRenderer;\n  renderSubject?: SubjectRenderer;\n  renderBody?: BodyRenderer;\n  renderBell?: BellRenderer;\n  onNotificationClick?: NotificationClickHandler;\n  onPrimaryActionClick?: NotificationActionClickHandler;\n  onSecondaryActionClick?: NotificationActionClickHandler;\n  placement?: InboxProps['placement'];\n  placementOffset?: InboxProps['placementOffset'];\n};\n\ntype KeylessBaseProps = {} & { [K in string]?: never }; // empty object,disallows all unknown keys\n\ntype StandardBaseProps = {\n  applicationIdentifier: string;\n  subscriberHash?: string;\n  backendUrl?: string;\n  socketUrl?: string;\n  appearance?: ReactAppearance;\n  localization?: Localization;\n  tabs?: Array<Tab>;\n  preferencesFilter?: PreferencesFilter;\n  preferenceGroups?: PreferenceGroups;\n  routerPush?: RouterPush;\n} & (\n  | {\n      // TODO: Backward compatibility support - remove in future versions (see NV-5801)\n      /** @deprecated Use subscriber prop instead */\n      subscriberId: string;\n      subscriber?: never;\n    }\n  | {\n      subscriber: Subscriber | string;\n      subscriberId?: never;\n    }\n);\n\nexport type BaseProps = KeylessBaseProps | StandardBaseProps;\n\nexport type NotificationRendererProps = {\n  renderNotification: NotificationsRenderer;\n  renderSubject?: never;\n  renderBody?: never;\n};\n\nexport type SubjectBodyRendererProps = {\n  renderNotification?: never;\n  renderSubject?: SubjectRenderer;\n  renderBody?: BodyRenderer;\n};\n\nexport type NoRendererProps = {\n  renderNotification?: undefined;\n  renderSubject?: undefined;\n  renderBody?: undefined;\n};\n\nexport type DefaultProps = BaseProps &\n  DefaultInboxProps & {\n    children?: never;\n  } & (NotificationRendererProps | SubjectBodyRendererProps | NoRendererProps);\n\nexport type WithChildrenProps = BaseProps & {\n  children: React.ReactNode;\n};\n"],"mappings":";;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}

package/dist/cjs/utils/types.d.cts

@@ -1,5 +1,5 @@
-import { Notification, IconKey, Theme, NotificationClickHandler, NotificationActionClickHandler, InboxProps, Localization, Tab, PreferencesFilter, PreferenceGroups, RouterPush } from '@novu/js/ui';
 import { Subscriber } from '@novu/js';
+import { Notification, IconKey, Theme, NotificationClickHandler, NotificationActionClickHandler, InboxProps, Localization, Tab, PreferencesFilter, PreferenceGroups, RouterPush } from '@novu/js/ui';
 import { ReactNode } from 'react';
 
 type NotificationsRenderer = (notification: Notification) => React.ReactNode;

package/dist/esm/components/Bell.d.ts

@@ -1,7 +1,7 @@
 import React__default from 'react';
 import { BellRenderer } from '../utils/types.js';
-import '@novu/js/ui';
 import '@novu/js';
+import '@novu/js/ui';
 
 type BellProps = {
     renderBell?: BellRenderer;

package/dist/esm/components/Bell.js

@@ -1,9 +1,9 @@
 // src/components/Bell.tsx
 import React from "react";
-import { Mounter } from "./Mounter.js";
-import { withRenderer } from "./Renderer.js";
 import { useNovuUI } from "../context/NovuUIContext.js";
 import { useRenderer } from "../context/RendererContext.js";
+import { Mounter } from "./Mounter.js";
+import { withRenderer } from "./Renderer.js";
 import { jsx } from "react/jsx-runtime";
 var _Bell = React.memo((props) => {
   const { renderBell } = props;

package/dist/esm/components/Bell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Bell.tsx"],"sourcesContent":["import React from 'react';\nimport { Mounter } from './Mounter';\nimport { BellRenderer } from '../utils/types';\nimport { withRenderer } from './Renderer';\nimport { useNovuUI } from '../context/NovuUIContext';\nimport { useRenderer } from '../context/RendererContext';\n\nexport type BellProps = {\n  renderBell?: BellRenderer;\n};\n\nconst _Bell = React.memo((props: BellProps) => {\n  const { renderBell } = props;\n  const { novuUI } = useNovuUI();\n  const { mountElement } = useRenderer();\n\n  const mount = React.useCallback(\n    (element: HTMLElement) => {\n      return novuUI.mountComponent({\n        name: 'Bell',\n        element,\n        props: renderBell ? { renderBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : undefined,\n      });\n    },\n    [renderBell]\n  );\n\n  return <Mounter mount={mount} />;\n});\n\nexport const Bell = withRenderer(_Bell);\n"],"mappings":";AAAA,OAAO,WAAW;AAClB,SAAS,eAAe;AAExB,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAsBnB;AAhBT,IAAM,QAAQ,MAAM,KAAK,CAAC,UAAqB;AAC7C,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,EAAE,OAAO,IAAI,UAAU;AAC7B,QAAM,EAAE,aAAa,IAAI,YAAY;AAErC,QAAM,QAAQ,MAAM;AAAA,IAClB,CAAC,YAAyB;AACxB,aAAO,OAAO,eAAe;AAAA,QAC3B,MAAM;AAAA,QACN;AAAA,QACA,OAAO,aAAa,EAAE,YAAY,CAAC,IAAI,gBAAgB,aAAa,IAAI,WAAW,WAAW,CAAC,EAAE,IAAI;AAAA,MACvG,CAAC;AAAA,IACH;AAAA,IACA,CAAC,UAAU;AAAA,EACb;AAEA,SAAO,oBAAC,WAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,OAAO,aAAa,KAAK;","names":[]}
+{"version":3,"sources":["../../../src/components/Bell.tsx"],"sourcesContent":["import React from 'react';\nimport { useNovuUI } from '../context/NovuUIContext';\nimport { useRenderer } from '../context/RendererContext';\nimport { BellRenderer } from '../utils/types';\nimport { Mounter } from './Mounter';\nimport { withRenderer } from './Renderer';\n\nexport type BellProps = {\n  renderBell?: BellRenderer;\n};\n\nconst _Bell = React.memo((props: BellProps) => {\n  const { renderBell } = props;\n  const { novuUI } = useNovuUI();\n  const { mountElement } = useRenderer();\n\n  const mount = React.useCallback(\n    (element: HTMLElement) => {\n      return novuUI.mountComponent({\n        name: 'Bell',\n        element,\n        props: renderBell ? { renderBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : undefined,\n      });\n    },\n    [renderBell]\n  );\n\n  return <Mounter mount={mount} />;\n});\n\nexport const Bell = withRenderer(_Bell);\n"],"mappings":";AAAA,OAAO,WAAW;AAClB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAE5B,SAAS,eAAe;AACxB,SAAS,oBAAoB;AAsBpB;AAhBT,IAAM,QAAQ,MAAM,KAAK,CAAC,UAAqB;AAC7C,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,EAAE,OAAO,IAAI,UAAU;AAC7B,QAAM,EAAE,aAAa,IAAI,YAAY;AAErC,QAAM,QAAQ,MAAM;AAAA,IAClB,CAAC,YAAyB;AACxB,aAAO,OAAO,eAAe;AAAA,QAC3B,MAAM;AAAA,QACN;AAAA,QACA,OAAO,aAAa,EAAE,YAAY,CAAC,IAAI,gBAAgB,aAAa,IAAI,WAAW,WAAW,CAAC,EAAE,IAAI;AAAA,MACvG,CAAC;AAAA,IACH;AAAA,IACA,CAAC,UAAU;AAAA,EACb;AAEA,SAAO,oBAAC,WAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,OAAO,aAAa,KAAK;","names":[]}

package/dist/esm/components/Inbox.d.ts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import React__default from 'react';
 import { DefaultProps, WithChildrenProps } from '../utils/types.js';
-import '@novu/js/ui';
 import '@novu/js';
+import '@novu/js/ui';
 
 type InboxProps = DefaultProps | WithChildrenProps;
 declare const Inbox: React__default.MemoExoticComponent<(props: InboxProps) => react_jsx_runtime.JSX.Element>;

package/dist/esm/components/Inbox.js

@@ -1,10 +1,10 @@
 // src/components/Inbox.tsx
-import React, { useMemo } from "react";
 import { buildSubscriber } from "@novu/js/internal";
-import { Mounter } from "./Mounter.js";
+import React, { useMemo } from "react";
 import { useNovuUI } from "../context/NovuUIContext.js";
 import { useRenderer } from "../context/RendererContext.js";
 import { InternalNovuProvider, useNovu, useUnsafeNovu } from "../hooks/NovuProvider.js";
+import { Mounter } from "./Mounter.js";
 import { NovuUI } from "./NovuUI.js";
 import { withRenderer } from "./Renderer.js";
 import { jsx } from "react/jsx-runtime";

package/dist/esm/components/Inbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Inbox.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { StandardNovuOptions } from '@novu/js';\nimport { buildSubscriber } from '@novu/js/internal';\n\nimport { DefaultProps, DefaultInboxProps, WithChildrenProps } from '../utils/types';\nimport { Mounter } from './Mounter';\nimport { useNovuUI } from '../context/NovuUIContext';\nimport { useRenderer } from '../context/RendererContext';\nimport { InternalNovuProvider, useNovu, useUnsafeNovu } from '../hooks/NovuProvider';\nimport { NovuUI } from './NovuUI';\nimport { withRenderer } from './Renderer';\n\nexport type InboxProps = DefaultProps | WithChildrenProps;\n\nconst DefaultInbox = (props: DefaultInboxProps) => {\n  const {\n    open,\n    renderNotification,\n    renderSubject,\n    renderBody,\n    renderBell,\n    onNotificationClick,\n    onPrimaryActionClick,\n    onSecondaryActionClick,\n    placement,\n    placementOffset,\n  } = props;\n  const { novuUI } = useNovuUI();\n  const { mountElement } = useRenderer();\n\n  const mount = React.useCallback(\n    (element: HTMLElement) => {\n      if (renderNotification) {\n        return novuUI.mountComponent({\n          name: 'Inbox',\n          props: {\n            open,\n            renderNotification: renderNotification\n              ? (el, notification) => mountElement(el, renderNotification(notification))\n              : undefined,\n            renderBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : undefined,\n            onNotificationClick,\n            onPrimaryActionClick,\n            onSecondaryActionClick,\n            placementOffset,\n            placement,\n          },\n          element,\n        });\n      }\n\n      return novuUI.mountComponent({\n        name: 'Inbox',\n        props: {\n          open,\n          renderSubject: renderSubject\n            ? (el, notification) => mountElement(el, renderSubject(notification))\n            : undefined,\n          renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : undefined,\n          renderBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : undefined,\n          onNotificationClick,\n          onPrimaryActionClick,\n          onSecondaryActionClick,\n          placementOffset,\n          placement,\n        },\n        element,\n      });\n    },\n    [\n      open,\n      renderNotification,\n      renderSubject,\n      renderBody,\n      renderBell,\n      onNotificationClick,\n      onPrimaryActionClick,\n      onSecondaryActionClick,\n    ]\n  );\n\n  return <Mounter mount={mount} />;\n};\n\nexport const Inbox = React.memo((props: InboxProps) => {\n  const { subscriberId, ...propsWithoutSubscriberId } = props;\n  const subscriber = buildSubscriber({ subscriberId: props.subscriberId, subscriber: props.subscriber });\n  const applicationIdentifier = props.applicationIdentifier ? props.applicationIdentifier : ''; // for keyless we provide an empty string, the api will generate a identifier\n  const novu = useUnsafeNovu();\n\n  if (novu) {\n    return (\n      <InboxChild {...propsWithoutSubscriberId} applicationIdentifier={applicationIdentifier} subscriber={subscriber} />\n    );\n  }\n\n  const providerProps = {\n    applicationIdentifier,\n    subscriberHash: props.subscriberHash,\n    backendUrl: props.backendUrl,\n    socketUrl: props.socketUrl,\n    subscriber,\n  } satisfies StandardNovuOptions;\n\n  return (\n    <InternalNovuProvider {...providerProps} userAgentType=\"components\">\n      <InboxChild {...propsWithoutSubscriberId} applicationIdentifier={applicationIdentifier} subscriber={subscriber} />\n    </InternalNovuProvider>\n  );\n});\n\nconst InboxChild = withRenderer(\n  React.memo((props: InboxProps) => {\n    const {\n      localization,\n      appearance,\n      tabs,\n      preferencesFilter,\n      preferenceGroups,\n      routerPush,\n      applicationIdentifier = '', // for keyless we provide an empty string, the api will generate a identifier\n      subscriberId,\n      subscriberHash,\n      backendUrl,\n      socketUrl,\n      subscriber,\n    } = props;\n    const novu = useNovu();\n\n    const options = useMemo(() => {\n      return {\n        localization,\n        appearance,\n        tabs,\n        preferencesFilter,\n        preferenceGroups,\n        routerPush,\n        options: {\n          applicationIdentifier,\n          subscriberHash,\n          backendUrl,\n          socketUrl,\n          subscriber: buildSubscriber({ subscriberId, subscriber }),\n        },\n      };\n    }, [\n      localization,\n      appearance,\n      tabs,\n      preferencesFilter,\n      preferenceGroups,\n      applicationIdentifier,\n      subscriberId,\n      subscriberHash,\n      backendUrl,\n      socketUrl,\n      subscriber,\n    ]);\n\n    if (isWithChildrenProps(props)) {\n      return (\n        <NovuUI options={options} novu={novu}>\n          {props.children}\n        </NovuUI>\n      );\n    }\n\n    const {\n      open,\n      renderNotification,\n      renderSubject,\n      renderBody,\n      renderBell,\n      onNotificationClick,\n      onPrimaryActionClick,\n      onSecondaryActionClick,\n      placementOffset,\n      placement,\n    } = props;\n\n    return (\n      <NovuUI options={options} novu={novu}>\n        <DefaultInbox\n          open={open}\n          renderNotification={renderNotification}\n          renderSubject={renderSubject}\n          renderBody={renderBody}\n          renderBell={renderBell}\n          onNotificationClick={onNotificationClick}\n          onPrimaryActionClick={onPrimaryActionClick}\n          onSecondaryActionClick={onSecondaryActionClick}\n          placement={placement}\n          placementOffset={placementOffset}\n        />\n      </NovuUI>\n    );\n  })\n);\n\nfunction isWithChildrenProps(props: InboxProps): props is WithChildrenProps {\n  return 'children' in props;\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/Inbox.tsx"],"sourcesContent":["import { StandardNovuOptions } from '@novu/js';\nimport { buildSubscriber } from '@novu/js/internal';\nimport React, { useMemo } from 'react';\nimport { useNovuUI } from '../context/NovuUIContext';\nimport { useRenderer } from '../context/RendererContext';\nimport { InternalNovuProvider, useNovu, useUnsafeNovu } from '../hooks/NovuProvider';\nimport { DefaultInboxProps, DefaultProps, WithChildrenProps } from '../utils/types';\nimport { Mounter } from './Mounter';\nimport { NovuUI } from './NovuUI';\nimport { withRenderer } from './Renderer';\n\nexport type InboxProps = DefaultProps | WithChildrenProps;\n\nconst DefaultInbox = (props: DefaultInboxProps) => {\n  const {\n    open,\n    renderNotification,\n    renderSubject,\n    renderBody,\n    renderBell,\n    onNotificationClick,\n    onPrimaryActionClick,\n    onSecondaryActionClick,\n    placement,\n    placementOffset,\n  } = props;\n  const { novuUI } = useNovuUI();\n  const { mountElement } = useRenderer();\n\n  const mount = React.useCallback(\n    (element: HTMLElement) => {\n      if (renderNotification) {\n        return novuUI.mountComponent({\n          name: 'Inbox',\n          props: {\n            open,\n            renderNotification: renderNotification\n              ? (el, notification) => mountElement(el, renderNotification(notification))\n              : undefined,\n            renderBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : undefined,\n            onNotificationClick,\n            onPrimaryActionClick,\n            onSecondaryActionClick,\n            placementOffset,\n            placement,\n          },\n          element,\n        });\n      }\n\n      return novuUI.mountComponent({\n        name: 'Inbox',\n        props: {\n          open,\n          renderSubject: renderSubject\n            ? (el, notification) => mountElement(el, renderSubject(notification))\n            : undefined,\n          renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : undefined,\n          renderBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : undefined,\n          onNotificationClick,\n          onPrimaryActionClick,\n          onSecondaryActionClick,\n          placementOffset,\n          placement,\n        },\n        element,\n      });\n    },\n    [\n      open,\n      renderNotification,\n      renderSubject,\n      renderBody,\n      renderBell,\n      onNotificationClick,\n      onPrimaryActionClick,\n      onSecondaryActionClick,\n    ]\n  );\n\n  return <Mounter mount={mount} />;\n};\n\nexport const Inbox = React.memo((props: InboxProps) => {\n  const { subscriberId, ...propsWithoutSubscriberId } = props;\n  const subscriber = buildSubscriber({ subscriberId: props.subscriberId, subscriber: props.subscriber });\n  const applicationIdentifier = props.applicationIdentifier ? props.applicationIdentifier : ''; // for keyless we provide an empty string, the api will generate a identifier\n  const novu = useUnsafeNovu();\n\n  if (novu) {\n    return (\n      <InboxChild {...propsWithoutSubscriberId} applicationIdentifier={applicationIdentifier} subscriber={subscriber} />\n    );\n  }\n\n  const providerProps = {\n    applicationIdentifier,\n    subscriberHash: props.subscriberHash,\n    backendUrl: props.backendUrl,\n    socketUrl: props.socketUrl,\n    subscriber,\n  } satisfies StandardNovuOptions;\n\n  return (\n    <InternalNovuProvider {...providerProps} userAgentType=\"components\">\n      <InboxChild {...propsWithoutSubscriberId} applicationIdentifier={applicationIdentifier} subscriber={subscriber} />\n    </InternalNovuProvider>\n  );\n});\n\nconst InboxChild = withRenderer(\n  React.memo((props: InboxProps) => {\n    const {\n      localization,\n      appearance,\n      tabs,\n      preferencesFilter,\n      preferenceGroups,\n      routerPush,\n      applicationIdentifier = '', // for keyless we provide an empty string, the api will generate a identifier\n      subscriberId,\n      subscriberHash,\n      backendUrl,\n      socketUrl,\n      subscriber,\n    } = props;\n    const novu = useNovu();\n\n    const options = useMemo(() => {\n      return {\n        localization,\n        appearance,\n        tabs,\n        preferencesFilter,\n        preferenceGroups,\n        routerPush,\n        options: {\n          applicationIdentifier,\n          subscriberHash,\n          backendUrl,\n          socketUrl,\n          subscriber: buildSubscriber({ subscriberId, subscriber }),\n        },\n      };\n    }, [\n      localization,\n      appearance,\n      tabs,\n      preferencesFilter,\n      preferenceGroups,\n      applicationIdentifier,\n      subscriberId,\n      subscriberHash,\n      backendUrl,\n      socketUrl,\n      subscriber,\n    ]);\n\n    if (isWithChildrenProps(props)) {\n      return (\n        <NovuUI options={options} novu={novu}>\n          {props.children}\n        </NovuUI>\n      );\n    }\n\n    const {\n      open,\n      renderNotification,\n      renderSubject,\n      renderBody,\n      renderBell,\n      onNotificationClick,\n      onPrimaryActionClick,\n      onSecondaryActionClick,\n      placementOffset,\n      placement,\n    } = props;\n\n    return (\n      <NovuUI options={options} novu={novu}>\n        <DefaultInbox\n          open={open}\n          renderNotification={renderNotification}\n          renderSubject={renderSubject}\n          renderBody={renderBody}\n          renderBell={renderBell}\n          onNotificationClick={onNotificationClick}\n          onPrimaryActionClick={onPrimaryActionClick}\n          onSecondaryActionClick={onSecondaryActionClick}\n          placement={placement}\n          placementOffset={placementOffset}\n        />\n      </NovuUI>\n    );\n  })\n);\n\nfunction isWithChildrenProps(props: InboxProps): props is WithChildrenProps {\n  return 'children' in props;\n}\n"],"mappings":"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","names":[]}

package/dist/esm/components/InboxContent.d.ts

@@ -1,5 +1,5 @@
-import React__default from 'react';
 import { NotificationClickHandler, NotificationActionClickHandler, InboxPage } from '@novu/js/ui';
+import React__default from 'react';
 import { NotificationRendererProps, SubjectBodyRendererProps, NoRendererProps } from '../utils/types.js';
 import '@novu/js';
 

package/dist/esm/components/InboxContent.js

@@ -1,8 +1,8 @@
 // src/components/InboxContent.tsx
 import React from "react";
-import { Mounter } from "./Mounter.js";
-import { useRenderer } from "../context/RendererContext.js";
 import { useNovuUI } from "../context/NovuUIContext.js";
+import { useRenderer } from "../context/RendererContext.js";
+import { Mounter } from "./Mounter.js";
 import { withRenderer } from "./Renderer.js";
 import { jsx } from "react/jsx-runtime";
 var _InboxContent = React.memo((props) => {

package/dist/esm/components/InboxContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/InboxContent.tsx"],"sourcesContent":["import React from 'react';\nimport type { NotificationClickHandler, NotificationActionClickHandler, InboxPage } from '@novu/js/ui';\nimport { Mounter } from './Mounter';\nimport { NoRendererProps, SubjectBodyRendererProps, NotificationRendererProps } from '../utils/types';\nimport { useRenderer } from '../context/RendererContext';\nimport { useNovuUI } from '../context/NovuUIContext';\nimport { withRenderer } from './Renderer';\n\nexport type InboxContentProps = {\n  onNotificationClick?: NotificationClickHandler;\n  onPrimaryActionClick?: NotificationActionClickHandler;\n  onSecondaryActionClick?: NotificationActionClickHandler;\n  initialPage?: InboxPage;\n  hideNav?: boolean;\n} & (NotificationRendererProps | SubjectBodyRendererProps | NoRendererProps);\n\nconst _InboxContent = React.memo((props: InboxContentProps) => {\n  const {\n    onNotificationClick,\n    onPrimaryActionClick,\n    renderNotification,\n    renderSubject,\n    renderBody,\n    onSecondaryActionClick,\n    initialPage,\n    hideNav,\n  } = props;\n  const { novuUI } = useNovuUI();\n  const { mountElement } = useRenderer();\n\n  const mount = React.useCallback(\n    (element: HTMLElement) => {\n      if (renderNotification) {\n        return novuUI.mountComponent({\n          name: 'InboxContent',\n          element,\n          props: {\n            renderNotification: renderNotification\n              ? (el, notification) => mountElement(el, renderNotification(notification))\n              : undefined,\n            onNotificationClick,\n            onPrimaryActionClick,\n            onSecondaryActionClick,\n            initialPage,\n            hideNav,\n          },\n        });\n      }\n\n      return novuUI.mountComponent({\n        name: 'InboxContent',\n        element,\n        props: {\n          renderSubject: renderSubject\n            ? (el, notification) => mountElement(el, renderSubject(notification))\n            : undefined,\n          renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : undefined,\n          onNotificationClick,\n          onPrimaryActionClick,\n          onSecondaryActionClick,\n          initialPage,\n          hideNav,\n        },\n      });\n    },\n    [renderNotification, renderSubject, renderBody, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n  );\n\n  return <Mounter mount={mount} />;\n});\n\nexport const InboxContent = withRenderer(_InboxContent);\n"],"mappings":";AAAA,OAAO,WAAW;AAElB,SAAS,eAAe;AAExB,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB;AAC1B,SAAS,oBAAoB;AA8DpB;AApDT,IAAM,gBAAgB,MAAM,KAAK,CAAC,UAA6B;AAC7D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,OAAO,IAAI,UAAU;AAC7B,QAAM,EAAE,aAAa,IAAI,YAAY;AAErC,QAAM,QAAQ,MAAM;AAAA,IAClB,CAAC,YAAyB;AACxB,UAAI,oBAAoB;AACtB,eAAO,OAAO,eAAe;AAAA,UAC3B,MAAM;AAAA,UACN;AAAA,UACA,OAAO;AAAA,YACL,oBAAoB,qBAChB,CAAC,IAAI,iBAAiB,aAAa,IAAI,mBAAmB,YAAY,CAAC,IACvE;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA,QACF,CAAC;AAAA,MACH;AAEA,aAAO,OAAO,eAAe;AAAA,QAC3B,MAAM;AAAA,QACN;AAAA,QACA,OAAO;AAAA,UACL,eAAe,gBACX,CAAC,IAAI,iBAAiB,aAAa,IAAI,cAAc,YAAY,CAAC,IAClE;AAAA,UACJ,YAAY,aAAa,CAAC,IAAI,iBAAiB,aAAa,IAAI,WAAW,YAAY,CAAC,IAAI;AAAA,UAC5F;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IACA,CAAC,oBAAoB,eAAe,YAAY,qBAAqB,sBAAsB,sBAAsB;AAAA,EACnH;AAEA,SAAO,oBAAC,WAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,eAAe,aAAa,aAAa;","names":[]}
+{"version":3,"sources":["../../../src/components/InboxContent.tsx"],"sourcesContent":["import type { InboxPage, NotificationActionClickHandler, NotificationClickHandler } from '@novu/js/ui';\nimport React from 'react';\nimport { useNovuUI } from '../context/NovuUIContext';\nimport { useRenderer } from '../context/RendererContext';\nimport { NoRendererProps, NotificationRendererProps, SubjectBodyRendererProps } from '../utils/types';\nimport { Mounter } from './Mounter';\nimport { withRenderer } from './Renderer';\n\nexport type InboxContentProps = {\n  onNotificationClick?: NotificationClickHandler;\n  onPrimaryActionClick?: NotificationActionClickHandler;\n  onSecondaryActionClick?: NotificationActionClickHandler;\n  initialPage?: InboxPage;\n  hideNav?: boolean;\n} & (NotificationRendererProps | SubjectBodyRendererProps | NoRendererProps);\n\nconst _InboxContent = React.memo((props: InboxContentProps) => {\n  const {\n    onNotificationClick,\n    onPrimaryActionClick,\n    renderNotification,\n    renderSubject,\n    renderBody,\n    onSecondaryActionClick,\n    initialPage,\n    hideNav,\n  } = props;\n  const { novuUI } = useNovuUI();\n  const { mountElement } = useRenderer();\n\n  const mount = React.useCallback(\n    (element: HTMLElement) => {\n      if (renderNotification) {\n        return novuUI.mountComponent({\n          name: 'InboxContent',\n          element,\n          props: {\n            renderNotification: renderNotification\n              ? (el, notification) => mountElement(el, renderNotification(notification))\n              : undefined,\n            onNotificationClick,\n            onPrimaryActionClick,\n            onSecondaryActionClick,\n            initialPage,\n            hideNav,\n          },\n        });\n      }\n\n      return novuUI.mountComponent({\n        name: 'InboxContent',\n        element,\n        props: {\n          renderSubject: renderSubject\n            ? (el, notification) => mountElement(el, renderSubject(notification))\n            : undefined,\n          renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : undefined,\n          onNotificationClick,\n          onPrimaryActionClick,\n          onSecondaryActionClick,\n          initialPage,\n          hideNav,\n        },\n      });\n    },\n    [renderNotification, renderSubject, renderBody, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n  );\n\n  return <Mounter mount={mount} />;\n});\n\nexport const InboxContent = withRenderer(_InboxContent);\n"],"mappings":";AACA,OAAO,WAAW;AAClB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAE5B,SAAS,eAAe;AACxB,SAAS,oBAAoB;AA8DpB;AApDT,IAAM,gBAAgB,MAAM,KAAK,CAAC,UAA6B;AAC7D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,OAAO,IAAI,UAAU;AAC7B,QAAM,EAAE,aAAa,IAAI,YAAY;AAErC,QAAM,QAAQ,MAAM;AAAA,IAClB,CAAC,YAAyB;AACxB,UAAI,oBAAoB;AACtB,eAAO,OAAO,eAAe;AAAA,UAC3B,MAAM;AAAA,UACN;AAAA,UACA,OAAO;AAAA,YACL,oBAAoB,qBAChB,CAAC,IAAI,iBAAiB,aAAa,IAAI,mBAAmB,YAAY,CAAC,IACvE;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA,QACF,CAAC;AAAA,MACH;AAEA,aAAO,OAAO,eAAe;AAAA,QAC3B,MAAM;AAAA,QACN;AAAA,QACA,OAAO;AAAA,UACL,eAAe,gBACX,CAAC,IAAI,iBAAiB,aAAa,IAAI,cAAc,YAAY,CAAC,IAClE;AAAA,UACJ,YAAY,aAAa,CAAC,IAAI,iBAAiB,aAAa,IAAI,WAAW,YAAY,CAAC,IAAI;AAAA,UAC5F;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IACA,CAAC,oBAAoB,eAAe,YAAY,qBAAqB,sBAAsB,sBAAsB;AAAA,EACnH;AAEA,SAAO,oBAAC,WAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,eAAe,aAAa,aAAa;","names":[]}

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

@@ -1,5 +1,5 @@
-import React__default from 'react';
 import { NotificationClickHandler, NotificationActionClickHandler } from '@novu/js/ui';
+import React__default from 'react';
 import { NotificationRendererProps, SubjectBodyRendererProps, NoRendererProps } from '../utils/types.js';
 import '@novu/js';
 

package/dist/esm/components/Notifications.js

@@ -1,8 +1,8 @@
 // src/components/Notifications.tsx
 import React from "react";
-import { Mounter } from "./Mounter.js";
-import { useRenderer } from "../context/RendererContext.js";
 import { useNovuUI } from "../context/NovuUIContext.js";
+import { useRenderer } from "../context/RendererContext.js";
+import { Mounter } from "./Mounter.js";
 import { withRenderer } from "./Renderer.js";
 import { jsx } from "react/jsx-runtime";
 var _Notifications = React.memo((props) => {

package/dist/esm/components/Notifications.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Notifications.tsx"],"sourcesContent":["import React from 'react';\nimport type { NotificationClickHandler, NotificationActionClickHandler } from '@novu/js/ui';\nimport { Mounter } from './Mounter';\nimport { NoRendererProps, NotificationRendererProps, SubjectBodyRendererProps } from '../utils/types';\nimport { useRenderer } from '../context/RendererContext';\nimport { useNovuUI } from '../context/NovuUIContext';\nimport { withRenderer } from './Renderer';\n\nexport type NotificationProps = {\n  onNotificationClick?: NotificationClickHandler;\n  onPrimaryActionClick?: NotificationActionClickHandler;\n  onSecondaryActionClick?: NotificationActionClickHandler;\n} & (NotificationRendererProps | SubjectBodyRendererProps | NoRendererProps);\n\nconst _Notifications = React.memo((props: NotificationProps) => {\n  const {\n    renderNotification,\n    renderSubject,\n    renderBody,\n    onNotificationClick,\n    onPrimaryActionClick,\n    onSecondaryActionClick,\n  } = props;\n  const { novuUI } = useNovuUI();\n  const { mountElement } = useRenderer();\n\n  const mount = React.useCallback(\n    (element: HTMLElement) => {\n      if (renderNotification) {\n        return novuUI.mountComponent({\n          name: 'Notifications',\n          element,\n          props: {\n            renderNotification: renderNotification\n              ? (el, notification) => mountElement(el, renderNotification(notification))\n              : undefined,\n            onNotificationClick,\n            onPrimaryActionClick,\n            onSecondaryActionClick,\n          },\n        });\n      }\n\n      return novuUI.mountComponent({\n        name: 'Notifications',\n        element,\n        props: {\n          renderSubject: renderSubject\n            ? (el, notification) => mountElement(el, renderSubject(notification))\n            : undefined,\n          renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : undefined,\n          onNotificationClick,\n          onPrimaryActionClick,\n          onSecondaryActionClick,\n        },\n      });\n    },\n    [renderNotification, renderSubject, renderBody, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n  );\n\n  return <Mounter mount={mount} />;\n});\n\nexport const Notifications = withRenderer(_Notifications);\n"],"mappings":";AAAA,OAAO,WAAW;AAElB,SAAS,eAAe;AAExB,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB;AAC1B,SAAS,oBAAoB;AAsDpB;AA9CT,IAAM,iBAAiB,MAAM,KAAK,CAAC,UAA6B;AAC9D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,OAAO,IAAI,UAAU;AAC7B,QAAM,EAAE,aAAa,IAAI,YAAY;AAErC,QAAM,QAAQ,MAAM;AAAA,IAClB,CAAC,YAAyB;AACxB,UAAI,oBAAoB;AACtB,eAAO,OAAO,eAAe;AAAA,UAC3B,MAAM;AAAA,UACN;AAAA,UACA,OAAO;AAAA,YACL,oBAAoB,qBAChB,CAAC,IAAI,iBAAiB,aAAa,IAAI,mBAAmB,YAAY,CAAC,IACvE;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA,QACF,CAAC;AAAA,MACH;AAEA,aAAO,OAAO,eAAe;AAAA,QAC3B,MAAM;AAAA,QACN;AAAA,QACA,OAAO;AAAA,UACL,eAAe,gBACX,CAAC,IAAI,iBAAiB,aAAa,IAAI,cAAc,YAAY,CAAC,IAClE;AAAA,UACJ,YAAY,aAAa,CAAC,IAAI,iBAAiB,aAAa,IAAI,WAAW,YAAY,CAAC,IAAI;AAAA,UAC5F;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IACA,CAAC,oBAAoB,eAAe,YAAY,qBAAqB,sBAAsB,sBAAsB;AAAA,EACnH;AAEA,SAAO,oBAAC,WAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,gBAAgB,aAAa,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/Notifications.tsx"],"sourcesContent":["import type { NotificationActionClickHandler, NotificationClickHandler } from '@novu/js/ui';\nimport React from 'react';\nimport { useNovuUI } from '../context/NovuUIContext';\nimport { useRenderer } from '../context/RendererContext';\nimport { NoRendererProps, NotificationRendererProps, SubjectBodyRendererProps } from '../utils/types';\nimport { Mounter } from './Mounter';\nimport { withRenderer } from './Renderer';\n\nexport type NotificationProps = {\n  onNotificationClick?: NotificationClickHandler;\n  onPrimaryActionClick?: NotificationActionClickHandler;\n  onSecondaryActionClick?: NotificationActionClickHandler;\n} & (NotificationRendererProps | SubjectBodyRendererProps | NoRendererProps);\n\nconst _Notifications = React.memo((props: NotificationProps) => {\n  const {\n    renderNotification,\n    renderSubject,\n    renderBody,\n    onNotificationClick,\n    onPrimaryActionClick,\n    onSecondaryActionClick,\n  } = props;\n  const { novuUI } = useNovuUI();\n  const { mountElement } = useRenderer();\n\n  const mount = React.useCallback(\n    (element: HTMLElement) => {\n      if (renderNotification) {\n        return novuUI.mountComponent({\n          name: 'Notifications',\n          element,\n          props: {\n            renderNotification: renderNotification\n              ? (el, notification) => mountElement(el, renderNotification(notification))\n              : undefined,\n            onNotificationClick,\n            onPrimaryActionClick,\n            onSecondaryActionClick,\n          },\n        });\n      }\n\n      return novuUI.mountComponent({\n        name: 'Notifications',\n        element,\n        props: {\n          renderSubject: renderSubject\n            ? (el, notification) => mountElement(el, renderSubject(notification))\n            : undefined,\n          renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : undefined,\n          onNotificationClick,\n          onPrimaryActionClick,\n          onSecondaryActionClick,\n        },\n      });\n    },\n    [renderNotification, renderSubject, renderBody, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]\n  );\n\n  return <Mounter mount={mount} />;\n});\n\nexport const Notifications = withRenderer(_Notifications);\n"],"mappings":";AACA,OAAO,WAAW;AAClB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAE5B,SAAS,eAAe;AACxB,SAAS,oBAAoB;AAsDpB;AA9CT,IAAM,iBAAiB,MAAM,KAAK,CAAC,UAA6B;AAC9D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,OAAO,IAAI,UAAU;AAC7B,QAAM,EAAE,aAAa,IAAI,YAAY;AAErC,QAAM,QAAQ,MAAM;AAAA,IAClB,CAAC,YAAyB;AACxB,UAAI,oBAAoB;AACtB,eAAO,OAAO,eAAe;AAAA,UAC3B,MAAM;AAAA,UACN;AAAA,UACA,OAAO;AAAA,YACL,oBAAoB,qBAChB,CAAC,IAAI,iBAAiB,aAAa,IAAI,mBAAmB,YAAY,CAAC,IACvE;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA,QACF,CAAC;AAAA,MACH;AAEA,aAAO,OAAO,eAAe;AAAA,QAC3B,MAAM;AAAA,QACN;AAAA,QACA,OAAO;AAAA,UACL,eAAe,gBACX,CAAC,IAAI,iBAAiB,aAAa,IAAI,cAAc,YAAY,CAAC,IAClE;AAAA,UACJ,YAAY,aAAa,CAAC,IAAI,iBAAiB,aAAa,IAAI,WAAW,YAAY,CAAC,IAAI;AAAA,UAC5F;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IACA,CAAC,oBAAoB,eAAe,YAAY,qBAAqB,sBAAsB,sBAAsB;AAAA,EACnH;AAEA,SAAO,oBAAC,WAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,gBAAgB,aAAa,cAAc;","names":[]}

package/dist/esm/components/NovuUI.js

@@ -2,9 +2,9 @@
 import { NovuUI as NovuUIClass } from "@novu/js/ui";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { NovuUIProvider } from "../context/NovuUIContext.js";
+import { useRenderer } from "../context/RendererContext.js";
 import { useDataRef } from "../hooks/internal/useDataRef.js";
 import { adaptAppearanceForJs } from "../utils/appearance.js";
-import { useRenderer } from "../context/RendererContext.js";
 import { ShadowRootDetector } from "./ShadowRootDetector.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var findParentShadowRoot = (child) => {

package/dist/esm/components/NovuUI.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/NovuUI.tsx"],"sourcesContent":["import { Novu } from '@novu/js';\nimport type { NovuUIOptions as JsNovuUIOptions } from '@novu/js/ui';\nimport { NovuUI as NovuUIClass } from '@novu/js/ui';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport { NovuUIProvider } from '../context/NovuUIContext';\nimport { useDataRef } from '../hooks/internal/useDataRef';\nimport type { ReactAppearance } from '../utils/types';\nimport { adaptAppearanceForJs } from '../utils/appearance';\nimport { useRenderer } from '../context/RendererContext';\nimport { ShadowRootDetector } from './ShadowRootDetector';\n\ntype NovuUIProps = Omit<JsNovuUIOptions, 'appearance'> & {\n  appearance?: ReactAppearance;\n};\n\ntype RendererProps = React.PropsWithChildren<{\n  options: NovuUIProps;\n  novu?: Novu;\n}>;\n\nconst findParentShadowRoot = (child?: HTMLDivElement | null): Node | null => {\n  if (!child) {\n    return null;\n  }\n\n  let node: Node | null = child;\n\n  while (node) {\n    if (node instanceof Element && node.shadowRoot) {\n      return node.shadowRoot;\n    }\n\n    if (node instanceof ShadowRoot) {\n      return node;\n    }\n\n    node = node.parentNode;\n\n    if (!node || node === document) {\n      break;\n    }\n  }\n\n  return null;\n};\n\nexport const NovuUI = ({ options, novu, children }: RendererProps) => {\n  const shadowRootDetector = useRef<HTMLDivElement>(null);\n  const { mountElement } = useRenderer();\n\n  const adaptedAppearanceForUpdate = useMemo(\n    () => adaptAppearanceForJs(options.appearance || {}, mountElement),\n    [options.appearance, mountElement]\n  );\n\n  const adaptedOptions = useMemo(() => {\n    return {\n      ...options,\n      appearance: adaptedAppearanceForUpdate,\n      novu,\n    };\n  }, [options, novu, adaptedAppearanceForUpdate]);\n\n  const optionsRef = useDataRef(adaptedOptions);\n  const [novuUI, setNovuUI] = useState<NovuUIClass | undefined>();\n\n  useEffect(() => {\n    const parentShadowRoot = findParentShadowRoot(shadowRootDetector.current);\n    const instance = new NovuUIClass({\n      ...optionsRef.current,\n      container: optionsRef.current.container ?? parentShadowRoot,\n    });\n    setNovuUI(instance);\n\n    return () => {\n      instance.unmount();\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!novuUI) {\n      return;\n    }\n\n    const parentShadowRoot = findParentShadowRoot(shadowRootDetector.current);\n    novuUI.updateContainer(options.container ?? parentShadowRoot);\n    novuUI.updateAppearance(adaptedAppearanceForUpdate);\n    novuUI.updateLocalization(options.localization);\n    novuUI.updateTabs(options.tabs);\n    novuUI.updateOptions(options.options);\n    novuUI.updateRouterPush(options.routerPush);\n  }, [\n    shadowRootDetector,\n    novuUI,\n    adaptedAppearanceForUpdate,\n    options.localization,\n    options.tabs,\n    options.options,\n    options.routerPush,\n  ]);\n\n  return (\n    <>\n      <ShadowRootDetector ref={shadowRootDetector} />\n      {novuUI && <NovuUIProvider value={{ novuUI }}>{children}</NovuUIProvider>}\n    </>\n  );\n};\n"],"mappings":";AAEA,SAAS,UAAU,mBAAmB;AACtC,SAAgB,WAAW,SAAS,QAAQ,gBAAgB;AAC5D,SAAS,sBAAsB;AAC/B,SAAS,kBAAkB;AAE3B,SAAS,4BAA4B;AACrC,SAAS,mBAAmB;AAC5B,SAAS,0BAA0B;AA6F/B,mBACE,KADF;AAlFJ,IAAM,uBAAuB,CAAC,UAA+C;AAC3E,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,MAAI,OAAoB;AAExB,SAAO,MAAM;AACX,QAAI,gBAAgB,WAAW,KAAK,YAAY;AAC9C,aAAO,KAAK;AAAA,IACd;AAEA,QAAI,gBAAgB,YAAY;AAC9B,aAAO;AAAA,IACT;AAEA,WAAO,KAAK;AAEZ,QAAI,CAAC,QAAQ,SAAS,UAAU;AAC9B;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;AAEO,IAAM,SAAS,CAAC,EAAE,SAAS,MAAM,SAAS,MAAqB;AACpE,QAAM,qBAAqB,OAAuB,IAAI;AACtD,QAAM,EAAE,aAAa,IAAI,YAAY;AAErC,QAAM,6BAA6B;AAAA,IACjC,MAAM,qBAAqB,QAAQ,cAAc,CAAC,GAAG,YAAY;AAAA,IACjE,CAAC,QAAQ,YAAY,YAAY;AAAA,EACnC;AAEA,QAAM,iBAAiB,QAAQ,MAAM;AACnC,WAAO;AAAA,MACL,GAAG;AAAA,MACH,YAAY;AAAA,MACZ;AAAA,IACF;AAAA,EACF,GAAG,CAAC,SAAS,MAAM,0BAA0B,CAAC;AAE9C,QAAM,aAAa,WAAW,cAAc;AAC5C,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAkC;AAE9D,YAAU,MAAM;AACd,UAAM,mBAAmB,qBAAqB,mBAAmB,OAAO;AACxE,UAAM,WAAW,IAAI,YAAY;AAAA,MAC/B,GAAG,WAAW;AAAA,MACd,WAAW,WAAW,QAAQ,aAAa;AAAA,IAC7C,CAAC;AACD,cAAU,QAAQ;AAElB,WAAO,MAAM;AACX,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,QAAI,CAAC,QAAQ;AACX;AAAA,IACF;AAEA,UAAM,mBAAmB,qBAAqB,mBAAmB,OAAO;AACxE,WAAO,gBAAgB,QAAQ,aAAa,gBAAgB;AAC5D,WAAO,iBAAiB,0BAA0B;AAClD,WAAO,mBAAmB,QAAQ,YAAY;AAC9C,WAAO,WAAW,QAAQ,IAAI;AAC9B,WAAO,cAAc,QAAQ,OAAO;AACpC,WAAO,iBAAiB,QAAQ,UAAU;AAAA,EAC5C,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,EACV,CAAC;AAED,SACE,iCACE;AAAA,wBAAC,sBAAmB,KAAK,oBAAoB;AAAA,IAC5C,UAAU,oBAAC,kBAAe,OAAO,EAAE,OAAO,GAAI,UAAS;AAAA,KAC1D;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/NovuUI.tsx"],"sourcesContent":["import { Novu } from '@novu/js';\nimport type { NovuUIOptions as JsNovuUIOptions } from '@novu/js/ui';\nimport { NovuUI as NovuUIClass } from '@novu/js/ui';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport { NovuUIProvider } from '../context/NovuUIContext';\nimport { useRenderer } from '../context/RendererContext';\nimport { useDataRef } from '../hooks/internal/useDataRef';\nimport { adaptAppearanceForJs } from '../utils/appearance';\nimport type { ReactAppearance } from '../utils/types';\nimport { ShadowRootDetector } from './ShadowRootDetector';\n\ntype NovuUIProps = Omit<JsNovuUIOptions, 'appearance'> & {\n  appearance?: ReactAppearance;\n};\n\ntype RendererProps = React.PropsWithChildren<{\n  options: NovuUIProps;\n  novu?: Novu;\n}>;\n\nconst findParentShadowRoot = (child?: HTMLDivElement | null): Node | null => {\n  if (!child) {\n    return null;\n  }\n\n  let node: Node | null = child;\n\n  while (node) {\n    if (node instanceof Element && node.shadowRoot) {\n      return node.shadowRoot;\n    }\n\n    if (node instanceof ShadowRoot) {\n      return node;\n    }\n\n    node = node.parentNode;\n\n    if (!node || node === document) {\n      break;\n    }\n  }\n\n  return null;\n};\n\nexport const NovuUI = ({ options, novu, children }: RendererProps) => {\n  const shadowRootDetector = useRef<HTMLDivElement>(null);\n  const { mountElement } = useRenderer();\n\n  const adaptedAppearanceForUpdate = useMemo(\n    () => adaptAppearanceForJs(options.appearance || {}, mountElement),\n    [options.appearance, mountElement]\n  );\n\n  const adaptedOptions = useMemo(() => {\n    return {\n      ...options,\n      appearance: adaptedAppearanceForUpdate,\n      novu,\n    };\n  }, [options, novu, adaptedAppearanceForUpdate]);\n\n  const optionsRef = useDataRef(adaptedOptions);\n  const [novuUI, setNovuUI] = useState<NovuUIClass | undefined>();\n\n  useEffect(() => {\n    const parentShadowRoot = findParentShadowRoot(shadowRootDetector.current);\n    const instance = new NovuUIClass({\n      ...optionsRef.current,\n      container: optionsRef.current.container ?? parentShadowRoot,\n    });\n    setNovuUI(instance);\n\n    return () => {\n      instance.unmount();\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!novuUI) {\n      return;\n    }\n\n    const parentShadowRoot = findParentShadowRoot(shadowRootDetector.current);\n    novuUI.updateContainer(options.container ?? parentShadowRoot);\n    novuUI.updateAppearance(adaptedAppearanceForUpdate);\n    novuUI.updateLocalization(options.localization);\n    novuUI.updateTabs(options.tabs);\n    novuUI.updateOptions(options.options);\n    novuUI.updateRouterPush(options.routerPush);\n  }, [\n    shadowRootDetector,\n    novuUI,\n    adaptedAppearanceForUpdate,\n    options.localization,\n    options.tabs,\n    options.options,\n    options.routerPush,\n  ]);\n\n  return (\n    <>\n      <ShadowRootDetector ref={shadowRootDetector} />\n      {novuUI && <NovuUIProvider value={{ novuUI }}>{children}</NovuUIProvider>}\n    </>\n  );\n};\n"],"mappings":";AAEA,SAAS,UAAU,mBAAmB;AACtC,SAAgB,WAAW,SAAS,QAAQ,gBAAgB;AAC5D,SAAS,sBAAsB;AAC/B,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,4BAA4B;AAErC,SAAS,0BAA0B;AA6F/B,mBACE,KADF;AAlFJ,IAAM,uBAAuB,CAAC,UAA+C;AAC3E,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,MAAI,OAAoB;AAExB,SAAO,MAAM;AACX,QAAI,gBAAgB,WAAW,KAAK,YAAY;AAC9C,aAAO,KAAK;AAAA,IACd;AAEA,QAAI,gBAAgB,YAAY;AAC9B,aAAO;AAAA,IACT;AAEA,WAAO,KAAK;AAEZ,QAAI,CAAC,QAAQ,SAAS,UAAU;AAC9B;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;AAEO,IAAM,SAAS,CAAC,EAAE,SAAS,MAAM,SAAS,MAAqB;AACpE,QAAM,qBAAqB,OAAuB,IAAI;AACtD,QAAM,EAAE,aAAa,IAAI,YAAY;AAErC,QAAM,6BAA6B;AAAA,IACjC,MAAM,qBAAqB,QAAQ,cAAc,CAAC,GAAG,YAAY;AAAA,IACjE,CAAC,QAAQ,YAAY,YAAY;AAAA,EACnC;AAEA,QAAM,iBAAiB,QAAQ,MAAM;AACnC,WAAO;AAAA,MACL,GAAG;AAAA,MACH,YAAY;AAAA,MACZ;AAAA,IACF;AAAA,EACF,GAAG,CAAC,SAAS,MAAM,0BAA0B,CAAC;AAE9C,QAAM,aAAa,WAAW,cAAc;AAC5C,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAkC;AAE9D,YAAU,MAAM;AACd,UAAM,mBAAmB,qBAAqB,mBAAmB,OAAO;AACxE,UAAM,WAAW,IAAI,YAAY;AAAA,MAC/B,GAAG,WAAW;AAAA,MACd,WAAW,WAAW,QAAQ,aAAa;AAAA,IAC7C,CAAC;AACD,cAAU,QAAQ;AAElB,WAAO,MAAM;AACX,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,QAAI,CAAC,QAAQ;AACX;AAAA,IACF;AAEA,UAAM,mBAAmB,qBAAqB,mBAAmB,OAAO;AACxE,WAAO,gBAAgB,QAAQ,aAAa,gBAAgB;AAC5D,WAAO,iBAAiB,0BAA0B;AAClD,WAAO,mBAAmB,QAAQ,YAAY;AAC9C,WAAO,WAAW,QAAQ,IAAI;AAC9B,WAAO,cAAc,QAAQ,OAAO;AACpC,WAAO,iBAAiB,QAAQ,UAAU;AAAA,EAC5C,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,EACV,CAAC;AAED,SACE,iCACE;AAAA,wBAAC,sBAAmB,KAAK,oBAAoB;AAAA,IAC5C,UAAU,oBAAC,kBAAe,OAAO,EAAE,OAAO,GAAI,UAAS;AAAA,KAC1D;AAEJ;","names":[]}

package/dist/esm/components/Preferences.js

@@ -1,7 +1,7 @@
 // src/components/Preferences.tsx
 import React from "react";
-import { Mounter } from "./Mounter.js";
 import { useNovuUI } from "../context/NovuUIContext.js";
+import { Mounter } from "./Mounter.js";
 import { jsx } from "react/jsx-runtime";
 var Preferences = () => {
   const { novuUI } = useNovuUI();

package/dist/esm/components/Preferences.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Preferences.tsx"],"sourcesContent":["import React from 'react';\nimport { Mounter } from './Mounter';\nimport { useNovuUI } from '../context/NovuUIContext';\n\nexport const Preferences = () => {\n  const { novuUI } = useNovuUI();\n\n  const mount = React.useCallback((element: HTMLElement) => {\n    return novuUI.mountComponent({\n      name: 'Preferences',\n      element,\n    });\n  }, []);\n\n  return <Mounter mount={mount} />;\n};\n"],"mappings":";AAAA,OAAO,WAAW;AAClB,SAAS,eAAe;AACxB,SAAS,iBAAiB;AAYjB;AAVF,IAAM,cAAc,MAAM;AAC/B,QAAM,EAAE,OAAO,IAAI,UAAU;AAE7B,QAAM,QAAQ,MAAM,YAAY,CAAC,YAAyB;AACxD,WAAO,OAAO,eAAe;AAAA,MAC3B,MAAM;AAAA,MACN;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,SAAO,oBAAC,WAAQ,OAAc;AAChC;","names":[]}
+{"version":3,"sources":["../../../src/components/Preferences.tsx"],"sourcesContent":["import React from 'react';\nimport { useNovuUI } from '../context/NovuUIContext';\nimport { Mounter } from './Mounter';\n\nexport const Preferences = () => {\n  const { novuUI } = useNovuUI();\n\n  const mount = React.useCallback((element: HTMLElement) => {\n    return novuUI.mountComponent({\n      name: 'Preferences',\n      element,\n    });\n  }, []);\n\n  return <Mounter mount={mount} />;\n};\n"],"mappings":";AAAA,OAAO,WAAW;AAClB,SAAS,iBAAiB;AAC1B,SAAS,eAAe;AAYf;AAVF,IAAM,cAAc,MAAM;AAC/B,QAAM,EAAE,OAAO,IAAI,UAAU;AAE7B,QAAM,QAAQ,MAAM,YAAY,CAAC,YAAyB;AACxD,WAAO,OAAO,eAAe;AAAA,MAC3B,MAAM;AAAA,MACN;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,SAAO,oBAAC,WAAQ,OAAc;AAChC;","names":[]}