@novu/react 2.6.6 → 3.0.0-canary.0

package/dist/cjs/hooks/internal/useBrowserTabsChannel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/hooks/internal/useBrowserTabsChannel.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport const useBrowserTabsChannel = <T = unknown>({\n  channelName,\n  onMessage,\n}: {\n  channelName: string;\n  onMessage: (args: T) => void;\n}) => {\n  const [tabsChannel] = useState(\n    typeof BroadcastChannel !== 'undefined' ? new BroadcastChannel(channelName) : undefined\n  );\n\n  const postMessage = (data: T) => {\n    tabsChannel?.postMessage(data);\n  };\n\n  useEffect(() => {\n    const listener = (event: MessageEvent<T>) => {\n      onMessage(event.data);\n    };\n\n    tabsChannel?.addEventListener('message', listener);\n\n    return () => {\n      tabsChannel?.removeEventListener('message', listener);\n    };\n  }, []);\n\n  return { postMessage };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAoC;AAE7B,IAAM,wBAAwB,CAAc;AAAA,EACjD;AAAA,EACA;AACF,MAGM;AACJ,QAAM,CAAC,WAAW,QAAI;AAAA,IACpB,OAAO,qBAAqB,cAAc,IAAI,iBAAiB,WAAW,IAAI;AAAA,EAChF;AAEA,QAAM,cAAc,CAAC,SAAY;AAC/B,+CAAa,YAAY;AAAA,EAC3B;AAEA,8BAAU,MAAM;AACd,UAAM,WAAW,CAAC,UAA2B;AAC3C,gBAAU,MAAM,IAAI;AAAA,IACtB;AAEA,+CAAa,iBAAiB,WAAW;AAEzC,WAAO,MAAM;AACX,iDAAa,oBAAoB,WAAW;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO,EAAE,YAAY;AACvB;","names":[]}

package/dist/cjs/hooks/internal/useBrowserTabsChannel.d.cts

@@ -0,0 +1,8 @@
+declare const useBrowserTabsChannel: <T = unknown>({ channelName, onMessage, }: {
+    channelName: string;
+    onMessage: (args: T) => void;
+}) => {
+    postMessage: (data: T) => void;
+};
+
+export { useBrowserTabsChannel };

package/dist/cjs/hooks/internal/useDataRef.cjs

@@ -0,0 +1,36 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/hooks/internal/useDataRef.ts
+var useDataRef_exports = {};
+__export(useDataRef_exports, {
+  useDataRef: () => useDataRef
+});
+module.exports = __toCommonJS(useDataRef_exports);
+var import_react = require("react");
+var useDataRef = (data) => {
+  const ref = (0, import_react.useRef)(data);
+  ref.current = data;
+  return ref;
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useDataRef
+});
+//# sourceMappingURL=useDataRef.cjs.map

package/dist/cjs/hooks/internal/useDataRef.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/hooks/internal/useDataRef.ts"],"sourcesContent":["import { useRef } from 'react';\n\nexport const useDataRef = <T>(data: T) => {\n  const ref = useRef(data);\n  ref.current = data;\n\n  return ref;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAuB;AAEhB,IAAM,aAAa,CAAI,SAAY;AACxC,QAAM,UAAM,qBAAO,IAAI;AACvB,MAAI,UAAU;AAEd,SAAO;AACT;","names":[]}

package/dist/cjs/hooks/internal/useDataRef.d.cts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+
+declare const useDataRef: <T>(data: T) => React.MutableRefObject<T>;
+
+export { useDataRef };

package/dist/cjs/hooks/internal/useWebsocketEvent.cjs

@@ -0,0 +1,57 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/hooks/internal/useWebsocketEvent.ts
+var useWebsocketEvent_exports = {};
+__export(useWebsocketEvent_exports, {
+  useWebSocketEvent: () => useWebSocketEvent
+});
+module.exports = __toCommonJS(useWebsocketEvent_exports);
+var import_react = require("react");
+var import_NovuProvider = require("../NovuProvider.cjs");
+var import_requestLock = require("../../utils/requestLock.cjs");
+var import_useBrowserTabsChannel = require("./useBrowserTabsChannel.cjs");
+var useWebSocketEvent = ({
+  event: webSocketEvent,
+  eventHandler: onMessage
+}) => {
+  const novu = (0, import_NovuProvider.useNovu)();
+  const { postMessage } = (0, import_useBrowserTabsChannel.useBrowserTabsChannel)({ channelName: `nv.${webSocketEvent}`, onMessage });
+  const updateReadCount = (data) => {
+    onMessage(data);
+    postMessage(data);
+  };
+  (0, import_react.useEffect)(() => {
+    let cleanup;
+    const resolveLock = (0, import_requestLock.requestLock)(`nv.${webSocketEvent}`, () => {
+      cleanup = novu.on(webSocketEvent, updateReadCount);
+    });
+    return () => {
+      if (cleanup) {
+        cleanup();
+      }
+      resolveLock();
+    };
+  }, []);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useWebSocketEvent
+});
+//# sourceMappingURL=useWebsocketEvent.cjs.map

package/dist/cjs/hooks/internal/useWebsocketEvent.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/hooks/internal/useWebsocketEvent.ts"],"sourcesContent":["import { EventHandler, Events, SocketEventNames } from '@novu/js';\nimport { useEffect } from 'react';\nimport { useNovu } from '../NovuProvider';\nimport { requestLock } from '../../utils/requestLock';\nimport { useBrowserTabsChannel } from './useBrowserTabsChannel';\n\nexport const useWebSocketEvent = <E extends SocketEventNames>({\n  event: webSocketEvent,\n  eventHandler: onMessage,\n}: {\n  event: E;\n  eventHandler: (args: Events[E]) => void;\n}) => {\n  const novu = useNovu();\n  const { postMessage } = useBrowserTabsChannel({ channelName: `nv.${webSocketEvent}`, onMessage });\n\n  const updateReadCount: EventHandler<Events[E]> = (data) => {\n    onMessage(data);\n    postMessage(data);\n  };\n\n  useEffect(() => {\n    let cleanup: () => void;\n    const resolveLock = requestLock(`nv.${webSocketEvent}`, () => {\n      cleanup = novu.on(webSocketEvent, updateReadCount);\n    });\n\n    return () => {\n      if (cleanup) {\n        cleanup();\n      }\n\n      resolveLock();\n    };\n  }, []);\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAA0B;AAC1B,0BAAwB;AACxB,yBAA4B;AAC5B,mCAAsC;AAE/B,IAAM,oBAAoB,CAA6B;AAAA,EAC5D,OAAO;AAAA,EACP,cAAc;AAChB,MAGM;AACJ,QAAM,WAAO,6BAAQ;AACrB,QAAM,EAAE,YAAY,QAAI,oDAAsB,EAAE,aAAa,MAAM,cAAc,IAAI,UAAU,CAAC;AAEhG,QAAM,kBAA2C,CAAC,SAAS;AACzD,cAAU,IAAI;AACd,gBAAY,IAAI;AAAA,EAClB;AAEA,8BAAU,MAAM;AACd,QAAI;AACJ,UAAM,kBAAc,gCAAY,MAAM,cAAc,IAAI,MAAM;AAC5D,gBAAU,KAAK,GAAG,gBAAgB,eAAe;AAAA,IACnD,CAAC;AAED,WAAO,MAAM;AACX,UAAI,SAAS;AACX,gBAAQ;AAAA,MACV;AAEA,kBAAY;AAAA,IACd;AAAA,EACF,GAAG,CAAC,CAAC;AACP;","names":[]}

package/dist/cjs/hooks/internal/useWebsocketEvent.d.cts

@@ -0,0 +1,8 @@
+import { SocketEventNames, Events } from '@novu/js';
+
+declare const useWebSocketEvent: <E extends SocketEventNames>({ event: webSocketEvent, eventHandler: onMessage, }: {
+    event: E;
+    eventHandler: (args: Events[E]) => void;
+}) => void;
+
+export { useWebSocketEvent };

package/dist/cjs/hooks/useCounts.cjs

@@ -0,0 +1,104 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/hooks/useCounts.ts
+var useCounts_exports = {};
+__export(useCounts_exports, {
+  useCounts: () => useCounts
+});
+module.exports = __toCommonJS(useCounts_exports);
+var import_react = require("react");
+var import_js = require("@novu/js");
+var import_NovuProvider = require("./NovuProvider.cjs");
+var import_useWebsocketEvent = require("./internal/useWebsocketEvent.cjs");
+var useCounts = (props) => {
+  const { filters, onSuccess, onError } = props;
+  const { notifications } = (0, import_NovuProvider.useNovu)();
+  const [error, setError] = (0, import_react.useState)();
+  const [counts, setCounts] = (0, import_react.useState)();
+  const [isLoading, setIsLoading] = (0, import_react.useState)(true);
+  const [isFetching, setIsFetching] = (0, import_react.useState)(false);
+  const sync = async (notification) => {
+    const existingCounts = counts ?? new Array(filters.length).fill(void 0);
+    let countFiltersToFetch = [];
+    if (notification) {
+      for (let i = 0; i < existingCounts.length; i++) {
+        const filter = filters[i];
+        if ((0, import_js.areTagsEqual)(filter.tags, notification.tags)) {
+          countFiltersToFetch.push(filter);
+        }
+      }
+    } else {
+      countFiltersToFetch = filters;
+    }
+    if (countFiltersToFetch.length === 0) {
+      return;
+    }
+    setIsFetching(true);
+    const countsRes = await notifications.count({ filters: countFiltersToFetch });
+    setIsFetching(false);
+    setIsLoading(false);
+    if (countsRes.error) {
+      setError(countsRes.error);
+      onError == null ? void 0 : onError(countsRes.error);
+      return;
+    }
+    const data = countsRes.data;
+    onSuccess == null ? void 0 : onSuccess(data.counts);
+    setCounts((oldCounts) => {
+      const newCounts = [];
+      const countsReceived = data.counts;
+      for (let i = 0; i < existingCounts.length; i++) {
+        const countReceived = countsReceived.find((c) => {
+          var _a;
+          return (0, import_js.areTagsEqual)(c.filter.tags, (_a = existingCounts[i]) == null ? void 0 : _a.filter.tags);
+        });
+        newCounts.push(countReceived || oldCounts[i]);
+      }
+      return newCounts;
+    });
+  };
+  (0, import_useWebsocketEvent.useWebSocketEvent)({
+    event: "notifications.notification_received",
+    eventHandler: (data) => {
+      sync(data.result);
+    }
+  });
+  (0, import_useWebsocketEvent.useWebSocketEvent)({
+    event: "notifications.unread_count_changed",
+    eventHandler: () => {
+      sync();
+    }
+  });
+  (0, import_react.useEffect)(() => {
+    setError(void 0);
+    setIsLoading(true);
+    setIsFetching(false);
+    sync();
+  }, [JSON.stringify(filters)]);
+  const refetch = async () => {
+    await sync();
+  };
+  return { counts, error, refetch, isLoading, isFetching };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useCounts
+});
+//# sourceMappingURL=useCounts.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/hooks/useCounts.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { Notification, NotificationFilter, NovuError, areTagsEqual } from '@novu/js';\nimport { useNovu } from './NovuProvider';\nimport { useWebSocketEvent } from './internal/useWebsocketEvent';\n\ntype Count = {\n  count: number;\n  filter: NotificationFilter;\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 [error, setError] = useState<NovuError>();\n  const [counts, setCounts] = useState<Count[]>();\n  const [isLoading, setIsLoading] = useState(true);\n  const [isFetching, setIsFetching] = useState(false);\n\n  const sync = async (notification?: Notification) => {\n    const existingCounts = counts ?? (new Array(filters.length).fill(undefined) as (Count | undefined)[]);\n    let countFiltersToFetch: NotificationFilter[] = [];\n    if (notification) {\n      // eslint-disable-next-line no-plusplus\n      for (let i = 0; i < existingCounts.length; i++) {\n        const filter = filters[i];\n        if (areTagsEqual(filter.tags, notification.tags)) {\n          countFiltersToFetch.push(filter);\n        }\n      }\n    } else {\n      countFiltersToFetch = filters;\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      // eslint-disable-next-line no-plusplus\n      for (let i = 0; i < existingCounts.length; i++) {\n        const countReceived = countsReceived.find((c) => areTagsEqual(c.filter.tags, existingCounts[i]?.filter.tags));\n\n        newCounts.push(countReceived || oldCounts![i]);\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();\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,mBAAoC;AACpC,gBAA0E;AAC1E,0BAAwB;AACxB,+BAAkC;AAqB3B,IAAM,YAAY,CAAC,UAA2C;AACnE,QAAM,EAAE,SAAS,WAAW,QAAQ,IAAI;AACxC,QAAM,EAAE,cAAc,QAAI,6BAAQ;AAClC,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;AAElD,QAAM,OAAO,OAAO,iBAAgC;AAClD,UAAM,iBAAiB,UAAW,IAAI,MAAM,QAAQ,MAAM,EAAE,KAAK,MAAS;AAC1E,QAAI,sBAA4C,CAAC;AACjD,QAAI,cAAc;AAEhB,eAAS,IAAI,GAAG,IAAI,eAAe,QAAQ,KAAK;AAC9C,cAAM,SAAS,QAAQ,CAAC;AACxB,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;AAG5B,eAAS,IAAI,GAAG,IAAI,eAAe,QAAQ,KAAK;AAC9C,cAAM,gBAAgB,eAAe,KAAK,CAAC,MAAG;AAtEtD;AAsEyD,6CAAa,EAAE,OAAO,OAAM,oBAAe,CAAC,MAAhB,mBAAmB,OAAO,IAAI;AAAA,SAAC;AAE5G,kBAAU,KAAK,iBAAiB,UAAW,CAAC,CAAC;AAAA,MAC/C;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;AAAA,EACP,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/useCounts.d.cts

@@ -0,0 +1,21 @@
+import { NotificationFilter, NovuError } from '@novu/js';
+
+type Count = {
+    count: number;
+    filter: NotificationFilter;
+};
+type UseCountsProps = {
+    filters: NotificationFilter[];
+    onSuccess?: (data: Count[]) => void;
+    onError?: (error: NovuError) => void;
+};
+type UseCountsResult = {
+    counts?: Count[];
+    error?: NovuError;
+    isLoading: boolean;
+    isFetching: boolean;
+    refetch: () => Promise<void>;
+};
+declare const useCounts: (props: UseCountsProps) => UseCountsResult;
+
+export { type UseCountsProps, type UseCountsResult, useCounts };

package/dist/cjs/hooks/useNotifications.cjs

@@ -0,0 +1,121 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/hooks/useNotifications.ts
+var useNotifications_exports = {};
+__export(useNotifications_exports, {
+  useNotifications: () => useNotifications
+});
+module.exports = __toCommonJS(useNotifications_exports);
+var import_react = require("react");
+var import_js = require("@novu/js");
+var import_NovuProvider = require("./NovuProvider.cjs");
+var useNotifications = (props) => {
+  const { tags, read, archived = false, limit, onSuccess, onError } = props || {};
+  const filterRef = (0, import_react.useRef)(void 0);
+  const { notifications, on } = (0, import_NovuProvider.useNovu)();
+  const [data, setData] = (0, import_react.useState)();
+  const [error, setError] = (0, import_react.useState)();
+  const [isLoading, setIsLoading] = (0, import_react.useState)(true);
+  const [isFetching, setIsFetching] = (0, import_react.useState)(false);
+  const [hasMore, setHasMore] = (0, import_react.useState)(false);
+  const length = data == null ? void 0 : data.length;
+  const after = length ? data[length - 1].id : void 0;
+  const sync = (event) => {
+    if (!event.data || filterRef.current && !(0, import_js.isSameFilter)(filterRef.current, event.data.filter)) {
+      return;
+    }
+    setData(event.data.notifications);
+    setHasMore(event.data.hasMore);
+  };
+  (0, import_react.useEffect)(() => {
+    const cleanup = on("notifications.list.updated", sync);
+    return () => {
+      cleanup();
+    };
+  }, []);
+  (0, import_react.useEffect)(() => {
+    const newFilter = { tags, read, archived };
+    if (filterRef.current && (0, import_js.isSameFilter)(filterRef.current, newFilter)) {
+      return;
+    }
+    notifications.clearCache({ filter: filterRef.current });
+    filterRef.current = newFilter;
+    fetchNotifications({ refetch: true });
+  }, [tags, read, archived]);
+  const fetchNotifications = async (options) => {
+    if (options == null ? void 0 : options.refetch) {
+      setError(void 0);
+      setIsLoading(true);
+      setIsFetching(false);
+    }
+    setIsFetching(true);
+    const response = await notifications.list({
+      tags,
+      read,
+      archived,
+      limit,
+      after: (options == null ? void 0 : options.refetch) ? void 0 : after
+    });
+    if (response.error) {
+      setError(response.error);
+      onError == null ? void 0 : onError(response.error);
+    } else {
+      onSuccess == null ? void 0 : onSuccess(response.data.notifications);
+      setData(response.data.notifications);
+      setHasMore(response.data.hasMore);
+    }
+    setIsLoading(false);
+    setIsFetching(false);
+  };
+  const refetch = () => {
+    notifications.clearCache({ filter: { tags, read, archived } });
+    return fetchNotifications({ refetch: true });
+  };
+  const fetchMore = async () => {
+    if (!hasMore || isFetching) return;
+    return fetchNotifications();
+  };
+  const readAll = async () => {
+    return await notifications.readAll({ tags });
+  };
+  const archiveAll = async () => {
+    return await notifications.archiveAll({ tags });
+  };
+  const archiveAllRead = async () => {
+    return await notifications.archiveAllRead({ tags });
+  };
+  return {
+    readAll,
+    archiveAll,
+    archiveAllRead,
+    notifications: data,
+    error,
+    isLoading,
+    isFetching,
+    refetch,
+    fetchMore,
+    hasMore
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useNotifications
+});
+//# sourceMappingURL=useNotifications.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/hooks/useNotifications.ts"],"sourcesContent":["import { useState, useEffect, useRef } from 'react';\nimport { ListNotificationsResponse, Notification, NovuError, isSameFilter, NotificationFilter } from '@novu/js';\nimport { useNovu } from './NovuProvider';\n\nexport type UseNotificationsProps = {\n  tags?: string[];\n  read?: boolean;\n  archived?: 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  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 { tags, read, archived = false, limit, onSuccess, onError } = props || {};\n  const filterRef = useRef<NotificationFilter | undefined>(undefined);\n  const { notifications, on } = useNovu();\n  const [data, setData] = useState<Array<Notification>>();\n  const [error, setError] = useState<NovuError>();\n  const [isLoading, setIsLoading] = useState(true);\n  const [isFetching, setIsFetching] = useState(false);\n  const [hasMore, setHasMore] = useState(false);\n  const length = data?.length;\n  const after = length ? data[length - 1].id : undefined;\n\n  const sync = (event: { data?: ListNotificationsResponse }) => {\n    if (!event.data || (filterRef.current && !isSameFilter(filterRef.current, event.data.filter))) {\n      return;\n    }\n    setData(event.data.notifications);\n    setHasMore(event.data.hasMore);\n  };\n\n  useEffect(() => {\n    const cleanup = on('notifications.list.updated', sync);\n\n    return () => {\n      cleanup();\n    };\n  }, []);\n\n  useEffect(() => {\n    const newFilter = { tags, read, archived };\n    if (filterRef.current && isSameFilter(filterRef.current, newFilter)) {\n      return;\n    }\n\n    notifications.clearCache({ filter: filterRef.current });\n    filterRef.current = newFilter;\n\n    fetchNotifications({ refetch: true });\n  }, [tags, read, archived]);\n\n  const fetchNotifications = async (options?: { refetch: boolean }) => {\n    if (options?.refetch) {\n      setError(undefined);\n      setIsLoading(true);\n      setIsFetching(false);\n    }\n    setIsFetching(true);\n    const response = await notifications.list({\n      tags,\n      read,\n      archived,\n      limit,\n      after: options?.refetch ? undefined : after,\n    });\n    if (response.error) {\n      setError(response.error);\n      onError?.(response.error);\n    } else {\n      onSuccess?.(response.data!.notifications);\n      setData(response.data!.notifications);\n      setHasMore(response.data!.hasMore);\n    }\n    setIsLoading(false);\n    setIsFetching(false);\n  };\n\n  const refetch = () => {\n    notifications.clearCache({ filter: { tags, read, archived } });\n\n    return fetchNotifications({ refetch: true });\n  };\n\n  const fetchMore = async () => {\n    if (!hasMore || isFetching) return;\n\n    return fetchNotifications();\n  };\n\n  const readAll = async () => {\n    return await notifications.readAll({ tags });\n  };\n\n  const archiveAll = async () => {\n    return await notifications.archiveAll({ tags });\n  };\n\n  const archiveAllRead = async () => {\n    return await notifications.archiveAllRead({ tags });\n  };\n\n  return {\n    readAll,\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":[]}

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

@@ -0,0 +1,34 @@
+import { Notification, NovuError } from '@novu/js';
+
+type UseNotificationsProps = {
+    tags?: string[];
+    read?: boolean;
+    archived?: boolean;
+    limit?: number;
+    onSuccess?: (data: Notification[]) => void;
+    onError?: (error: NovuError) => void;
+};
+type UseNotificationsResult = {
+    notifications?: Notification[];
+    error?: NovuError;
+    isLoading: boolean;
+    isFetching: boolean;
+    hasMore: boolean;
+    readAll: () => Promise<{
+        data?: void | undefined;
+        error?: NovuError | undefined;
+    }>;
+    archiveAll: () => Promise<{
+        data?: void | undefined;
+        error?: NovuError | undefined;
+    }>;
+    archiveAllRead: () => Promise<{
+        data?: void | undefined;
+        error?: NovuError | undefined;
+    }>;
+    refetch: () => Promise<void>;
+    fetchMore: () => Promise<void>;
+};
+declare const useNotifications: (props?: UseNotificationsProps) => UseNotificationsResult;
+
+export { type UseNotificationsProps, type UseNotificationsResult, useNotifications };

package/dist/cjs/hooks/usePreferences.cjs

@@ -0,0 +1,80 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/hooks/usePreferences.ts
+var usePreferences_exports = {};
+__export(usePreferences_exports, {
+  usePreferences: () => usePreferences
+});
+module.exports = __toCommonJS(usePreferences_exports);
+var import_react = require("react");
+var import_NovuProvider = require("./NovuProvider.cjs");
+var usePreferences = (props) => {
+  const { onSuccess, onError } = props || {};
+  const [data, setData] = (0, import_react.useState)();
+  const { preferences, on } = (0, import_NovuProvider.useNovu)();
+  const [error, setError] = (0, import_react.useState)();
+  const [isLoading, setIsLoading] = (0, import_react.useState)(true);
+  const [isFetching, setIsFetching] = (0, import_react.useState)(false);
+  const sync = (event) => {
+    if (!event.data) {
+      return;
+    }
+    setData(event.data);
+  };
+  (0, import_react.useEffect)(() => {
+    fetchPreferences();
+    const listUpdatedCleanup = on("preferences.list.updated", sync);
+    const listPendingCleanup = on("preferences.list.pending", sync);
+    const listResolvedCleanup = on("preferences.list.resolved", sync);
+    return () => {
+      listUpdatedCleanup();
+      listPendingCleanup();
+      listResolvedCleanup();
+    };
+  }, []);
+  const fetchPreferences = async () => {
+    setIsFetching(true);
+    const response = await preferences.list(props == null ? void 0 : props.filter);
+    if (response.error) {
+      setError(response.error);
+      onError == null ? void 0 : onError(response.error);
+    } else {
+      onSuccess == null ? void 0 : onSuccess(response.data);
+    }
+    setIsLoading(false);
+    setIsFetching(false);
+  };
+  const refetch = () => {
+    preferences.cache.clearAll();
+    return fetchPreferences();
+  };
+  return {
+    preferences: data,
+    error,
+    isLoading,
+    isFetching,
+    refetch
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  usePreferences
+});
+//# sourceMappingURL=usePreferences.cjs.map

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

@@ -0,0 +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":[]}

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

@@ -0,0 +1,19 @@
+import { Preference, NovuError } from '@novu/js';
+
+type UsePreferencesProps = {
+    filter?: {
+        tags?: string[];
+    };
+    onSuccess?: (data: Preference[]) => void;
+    onError?: (error: NovuError) => void;
+};
+type UsePreferencesResult = {
+    preferences?: Preference[];
+    error?: NovuError;
+    isLoading: boolean;
+    isFetching: boolean;
+    refetch: () => Promise<void>;
+};
+declare const usePreferences: (props?: UsePreferencesProps) => UsePreferencesResult;
+
+export { type UsePreferencesProps, type UsePreferencesResult, usePreferences };

package/dist/cjs/index.cjs

@@ -0,0 +1,27 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+module.exports = __toCommonJS(src_exports);
+__reExport(src_exports, require("./components/index.cjs"), module.exports);
+__reExport(src_exports, require("./hooks/index.cjs"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./components/index.cjs"),
+  ...require("./hooks/index.cjs")
+});
+//# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export * from './components';\nexport * from './hooks';\nexport type * from './utils/types';\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,mCAAd;AACA,wBAAc,8BADd;","names":[]}

package/dist/cjs/index.d.cts

@@ -0,0 +1,14 @@
+export { Bell, BellProps } from './components/Bell.cjs';
+export { Inbox, InboxProps } from './components/Inbox.cjs';
+export { Preferences } from './components/Preferences.cjs';
+export { NotificationProps, Notifications } from './components/Notifications.cjs';
+export { InboxContent, InboxContentProps } from './components/InboxContent.cjs';
+export { InternalNovuProvider, NovuProvider, NovuProviderProps, useNovu, useUnsafeNovu } from './hooks/NovuProvider.cjs';
+export { UseNotificationsProps, UseNotificationsResult, useNotifications } from './hooks/useNotifications.cjs';
+export { UsePreferencesProps, UsePreferencesResult, usePreferences } from './hooks/usePreferences.cjs';
+export { UseCountsProps, UseCountsResult, useCounts } from './hooks/useCounts.cjs';
+export { BaseProps, BellRenderer, BodyRenderer, DefaultInboxProps, DefaultProps, NoRendererProps, NotificationRendererProps, NotificationsRenderer, SubjectBodyRendererProps, SubjectRenderer, WithChildrenProps } from './utils/types.cjs';
+export { Notification } from '@novu/js/ui';
+import 'react';
+import 'react/jsx-runtime';
+import '@novu/js';