@novu/react 3.8.1 → 3.9.1

package/dist/cjs/components/Bell.cjs

@@ -48,10 +48,12 @@ var _Bell = import_react.default.memo((props) => {
       return novuUI.mountComponent({
         name: "Bell",
         element,
-        props: renderBell ? { renderBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)) } : void 0
+        props: renderBell ? {
+          renderBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount))
+        } : void 0
       });
     },
-    [renderBell]
+    [renderBell, mountElement, novuUI]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Mounter.Mounter, { mount });
 });

package/dist/cjs/components/Bell.cjs.map

@@ -1 +1 @@
-{"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;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,2BAA0B;AAC1B,6BAA4B;AAE5B,qBAAwB;AACxB,sBAA6B;AAsBpB;AAhBT,IAAM,QAAQ,aAAAA,QAAM,KAAK,CAAC,UAAqB;AAC7C,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,EAAE,OAAO,QAAI,gCAAU;AAC7B,QAAM,EAAE,aAAa,QAAI,oCAAY;AAErC,QAAM,QAAQ,aAAAA,QAAM;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,4CAAC,0BAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,WAAO,8BAAa,KAAK;","names":["React"]}
+{"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\n          ? {\n              renderBell: (el, unreadCount) => mountElement(el, renderBell(unreadCount)),\n            }\n          : undefined,\n      });\n    },\n    [renderBell, mountElement, novuUI]\n  );\n\n  return <Mounter mount={mount} />;\n});\n\nexport const Bell = withRenderer(_Bell);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,2BAA0B;AAC1B,6BAA4B;AAE5B,qBAAwB;AACxB,sBAA6B;AA0BpB;AApBT,IAAM,QAAQ,aAAAA,QAAM,KAAK,CAAC,UAAqB;AAC7C,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,EAAE,OAAO,QAAI,gCAAU;AAC7B,QAAM,EAAE,aAAa,QAAI,oCAAY;AAErC,QAAM,QAAQ,aAAAA,QAAM;AAAA,IAClB,CAAC,YAAyB;AACxB,aAAO,OAAO,eAAe;AAAA,QAC3B,MAAM;AAAA,QACN;AAAA,QACA,OAAO,aACH;AAAA,UACE,YAAY,CAAC,IAAI,gBAAgB,aAAa,IAAI,WAAW,WAAW,CAAC;AAAA,QAC3E,IACA;AAAA,MACN,CAAC;AAAA,IACH;AAAA,IACA,CAAC,YAAY,cAAc,MAAM;AAAA,EACnC;AAEA,SAAO,4CAAC,0BAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,WAAO,8BAAa,KAAK;","names":["React"]}

package/dist/cjs/components/Inbox.cjs

@@ -46,8 +46,11 @@ var DefaultInbox = (props) => {
   const {
     open,
     renderNotification,
+    renderAvatar,
     renderSubject,
     renderBody,
+    renderDefaultActions,
+    renderCustomActions,
     renderBell,
     onNotificationClick,
     onPrimaryActionClick,
@@ -79,8 +82,11 @@ var DefaultInbox = (props) => {
         name: "Inbox",
         props: {
           open,
+          renderAvatar: renderAvatar ? (el, notification) => mountElement(el, renderAvatar(notification)) : void 0,
           renderSubject: renderSubject ? (el, notification) => mountElement(el, renderSubject(notification)) : void 0,
           renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : void 0,
+          renderDefaultActions: renderDefaultActions ? (el, notification) => mountElement(el, renderDefaultActions(notification)) : void 0,
+          renderCustomActions: renderCustomActions ? (el, notification) => mountElement(el, renderCustomActions(notification)) : void 0,
           renderBell: renderBell ? (el, unreadCount) => mountElement(el, renderBell(unreadCount)) : void 0,
           onNotificationClick,
           onPrimaryActionClick,
@@ -94,8 +100,11 @@ var DefaultInbox = (props) => {
     [
       open,
       renderNotification,
+      renderAvatar,
       renderSubject,
       renderBody,
+      renderDefaultActions,
+      renderCustomActions,
       renderBell,
       onNotificationClick,
       onPrimaryActionClick,
@@ -174,8 +183,11 @@ var InboxChild = (0, import_Renderer.withRenderer)(
     const {
       open,
       renderNotification,
+      renderAvatar,
       renderSubject,
       renderBody,
+      renderDefaultActions,
+      renderCustomActions,
       renderBell,
       onNotificationClick,
       onPrimaryActionClick,
@@ -188,8 +200,11 @@ var InboxChild = (0, import_Renderer.withRenderer)(
       {
         open,
         renderNotification,
+        renderAvatar,
         renderSubject,
         renderBody,
+        renderDefaultActions,
+        renderCustomActions,
         renderBell,
         onNotificationClick,
         onPrimaryActionClick,

package/dist/cjs/components/Inbox.cjs.map

@@ -1 +1 @@
-{"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":["React"]}
+{"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    renderAvatar,\n    renderSubject,\n    renderBody,\n    renderDefaultActions,\n    renderCustomActions,\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          renderAvatar: renderAvatar ? (el, notification) => mountElement(el, renderAvatar(notification)) : undefined,\n          renderSubject: renderSubject\n            ? (el, notification) => mountElement(el, renderSubject(notification))\n            : undefined,\n          renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : undefined,\n          renderDefaultActions: renderDefaultActions\n            ? (el, notification) => mountElement(el, renderDefaultActions(notification))\n            : undefined,\n          renderCustomActions: renderCustomActions\n            ? (el, notification) => mountElement(el, renderCustomActions(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      open,\n      renderNotification,\n      renderAvatar,\n      renderSubject,\n      renderBody,\n      renderDefaultActions,\n      renderCustomActions,\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      renderAvatar,\n      renderSubject,\n      renderBody,\n      renderDefaultActions,\n      renderCustomActions,\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          renderAvatar={renderAvatar}\n          renderSubject={renderSubject}\n          renderBody={renderBody}\n          renderDefaultActions={renderDefaultActions}\n          renderCustomActions={renderCustomActions}\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":["React"]}

package/dist/cjs/components/InboxContent.cjs

@@ -44,8 +44,11 @@ var _InboxContent = import_react.default.memo((props) => {
     onNotificationClick,
     onPrimaryActionClick,
     renderNotification,
+    renderAvatar,
     renderSubject,
     renderBody,
+    renderDefaultActions,
+    renderCustomActions,
     onSecondaryActionClick,
     initialPage,
     hideNav
@@ -72,8 +75,11 @@ var _InboxContent = import_react.default.memo((props) => {
         name: "InboxContent",
         element,
         props: {
+          renderAvatar: renderAvatar ? (el, notification) => mountElement(el, renderAvatar(notification)) : void 0,
           renderSubject: renderSubject ? (el, notification) => mountElement(el, renderSubject(notification)) : void 0,
           renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : void 0,
+          renderDefaultActions: renderDefaultActions ? (el, notification) => mountElement(el, renderDefaultActions(notification)) : void 0,
+          renderCustomActions: renderCustomActions ? (el, notification) => mountElement(el, renderCustomActions(notification)) : void 0,
           onNotificationClick,
           onPrimaryActionClick,
           onSecondaryActionClick,
@@ -82,7 +88,17 @@ var _InboxContent = import_react.default.memo((props) => {
         }
       });
     },
-    [renderNotification, renderSubject, renderBody, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]
+    [
+      renderNotification,
+      renderAvatar,
+      renderSubject,
+      renderBody,
+      renderDefaultActions,
+      renderCustomActions,
+      onNotificationClick,
+      onPrimaryActionClick,
+      onSecondaryActionClick
+    ]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Mounter.Mounter, { mount });
 });

package/dist/cjs/components/InboxContent.cjs.map

@@ -1 +1 @@
-{"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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkB;AAClB,2BAA0B;AAC1B,6BAA4B;AAE5B,qBAAwB;AACxB,sBAA6B;AA8DpB;AApDT,IAAM,gBAAgB,aAAAA,QAAM,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,QAAI,gCAAU;AAC7B,QAAM,EAAE,aAAa,QAAI,oCAAY;AAErC,QAAM,QAAQ,aAAAA,QAAM;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,4CAAC,0BAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,mBAAe,8BAAa,aAAa;","names":["React"]}
+{"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    renderAvatar,\n    renderSubject,\n    renderBody,\n    renderDefaultActions,\n    renderCustomActions,\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          renderAvatar: renderAvatar ? (el, notification) => mountElement(el, renderAvatar(notification)) : undefined,\n          renderSubject: renderSubject\n            ? (el, notification) => mountElement(el, renderSubject(notification))\n            : undefined,\n          renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : undefined,\n          renderDefaultActions: renderDefaultActions\n            ? (el, notification) => mountElement(el, renderDefaultActions(notification))\n            : undefined,\n          renderCustomActions: renderCustomActions\n            ? (el, notification) => mountElement(el, renderCustomActions(notification))\n            : undefined,\n          onNotificationClick,\n          onPrimaryActionClick,\n          onSecondaryActionClick,\n          initialPage,\n          hideNav,\n        },\n      });\n    },\n    [\n      renderNotification,\n      renderAvatar,\n      renderSubject,\n      renderBody,\n      renderDefaultActions,\n      renderCustomActions,\n      onNotificationClick,\n      onPrimaryActionClick,\n      onSecondaryActionClick,\n    ]\n  );\n\n  return <Mounter mount={mount} />;\n});\n\nexport const InboxContent = withRenderer(_InboxContent);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkB;AAClB,2BAA0B;AAC1B,6BAA4B;AAE5B,qBAAwB;AACxB,sBAA6B;AAkFpB;AAxET,IAAM,gBAAgB,aAAAA,QAAM,KAAK,CAAC,UAA6B;AAC7D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,OAAO,QAAI,gCAAU;AAC7B,QAAM,EAAE,aAAa,QAAI,oCAAY;AAErC,QAAM,QAAQ,aAAAA,QAAM;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,cAAc,eAAe,CAAC,IAAI,iBAAiB,aAAa,IAAI,aAAa,YAAY,CAAC,IAAI;AAAA,UAClG,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,sBAAsB,uBAClB,CAAC,IAAI,iBAAiB,aAAa,IAAI,qBAAqB,YAAY,CAAC,IACzE;AAAA,UACJ,qBAAqB,sBACjB,CAAC,IAAI,iBAAiB,aAAa,IAAI,oBAAoB,YAAY,CAAC,IACxE;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO,4CAAC,0BAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,mBAAe,8BAAa,aAAa;","names":["React"]}

package/dist/cjs/components/Notifications.cjs

@@ -42,8 +42,11 @@ var import_jsx_runtime = require("react/jsx-runtime");
 var _Notifications = import_react.default.memo((props) => {
   const {
     renderNotification,
+    renderAvatar,
     renderSubject,
     renderBody,
+    renderDefaultActions,
+    renderCustomActions,
     onNotificationClick,
     onPrimaryActionClick,
     onSecondaryActionClick
@@ -68,15 +71,28 @@ var _Notifications = import_react.default.memo((props) => {
         name: "Notifications",
         element,
         props: {
+          renderAvatar: renderAvatar ? (el, notification) => mountElement(el, renderAvatar(notification)) : void 0,
           renderSubject: renderSubject ? (el, notification) => mountElement(el, renderSubject(notification)) : void 0,
           renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : void 0,
+          renderDefaultActions: renderDefaultActions ? (el, notification) => mountElement(el, renderDefaultActions(notification)) : void 0,
+          renderCustomActions: renderCustomActions ? (el, notification) => mountElement(el, renderCustomActions(notification)) : void 0,
           onNotificationClick,
           onPrimaryActionClick,
           onSecondaryActionClick
         }
       });
     },
-    [renderNotification, renderSubject, renderBody, onNotificationClick, onPrimaryActionClick, onSecondaryActionClick]
+    [
+      renderNotification,
+      renderAvatar,
+      renderSubject,
+      renderBody,
+      renderDefaultActions,
+      renderCustomActions,
+      onNotificationClick,
+      onPrimaryActionClick,
+      onSecondaryActionClick
+    ]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Mounter.Mounter, { mount });
 });

package/dist/cjs/components/Notifications.cjs.map

@@ -1 +1 @@
-{"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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkB;AAClB,2BAA0B;AAC1B,6BAA4B;AAE5B,qBAAwB;AACxB,sBAA6B;AAsDpB;AA9CT,IAAM,iBAAiB,aAAAA,QAAM,KAAK,CAAC,UAA6B;AAC9D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,OAAO,QAAI,gCAAU;AAC7B,QAAM,EAAE,aAAa,QAAI,oCAAY;AAErC,QAAM,QAAQ,aAAAA,QAAM;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,4CAAC,0BAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,oBAAgB,8BAAa,cAAc;","names":["React"]}
+{"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    renderAvatar,\n    renderSubject,\n    renderBody,\n    renderDefaultActions,\n    renderCustomActions,\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          renderAvatar: renderAvatar ? (el, notification) => mountElement(el, renderAvatar(notification)) : undefined,\n          renderSubject: renderSubject\n            ? (el, notification) => mountElement(el, renderSubject(notification))\n            : undefined,\n          renderBody: renderBody ? (el, notification) => mountElement(el, renderBody(notification)) : undefined,\n          renderDefaultActions: renderDefaultActions\n            ? (el, notification) => mountElement(el, renderDefaultActions(notification))\n            : undefined,\n          renderCustomActions: renderCustomActions\n            ? (el, notification) => mountElement(el, renderCustomActions(notification))\n            : undefined,\n          onNotificationClick,\n          onPrimaryActionClick,\n          onSecondaryActionClick,\n        },\n      });\n    },\n    [\n      renderNotification,\n      renderAvatar,\n      renderSubject,\n      renderBody,\n      renderDefaultActions,\n      renderCustomActions,\n      onNotificationClick,\n      onPrimaryActionClick,\n      onSecondaryActionClick,\n    ]\n  );\n\n  return <Mounter mount={mount} />;\n});\n\nexport const Notifications = withRenderer(_Notifications);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkB;AAClB,2BAA0B;AAC1B,6BAA4B;AAE5B,qBAAwB;AACxB,sBAA6B;AA0EpB;AAlET,IAAM,iBAAiB,aAAAA,QAAM,KAAK,CAAC,UAA6B;AAC9D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,OAAO,QAAI,gCAAU;AAC7B,QAAM,EAAE,aAAa,QAAI,oCAAY;AAErC,QAAM,QAAQ,aAAAA,QAAM;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,cAAc,eAAe,CAAC,IAAI,iBAAiB,aAAa,IAAI,aAAa,YAAY,CAAC,IAAI;AAAA,UAClG,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,sBAAsB,uBAClB,CAAC,IAAI,iBAAiB,aAAa,IAAI,qBAAqB,YAAY,CAAC,IACzE;AAAA,UACJ,qBAAqB,sBACjB,CAAC,IAAI,iBAAiB,aAAa,IAAI,oBAAoB,YAAY,CAAC,IACxE;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO,4CAAC,0BAAQ,OAAc;AAChC,CAAC;AAEM,IAAM,oBAAgB,8BAAa,cAAc;","names":["React"]}

package/dist/cjs/hooks/NovuProvider.cjs

@@ -30,7 +30,7 @@ var import_js = require("@novu/js");
 var import_internal = require("@novu/js/internal");
 var import_react = require("react");
 var import_jsx_runtime = require("react/jsx-runtime");
-var version = "3.8.1";
+var version = "3.9.1";
 var name = "@novu/react";
 var baseUserAgent = `${name}@${version}`;
 var NovuContext = (0, import_react.createContext)(void 0);

package/dist/cjs/hooks/useCounts.cjs

@@ -43,7 +43,8 @@ var useCounts = (props) => {
     if (notification) {
       for (let i = 0; i < existingCounts.length; i++) {
         const filter = currentFilters[i];
-        if ((0, import_js.areTagsEqual)(filter.tags, notification.tags)) {
+        const isSeverityMatches = !filter.severity || Array.isArray(filter.severity) && filter.severity.length === 0 || Array.isArray(filter.severity) && filter.severity.includes(notification.severity) || !Array.isArray(filter.severity) && filter.severity === notification.severity;
+        if ((0, import_js.areTagsEqual)(filter.tags, notification.tags) && isSeverityMatches) {
           countFiltersToFetch.push(filter);
         }
       }

package/dist/cjs/hooks/useCounts.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useCounts.ts"],"sourcesContent":["import { areTagsEqual, isSameFilter, Notification, NotificationFilter, NovuError } from '@novu/js';\nimport { useEffect, useRef, useState } from 'react';\nimport { useWebSocketEvent } from './internal/useWebsocketEvent';\nimport { useNovu } from './NovuProvider';\n\ntype Count = {\n  count: number;\n  filter: NotificationFilter;\n};\n\n/**\n * Props for the useCounts hook.\n *\n * @example\n * ```tsx\n * // Count unread notifications\n * const { counts } = useCounts({\n *   filters: [{ read: false }]\n * });\n *\n * // Count unseen notifications with specific tags\n * const { counts } = useCounts({\n *   filters: [{ seen: false, tags: ['important'] }]\n * });\n *\n * // Count seen but unread notifications\n * const { counts } = useCounts({\n *   filters: [{ seen: true, read: false }]\n * });\n * ```\n */\nexport type UseCountsProps = {\n  filters: NotificationFilter[];\n  onSuccess?: (data: Count[]) => void;\n  onError?: (error: NovuError) => void;\n};\n\nexport type UseCountsResult = {\n  counts?: Count[];\n  error?: NovuError;\n  isLoading: boolean; // initial loading\n  isFetching: boolean; // the request is in flight\n  refetch: () => Promise<void>;\n};\n\nexport const useCounts = (props: UseCountsProps): UseCountsResult => {\n  const { filters, onSuccess, onError } = props;\n  const { notifications } = useNovu();\n  const filtersRef = useRef<NotificationFilter[]>(filters);\n  const [error, setError] = useState<NovuError>();\n  const [counts, setCounts] = useState<Count[]>();\n  const [isLoading, setIsLoading] = useState(true);\n  const [isFetching, setIsFetching] = useState(false);\n\n  // Keep ref up to date\n  filtersRef.current = filters;\n\n  const sync = async (notification?: Notification, overrideFilters?: NotificationFilter[]) => {\n    const currentFilters = overrideFilters || filtersRef.current;\n    const existingCounts = currentFilters.map((filter) => ({ count: 0, filter }));\n    let countFiltersToFetch: NotificationFilter[] = [];\n    if (notification) {\n      for (let i = 0; i < existingCounts.length; i++) {\n        const filter = currentFilters[i];\n        if (areTagsEqual(filter.tags, notification.tags)) {\n          countFiltersToFetch.push(filter);\n        }\n      }\n    } else {\n      countFiltersToFetch = currentFilters;\n    }\n\n    if (countFiltersToFetch.length === 0) {\n      return;\n    }\n\n    setIsFetching(true);\n    const countsRes = await notifications.count({ filters: countFiltersToFetch });\n    setIsFetching(false);\n    setIsLoading(false);\n    if (countsRes.error) {\n      setError(countsRes.error);\n      onError?.(countsRes.error);\n\n      return;\n    }\n    const data = countsRes.data!;\n    onSuccess?.(data.counts);\n\n    setCounts((oldCounts) => {\n      const newCounts: Count[] = [];\n      const countsReceived = data.counts;\n\n      for (let i = 0; i < existingCounts.length; i++) {\n        const existingFilter = existingCounts[i].filter;\n        const countReceived = countsReceived.find((c) => isSameFilter(c.filter, existingFilter));\n        const count = countReceived || oldCounts?.[i];\n        if (count) {\n          newCounts.push(count);\n        }\n      }\n\n      return newCounts;\n    });\n  };\n\n  useWebSocketEvent({\n    event: 'notifications.notification_received',\n    eventHandler: (data) => {\n      sync(data.result);\n    },\n  });\n\n  useWebSocketEvent({\n    event: 'notifications.unread_count_changed',\n    eventHandler: () => {\n      sync();\n    },\n  });\n\n  useEffect(() => {\n    setError(undefined);\n    setIsLoading(true);\n    setIsFetching(false);\n    sync(undefined, filters);\n  }, [JSON.stringify(filters)]);\n\n  const refetch = async () => {\n    await sync();\n  };\n\n  return { counts, error, refetch, isLoading, isFetching };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAAwF;AACxF,mBAA4C;AAC5C,+BAAkC;AAClC,0BAAwB;AA0CjB,IAAM,YAAY,CAAC,UAA2C;AACnE,QAAM,EAAE,SAAS,WAAW,QAAQ,IAAI;AACxC,QAAM,EAAE,cAAc,QAAI,6BAAQ;AAClC,QAAM,iBAAa,qBAA6B,OAAO;AACvD,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAoB;AAC9C,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAkB;AAC9C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,IAAI;AAC/C,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAGlD,aAAW,UAAU;AAErB,QAAM,OAAO,OAAO,cAA6B,oBAA2C;AAC1F,UAAM,iBAAiB,mBAAmB,WAAW;AACrD,UAAM,iBAAiB,eAAe,IAAI,CAAC,YAAY,EAAE,OAAO,GAAG,OAAO,EAAE;AAC5E,QAAI,sBAA4C,CAAC;AACjD,QAAI,cAAc;AAChB,eAAS,IAAI,GAAG,IAAI,eAAe,QAAQ,KAAK;AAC9C,cAAM,SAAS,eAAe,CAAC;AAC/B,gBAAI,wBAAa,OAAO,MAAM,aAAa,IAAI,GAAG;AAChD,8BAAoB,KAAK,MAAM;AAAA,QACjC;AAAA,MACF;AAAA,IACF,OAAO;AACL,4BAAsB;AAAA,IACxB;AAEA,QAAI,oBAAoB,WAAW,GAAG;AACpC;AAAA,IACF;AAEA,kBAAc,IAAI;AAClB,UAAM,YAAY,MAAM,cAAc,MAAM,EAAE,SAAS,oBAAoB,CAAC;AAC5E,kBAAc,KAAK;AACnB,iBAAa,KAAK;AAClB,QAAI,UAAU,OAAO;AACnB,eAAS,UAAU,KAAK;AACxB,yCAAU,UAAU;AAEpB;AAAA,IACF;AACA,UAAM,OAAO,UAAU;AACvB,2CAAY,KAAK;AAEjB,cAAU,CAAC,cAAc;AACvB,YAAM,YAAqB,CAAC;AAC5B,YAAM,iBAAiB,KAAK;AAE5B,eAAS,IAAI,GAAG,IAAI,eAAe,QAAQ,KAAK;AAC9C,cAAM,iBAAiB,eAAe,CAAC,EAAE;AACzC,cAAM,gBAAgB,eAAe,KAAK,CAAC,UAAM,wBAAa,EAAE,QAAQ,cAAc,CAAC;AACvF,cAAM,QAAQ,kBAAiB,uCAAY;AAC3C,YAAI,OAAO;AACT,oBAAU,KAAK,KAAK;AAAA,QACtB;AAAA,MACF;AAEA,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AAEA,kDAAkB;AAAA,IAChB,OAAO;AAAA,IACP,cAAc,CAAC,SAAS;AACtB,WAAK,KAAK,MAAM;AAAA,IAClB;AAAA,EACF,CAAC;AAED,kDAAkB;AAAA,IAChB,OAAO;AAAA,IACP,cAAc,MAAM;AAClB,WAAK;AAAA,IACP;AAAA,EACF,CAAC;AAED,8BAAU,MAAM;AACd,aAAS,MAAS;AAClB,iBAAa,IAAI;AACjB,kBAAc,KAAK;AACnB,SAAK,QAAW,OAAO;AAAA,EACzB,GAAG,CAAC,KAAK,UAAU,OAAO,CAAC,CAAC;AAE5B,QAAM,UAAU,YAAY;AAC1B,UAAM,KAAK;AAAA,EACb;AAEA,SAAO,EAAE,QAAQ,OAAO,SAAS,WAAW,WAAW;AACzD;","names":[]}
+{"version":3,"sources":["../../../src/hooks/useCounts.ts"],"sourcesContent":["import { areTagsEqual, isSameFilter, Notification, NotificationFilter, NovuError } from '@novu/js';\nimport { useEffect, useRef, useState } from 'react';\nimport { useWebSocketEvent } from './internal/useWebsocketEvent';\nimport { useNovu } from './NovuProvider';\n\ntype Count = {\n  count: number;\n  filter: NotificationFilter;\n};\n\n/**\n * Props for the useCounts hook.\n *\n * @example\n * ```tsx\n * // Count unread notifications\n * const { counts } = useCounts({\n *   filters: [{ read: false }]\n * });\n *\n * // Count unseen notifications with specific tags\n * const { counts } = useCounts({\n *   filters: [{ seen: false, tags: ['important'] }]\n * });\n *\n * // Count seen but unread notifications\n * const { counts } = useCounts({\n *   filters: [{ seen: true, read: false }]\n * });\n * ```\n */\nexport type UseCountsProps = {\n  filters: NotificationFilter[];\n  onSuccess?: (data: Count[]) => void;\n  onError?: (error: NovuError) => void;\n};\n\nexport type UseCountsResult = {\n  counts?: Count[];\n  error?: NovuError;\n  isLoading: boolean; // initial loading\n  isFetching: boolean; // the request is in flight\n  refetch: () => Promise<void>;\n};\n\nexport const useCounts = (props: UseCountsProps): UseCountsResult => {\n  const { filters, onSuccess, onError } = props;\n  const { notifications } = useNovu();\n  const filtersRef = useRef<NotificationFilter[]>(filters);\n  const [error, setError] = useState<NovuError>();\n  const [counts, setCounts] = useState<Count[]>();\n  const [isLoading, setIsLoading] = useState(true);\n  const [isFetching, setIsFetching] = useState(false);\n\n  // Keep ref up to date\n  filtersRef.current = filters;\n\n  const sync = async (notification?: Notification, overrideFilters?: NotificationFilter[]) => {\n    const currentFilters = overrideFilters || filtersRef.current;\n    const existingCounts = currentFilters.map((filter) => ({ count: 0, filter }));\n    let countFiltersToFetch: NotificationFilter[] = [];\n    if (notification) {\n      for (let i = 0; i < existingCounts.length; i++) {\n        const filter = currentFilters[i];\n        const isSeverityMatches =\n          !filter.severity ||\n          (Array.isArray(filter.severity) && filter.severity.length === 0) ||\n          (Array.isArray(filter.severity) && filter.severity.includes(notification.severity)) ||\n          (!Array.isArray(filter.severity) && filter.severity === notification.severity);\n\n        if (areTagsEqual(filter.tags, notification.tags) && isSeverityMatches) {\n          countFiltersToFetch.push(filter);\n        }\n      }\n    } else {\n      countFiltersToFetch = currentFilters;\n    }\n\n    if (countFiltersToFetch.length === 0) {\n      return;\n    }\n\n    setIsFetching(true);\n    const countsRes = await notifications.count({ filters: countFiltersToFetch });\n    setIsFetching(false);\n    setIsLoading(false);\n    if (countsRes.error) {\n      setError(countsRes.error);\n      onError?.(countsRes.error);\n\n      return;\n    }\n    const data = countsRes.data!;\n    onSuccess?.(data.counts);\n\n    setCounts((oldCounts) => {\n      const newCounts: Count[] = [];\n      const countsReceived = data.counts;\n\n      for (let i = 0; i < existingCounts.length; i++) {\n        const existingFilter = existingCounts[i].filter;\n        const countReceived = countsReceived.find((c) => isSameFilter(c.filter, existingFilter));\n        const count = countReceived || oldCounts?.[i];\n        if (count) {\n          newCounts.push(count);\n        }\n      }\n\n      return newCounts;\n    });\n  };\n\n  useWebSocketEvent({\n    event: 'notifications.notification_received',\n    eventHandler: (data) => {\n      sync(data.result);\n    },\n  });\n\n  useWebSocketEvent({\n    event: 'notifications.unread_count_changed',\n    eventHandler: () => {\n      sync();\n    },\n  });\n\n  useEffect(() => {\n    setError(undefined);\n    setIsLoading(true);\n    setIsFetching(false);\n    sync(undefined, filters);\n  }, [JSON.stringify(filters)]);\n\n  const refetch = async () => {\n    await sync();\n  };\n\n  return { counts, error, refetch, isLoading, isFetching };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAAwF;AACxF,mBAA4C;AAC5C,+BAAkC;AAClC,0BAAwB;AA0CjB,IAAM,YAAY,CAAC,UAA2C;AACnE,QAAM,EAAE,SAAS,WAAW,QAAQ,IAAI;AACxC,QAAM,EAAE,cAAc,QAAI,6BAAQ;AAClC,QAAM,iBAAa,qBAA6B,OAAO;AACvD,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAoB;AAC9C,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAkB;AAC9C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,IAAI;AAC/C,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAGlD,aAAW,UAAU;AAErB,QAAM,OAAO,OAAO,cAA6B,oBAA2C;AAC1F,UAAM,iBAAiB,mBAAmB,WAAW;AACrD,UAAM,iBAAiB,eAAe,IAAI,CAAC,YAAY,EAAE,OAAO,GAAG,OAAO,EAAE;AAC5E,QAAI,sBAA4C,CAAC;AACjD,QAAI,cAAc;AAChB,eAAS,IAAI,GAAG,IAAI,eAAe,QAAQ,KAAK;AAC9C,cAAM,SAAS,eAAe,CAAC;AAC/B,cAAM,oBACJ,CAAC,OAAO,YACP,MAAM,QAAQ,OAAO,QAAQ,KAAK,OAAO,SAAS,WAAW,KAC7D,MAAM,QAAQ,OAAO,QAAQ,KAAK,OAAO,SAAS,SAAS,aAAa,QAAQ,KAChF,CAAC,MAAM,QAAQ,OAAO,QAAQ,KAAK,OAAO,aAAa,aAAa;AAEvE,gBAAI,wBAAa,OAAO,MAAM,aAAa,IAAI,KAAK,mBAAmB;AACrE,8BAAoB,KAAK,MAAM;AAAA,QACjC;AAAA,MACF;AAAA,IACF,OAAO;AACL,4BAAsB;AAAA,IACxB;AAEA,QAAI,oBAAoB,WAAW,GAAG;AACpC;AAAA,IACF;AAEA,kBAAc,IAAI;AAClB,UAAM,YAAY,MAAM,cAAc,MAAM,EAAE,SAAS,oBAAoB,CAAC;AAC5E,kBAAc,KAAK;AACnB,iBAAa,KAAK;AAClB,QAAI,UAAU,OAAO;AACnB,eAAS,UAAU,KAAK;AACxB,yCAAU,UAAU;AAEpB;AAAA,IACF;AACA,UAAM,OAAO,UAAU;AACvB,2CAAY,KAAK;AAEjB,cAAU,CAAC,cAAc;AACvB,YAAM,YAAqB,CAAC;AAC5B,YAAM,iBAAiB,KAAK;AAE5B,eAAS,IAAI,GAAG,IAAI,eAAe,QAAQ,KAAK;AAC9C,cAAM,iBAAiB,eAAe,CAAC,EAAE;AACzC,cAAM,gBAAgB,eAAe,KAAK,CAAC,UAAM,wBAAa,EAAE,QAAQ,cAAc,CAAC;AACvF,cAAM,QAAQ,kBAAiB,uCAAY;AAC3C,YAAI,OAAO;AACT,oBAAU,KAAK,KAAK;AAAA,QACtB;AAAA,MACF;AAEA,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AAEA,kDAAkB;AAAA,IAChB,OAAO;AAAA,IACP,cAAc,CAAC,SAAS;AACtB,WAAK,KAAK,MAAM;AAAA,IAClB;AAAA,EACF,CAAC;AAED,kDAAkB;AAAA,IAChB,OAAO;AAAA,IACP,cAAc,MAAM;AAClB,WAAK;AAAA,IACP;AAAA,EACF,CAAC;AAED,8BAAU,MAAM;AACd,aAAS,MAAS;AAClB,iBAAa,IAAI;AACjB,kBAAc,KAAK;AACnB,SAAK,QAAW,OAAO;AAAA,EACzB,GAAG,CAAC,KAAK,UAAU,OAAO,CAAC,CAAC;AAE5B,QAAM,UAAU,YAAY;AAC1B,UAAM,KAAK;AAAA,EACb;AAEA,SAAO,EAAE,QAAQ,OAAO,SAAS,WAAW,WAAW;AACzD;","names":[]}

package/dist/cjs/hooks/useNotifications.cjs

@@ -35,13 +35,17 @@ var useNotifications = (props) => {
     archived = false,
     snoozed = false,
     seen,
+    severity,
     limit,
     onSuccess,
     onError
   } = props || {};
   const filterRef = (0, import_react.useRef)(void 0);
   const { notifications } = (0, import_NovuProvider.useNovu)();
-  const getCurrentFilter = (0, import_react.useCallback)(() => filterRef.current || { tags, data: dataFilter }, [tags, dataFilter]);
+  const getCurrentFilter = (0, import_react.useCallback)(
+    () => filterRef.current || { tags, data: dataFilter, severity },
+    [tags, dataFilter, severity]
+  );
   const [data, setData] = (0, import_react.useState)();
   const [error, setError] = (0, import_react.useState)();
   const [isLoading, setIsLoading] = (0, import_react.useState)(true);
@@ -97,7 +101,7 @@ var useNotifications = (props) => {
     [notifications, getCurrentFilter, limit, after, onError, onSuccess]
   );
   (0, import_react.useEffect)(() => {
-    const newFilter = { tags, data: dataFilter, read, archived, snoozed, seen };
+    const newFilter = { tags, data: dataFilter, read, archived, snoozed, seen, severity };
     if (filterRef.current && (0, import_js.isSameFilter)(filterRef.current, newFilter)) {
       return;
     }

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

@@ -1 +1 @@
-{"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"]}
+{"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?: NotificationFilter['tags'];\n  data?: NotificationFilter['data'];\n  read?: NotificationFilter['read'];\n  archived?: NotificationFilter['archived'];\n  snoozed?: NotificationFilter['snoozed'];\n  seen?: NotificationFilter['seen'];\n  severity?: NotificationFilter['severity'];\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    severity,\n    limit,\n    onSuccess,\n    onError,\n  } = props || {};\n  const filterRef = useRef<NotificationFilter | undefined>(undefined);\n  const { notifications } = useNovu();\n\n  const getCurrentFilter = useCallback(\n    () => filterRef.current || { tags, data: dataFilter, severity },\n    [tags, dataFilter, severity]\n  );\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, severity };\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

@@ -1,4 +1,4 @@
-import { Notification, NovuError } from '@novu/js';
+import { NotificationFilter, Notification, NovuError } from '@novu/js';
 
 /**
  * Props for the useNotifications hook.
@@ -23,12 +23,13 @@ import { Notification, NovuError } from '@novu/js';
  * ```
  */
 type UseNotificationsProps = {
-    tags?: string[];
-    data?: Record<string, unknown>;
-    read?: boolean;
-    archived?: boolean;
-    snoozed?: boolean;
-    seen?: boolean;
+    tags?: NotificationFilter['tags'];
+    data?: NotificationFilter['data'];
+    read?: NotificationFilter['read'];
+    archived?: NotificationFilter['archived'];
+    snoozed?: NotificationFilter['snoozed'];
+    seen?: NotificationFilter['seen'];
+    severity?: NotificationFilter['severity'];
     limit?: number;
     onSuccess?: (data: Notification[]) => void;
     onError?: (error: NovuError) => void;

package/dist/cjs/hooks/usePreferences.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/usePreferences.ts"],"sourcesContent":["import { NovuError, Preference } from '@novu/js';\nimport { useEffect, useState } from 'react';\nimport { useNovu } from './NovuProvider';\n\nexport type UsePreferencesProps = {\n  filter?: { tags?: string[] };\n  onSuccess?: (data: Preference[]) => void;\n  onError?: (error: NovuError) => void;\n};\n\nexport type UsePreferencesResult = {\n  preferences?: Preference[];\n  error?: NovuError;\n  isLoading: boolean; // initial loading\n  isFetching: boolean; // the request is in flight\n  refetch: () => Promise<void>;\n};\n\nexport const usePreferences = (props?: UsePreferencesProps): UsePreferencesResult => {\n  const { onSuccess, onError } = props || {};\n  const [data, setData] = useState<Preference[]>();\n  const { preferences, on } = useNovu();\n  const [error, setError] = useState<NovuError>();\n  const [isLoading, setIsLoading] = useState(true);\n  const [isFetching, setIsFetching] = useState(false);\n\n  const sync = (event: { data?: Preference[] }) => {\n    if (!event.data) {\n      return;\n    }\n    setData(event.data);\n  };\n\n  useEffect(() => {\n    fetchPreferences();\n\n    const listUpdatedCleanup = on('preferences.list.updated', sync);\n    const listPendingCleanup = on('preferences.list.pending', sync);\n    const listResolvedCleanup = on('preferences.list.resolved', sync);\n\n    return () => {\n      listUpdatedCleanup();\n      listPendingCleanup();\n      listResolvedCleanup();\n    };\n  }, []);\n\n  const fetchPreferences = async () => {\n    setIsFetching(true);\n    const response = await preferences.list(props?.filter);\n    if (response.error) {\n      setError(response.error);\n      onError?.(response.error);\n    } else {\n      onSuccess?.(response.data!);\n    }\n    setIsLoading(false);\n    setIsFetching(false);\n  };\n\n  const refetch = () => {\n    preferences.cache.clearAll();\n\n    return fetchPreferences();\n  };\n\n  return {\n    preferences: data,\n    error,\n    isLoading,\n    isFetching,\n    refetch,\n  };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAoC;AACpC,0BAAwB;AAgBjB,IAAM,iBAAiB,CAAC,UAAsD;AACnF,QAAM,EAAE,WAAW,QAAQ,IAAI,SAAS,CAAC;AACzC,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAuB;AAC/C,QAAM,EAAE,aAAa,GAAG,QAAI,6BAAQ;AACpC,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAoB;AAC9C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,IAAI;AAC/C,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAElD,QAAM,OAAO,CAAC,UAAmC;AAC/C,QAAI,CAAC,MAAM,MAAM;AACf;AAAA,IACF;AACA,YAAQ,MAAM,IAAI;AAAA,EACpB;AAEA,8BAAU,MAAM;AACd,qBAAiB;AAEjB,UAAM,qBAAqB,GAAG,4BAA4B,IAAI;AAC9D,UAAM,qBAAqB,GAAG,4BAA4B,IAAI;AAC9D,UAAM,sBAAsB,GAAG,6BAA6B,IAAI;AAEhE,WAAO,MAAM;AACX,yBAAmB;AACnB,yBAAmB;AACnB,0BAAoB;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,mBAAmB,YAAY;AACnC,kBAAc,IAAI;AAClB,UAAM,WAAW,MAAM,YAAY,KAAK,+BAAO,MAAM;AACrD,QAAI,SAAS,OAAO;AAClB,eAAS,SAAS,KAAK;AACvB,yCAAU,SAAS;AAAA,IACrB,OAAO;AACL,6CAAY,SAAS;AAAA,IACvB;AACA,iBAAa,KAAK;AAClB,kBAAc,KAAK;AAAA,EACrB;AAEA,QAAM,UAAU,MAAM;AACpB,gBAAY,MAAM,SAAS;AAE3B,WAAO,iBAAiB;AAAA,EAC1B;AAEA,SAAO;AAAA,IACL,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../../src/hooks/usePreferences.ts"],"sourcesContent":["import { NovuError, Preference, SeverityLevelEnum } from '@novu/js';\nimport { useEffect, useState } from 'react';\nimport { useNovu } from './NovuProvider';\n\nexport type UsePreferencesProps = {\n  filter?: { tags?: string[]; severity?: SeverityLevelEnum | SeverityLevelEnum[] };\n  onSuccess?: (data: Preference[]) => void;\n  onError?: (error: NovuError) => void;\n};\n\nexport type UsePreferencesResult = {\n  preferences?: Preference[];\n  error?: NovuError;\n  isLoading: boolean; // initial loading\n  isFetching: boolean; // the request is in flight\n  refetch: () => Promise<void>;\n};\n\nexport const usePreferences = (props?: UsePreferencesProps): UsePreferencesResult => {\n  const { onSuccess, onError } = props || {};\n  const [data, setData] = useState<Preference[]>();\n  const { preferences, on } = useNovu();\n  const [error, setError] = useState<NovuError>();\n  const [isLoading, setIsLoading] = useState(true);\n  const [isFetching, setIsFetching] = useState(false);\n\n  const sync = (event: { data?: Preference[] }) => {\n    if (!event.data) {\n      return;\n    }\n    setData(event.data);\n  };\n\n  useEffect(() => {\n    fetchPreferences();\n\n    const listUpdatedCleanup = on('preferences.list.updated', sync);\n    const listPendingCleanup = on('preferences.list.pending', sync);\n    const listResolvedCleanup = on('preferences.list.resolved', sync);\n\n    return () => {\n      listUpdatedCleanup();\n      listPendingCleanup();\n      listResolvedCleanup();\n    };\n  }, []);\n\n  const fetchPreferences = async () => {\n    setIsFetching(true);\n    const response = await preferences.list(props?.filter);\n    if (response.error) {\n      setError(response.error);\n      onError?.(response.error);\n    } else {\n      onSuccess?.(response.data!);\n    }\n    setIsLoading(false);\n    setIsFetching(false);\n  };\n\n  const refetch = () => {\n    preferences.cache.clearAll();\n\n    return fetchPreferences();\n  };\n\n  return {\n    preferences: data,\n    error,\n    isLoading,\n    isFetching,\n    refetch,\n  };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAoC;AACpC,0BAAwB;AAgBjB,IAAM,iBAAiB,CAAC,UAAsD;AACnF,QAAM,EAAE,WAAW,QAAQ,IAAI,SAAS,CAAC;AACzC,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAuB;AAC/C,QAAM,EAAE,aAAa,GAAG,QAAI,6BAAQ;AACpC,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAoB;AAC9C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,IAAI;AAC/C,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAElD,QAAM,OAAO,CAAC,UAAmC;AAC/C,QAAI,CAAC,MAAM,MAAM;AACf;AAAA,IACF;AACA,YAAQ,MAAM,IAAI;AAAA,EACpB;AAEA,8BAAU,MAAM;AACd,qBAAiB;AAEjB,UAAM,qBAAqB,GAAG,4BAA4B,IAAI;AAC9D,UAAM,qBAAqB,GAAG,4BAA4B,IAAI;AAC9D,UAAM,sBAAsB,GAAG,6BAA6B,IAAI;AAEhE,WAAO,MAAM;AACX,yBAAmB;AACnB,yBAAmB;AACnB,0BAAoB;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,mBAAmB,YAAY;AACnC,kBAAc,IAAI;AAClB,UAAM,WAAW,MAAM,YAAY,KAAK,+BAAO,MAAM;AACrD,QAAI,SAAS,OAAO;AAClB,eAAS,SAAS,KAAK;AACvB,yCAAU,SAAS;AAAA,IACrB,OAAO;AACL,6CAAY,SAAS;AAAA,IACvB;AACA,iBAAa,KAAK;AAClB,kBAAc,KAAK;AAAA,EACrB;AAEA,QAAM,UAAU,MAAM;AACpB,gBAAY,MAAM,SAAS;AAE3B,WAAO,iBAAiB;AAAA,EAC1B;AAEA,SAAO;AAAA,IACL,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

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

@@ -1,8 +1,9 @@
-import { Preference, NovuError } from '@novu/js';
+import { SeverityLevelEnum, Preference, NovuError } from '@novu/js';
 
 type UsePreferencesProps = {
     filter?: {
         tags?: string[];
+        severity?: SeverityLevelEnum | SeverityLevelEnum[];
     };
     onSuccess?: (data: Preference[]) => void;
     onError?: (error: NovuError) => void;

package/dist/cjs/index.cjs

@@ -25,13 +25,16 @@ __export(src_exports, {
   InboxContent: () => import_components.InboxContent,
   Notifications: () => import_components.Notifications,
   NovuProvider: () => import_components.NovuProvider,
+  PreferenceLevel: () => import_js.PreferenceLevel,
   Preferences: () => import_components.Preferences,
+  SeverityLevelEnum: () => import_js.SeverityLevelEnum,
   useCounts: () => import_hooks.useCounts,
   useNotifications: () => import_hooks.useNotifications,
   useNovu: () => import_hooks.useNovu,
   usePreferences: () => import_hooks.usePreferences
 });
 module.exports = __toCommonJS(src_exports);
+var import_js = require("@novu/js");
 var import_components = require("./components/index.cjs");
 var import_hooks = require("./hooks/index.cjs");
 // Annotate the CommonJS export names for ESM import in node:
@@ -41,7 +44,9 @@ var import_hooks = require("./hooks/index.cjs");
   InboxContent,
   Notifications,
   NovuProvider,
+  PreferenceLevel,
   Preferences,
+  SeverityLevelEnum,
   useCounts,
   useNotifications,
   useNovu,

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"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":[]}
+{"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  PreferencesResponse,\n  SocketEventNames,\n  UnreadCount,\n  WebSocketEvent,\n} from '@novu/js';\nexport { PreferenceLevel, SeverityLevelEnum } from '@novu/js';\n\nexport type {\n  Appearance,\n  AppearanceCallback,\n  AppearanceCallbackFunction,\n  AppearanceCallbackKeys,\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;AAAA;AAAA;AAmBA,gBAAmD;AAsBnD,wBAAoF;AASpF,mBAAqE;","names":[]}

package/dist/cjs/index.d.cts

@@ -1,5 +1,5 @@
-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 { ChannelPreference, ChannelType, EventHandler, Events, FiltersCountResponse, InboxNotification, ListNotificationsResponse, Notification, NotificationFilter, NotificationStatus, NovuError, NovuOptions, Preference, PreferenceLevel, PreferencesResponse, SeverityLevelEnum, SocketEventNames, UnreadCount, WebSocketEvent } from '@novu/js';
+export { Appearance, AppearanceCallback, AppearanceCallbackFunction, AppearanceCallbackKeys, 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';

package/dist/cjs/server/index.cjs

@@ -25,7 +25,9 @@ __export(server_exports, {
   InboxContent: () => InboxContent,
   Notifications: () => Notifications,
   NovuProvider: () => NovuProvider,
+  PreferenceLevel: () => import_js.PreferenceLevel,
   Preferences: () => Preferences,
+  SeverityLevelEnum: () => import_js.SeverityLevelEnum,
   useCounts: () => useCounts,
   useNotifications: () => useNotifications,
   useNovu: () => useNovu,
@@ -33,6 +35,7 @@ __export(server_exports, {
 });
 module.exports = __toCommonJS(server_exports);
 var import_ShadowRootDetector = require("../components/ShadowRootDetector.cjs");
+var import_js = require("@novu/js");
 var import_jsx_runtime = require("react/jsx-runtime");
 function Inbox(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ShadowRootDetector.ShadowRootDetector, {});
@@ -84,7 +87,9 @@ function usePreferences(_) {
   InboxContent,
   Notifications,
   NovuProvider,
+  PreferenceLevel,
   Preferences,
+  SeverityLevelEnum,
   useCounts,
   useNotifications,
   useNovu,

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

@@ -1 +1 @@
-{"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":[]}
+{"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} from '@novu/js';\nexport { PreferenceLevel, SeverityLevelEnum } 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;AAAA;AAAA;AACA,gCAAmC;AA6EnC,gBAAmD;AA5D1C;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

@@ -4,7 +4,7 @@ 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';
-export { ChannelPreference, ChannelType, FiltersCountResponse, InboxNotification, ListNotificationsResponse, Notification, NotificationFilter, NotificationStatus, NovuError, NovuOptions, Preference, PreferenceLevel } from '@novu/js';
+export { ChannelPreference, ChannelType, FiltersCountResponse, InboxNotification, ListNotificationsResponse, Notification, NotificationFilter, NotificationStatus, NovuError, NovuOptions, Preference, PreferenceLevel, SeverityLevelEnum } 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 { InboxContentProps } from '../components/InboxContent.cjs';

package/dist/cjs/utils/appearance.cjs

@@ -27,13 +27,13 @@ function adaptAppearanceForJs(appearance, mountElement) {
   if (!appearance) {
     return void 0;
   }
-  const jsAppearance = JSON.parse(JSON.stringify(appearance));
-  if (appearance.icons) {
+  const { icons, ...restAppearance } = appearance;
+  const jsAppearance = { ...restAppearance };
+  if (icons) {
     const jsIcons = {};
-    const reactIcons = appearance.icons;
-    const iconKeys = Object.keys(reactIcons);
+    const iconKeys = Object.keys(icons);
     for (const iconKey of iconKeys) {
-      const reactRenderer = reactIcons[iconKey];
+      const reactRenderer = icons[iconKey];
       if (reactRenderer) {
         jsIcons[iconKey] = (el, props) => {
           return mountElement(el, reactRenderer(props));

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

@@ -1 +1 @@
-{"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":[]}
+{"version":3,"sources":["../../../src/utils/appearance.ts"],"sourcesContent":["import type { IconKey, Appearance as JsAppearance, IconOverrides as JsIconOverrides } from '@novu/js/ui';\nimport { MountedElement } from '../context/RendererContext';\nimport type { ReactAppearance } 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  const { icons, ...restAppearance } = appearance;\n  const jsAppearance: JsAppearance = { ...restAppearance };\n\n  if (icons) {\n    const jsIcons: JsIconOverrides = {};\n    const iconKeys = Object.keys(icons) as IconKey[];\n\n    for (const iconKey of iconKeys) {\n      const reactRenderer = icons[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;AACA,QAAM,EAAE,OAAO,GAAG,eAAe,IAAI;AACrC,QAAM,eAA6B,EAAE,GAAG,eAAe;AAEvD,MAAI,OAAO;AACT,UAAM,UAA2B,CAAC;AAClC,UAAM,WAAW,OAAO,KAAK,KAAK;AAElC,eAAW,WAAW,UAAU;AAC9B,YAAM,gBAAgB,MAAM,OAAO;AAEnC,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":[]}