@novu/react 2.6.6 → 3.0.0-canary.0

package/dist/esm/components/Preferences.js

@@ -0,0 +1,19 @@
+// src/components/Preferences.tsx
+import React from "react";
+import { Mounter } from "./Mounter.js";
+import { useNovuUI } from "../context/NovuUIContext.js";
+import { jsx } from "react/jsx-runtime";
+var Preferences = () => {
+  const { novuUI } = useNovuUI();
+  const mount = React.useCallback((element) => {
+    return novuUI.mountComponent({
+      name: "Preferences",
+      element
+    });
+  }, []);
+  return /* @__PURE__ */ jsx(Mounter, { mount });
+};
+export {
+  Preferences
+};
+//# sourceMappingURL=Preferences.js.map

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

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

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

@@ -0,0 +1,8 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ComponentType, PropsWithChildren } from 'react';
+
+type RendererProps = PropsWithChildren;
+declare const Renderer: (props: RendererProps) => react_jsx_runtime.JSX.Element;
+declare const withRenderer: <P extends object>(WrappedComponent: ComponentType<P>) => ComponentType<P & PropsWithChildren<{}>>;
+
+export { Renderer, withRenderer };

package/dist/esm/components/Renderer.js

@@ -0,0 +1,44 @@
+// src/components/Renderer.tsx
+import { useCallback, useState } from "react";
+import { createPortal } from "react-dom";
+import { RendererProvider } from "../context/RendererContext.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Renderer = (props) => {
+  const { children } = props;
+  const [mountedElements, setMountedElements] = useState(/* @__PURE__ */ new Map());
+  const mountElement = useCallback(
+    (el, mountedElement) => {
+      setMountedElements((prev) => {
+        const newMountedElements = new Map(prev);
+        newMountedElements.set(el, mountedElement);
+        return newMountedElements;
+      });
+      return () => {
+        setMountedElements((prev) => {
+          const newMountedElements = new Map(prev);
+          newMountedElements.delete(el);
+          return newMountedElements;
+        });
+      };
+    },
+    [setMountedElements]
+  );
+  return /* @__PURE__ */ jsxs(RendererProvider, { value: { mountElement }, children: [
+    [...mountedElements].map(([element, mountedElement]) => {
+      return createPortal(mountedElement, element);
+    }),
+    children
+  ] });
+};
+var withRenderer = (WrappedComponent) => {
+  const HOC = (props) => {
+    return /* @__PURE__ */ jsx(Renderer, { children: /* @__PURE__ */ jsx(WrappedComponent, { ...props }) });
+  };
+  HOC.displayName = `WithRenderer(${WrappedComponent.displayName || WrappedComponent.name || "Component"})`;
+  return HOC;
+};
+export {
+  Renderer,
+  withRenderer
+};
+//# sourceMappingURL=Renderer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Renderer.tsx"],"sourcesContent":["import { ComponentType, PropsWithChildren, useCallback, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { MountedElement, RendererProvider } from '../context/RendererContext';\n\ntype RendererProps = PropsWithChildren;\nexport const Renderer = (props: RendererProps) => {\n  const { children } = props;\n  const [mountedElements, setMountedElements] = useState(new Map<HTMLElement, MountedElement>());\n\n  const mountElement = useCallback(\n    (el: HTMLElement, mountedElement: MountedElement) => {\n      setMountedElements((prev) => {\n        const newMountedElements = new Map(prev);\n        newMountedElements.set(el, mountedElement);\n\n        return newMountedElements;\n      });\n\n      return () => {\n        setMountedElements((prev) => {\n          const newMountedElements = new Map(prev);\n          newMountedElements.delete(el);\n\n          return newMountedElements;\n        });\n      };\n    },\n    [setMountedElements]\n  );\n\n  return (\n    <RendererProvider value={{ mountElement }}>\n      {[...mountedElements].map(([element, mountedElement]) => {\n        return createPortal(mountedElement, element);\n      })}\n\n      {children}\n    </RendererProvider>\n  );\n};\n\nexport const withRenderer = <P extends object>(\n  WrappedComponent: ComponentType<P>\n): ComponentType<P & PropsWithChildren<{}>> => {\n  const HOC = (props: P) => {\n    return (\n      <Renderer>\n        <WrappedComponent {...props} />\n      </Renderer>\n    );\n  };\n\n  HOC.displayName = `WithRenderer(${WrappedComponent.displayName || WrappedComponent.name || 'Component'})`;\n\n  return HOC;\n};\n"],"mappings":";AAAA,SAA2C,aAAa,gBAAgB;AACxE,SAAS,oBAAoB;AAC7B,SAAyB,wBAAwB;AA6B7C,SAgBI,KAhBJ;AA1BG,IAAM,WAAW,CAAC,UAAyB;AAChD,QAAM,EAAE,SAAS,IAAI;AACrB,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,oBAAI,IAAiC,CAAC;AAE7F,QAAM,eAAe;AAAA,IACnB,CAAC,IAAiB,mBAAmC;AACnD,yBAAmB,CAAC,SAAS;AAC3B,cAAM,qBAAqB,IAAI,IAAI,IAAI;AACvC,2BAAmB,IAAI,IAAI,cAAc;AAEzC,eAAO;AAAA,MACT,CAAC;AAED,aAAO,MAAM;AACX,2BAAmB,CAAC,SAAS;AAC3B,gBAAM,qBAAqB,IAAI,IAAI,IAAI;AACvC,6BAAmB,OAAO,EAAE;AAE5B,iBAAO;AAAA,QACT,CAAC;AAAA,MACH;AAAA,IACF;AAAA,IACA,CAAC,kBAAkB;AAAA,EACrB;AAEA,SACE,qBAAC,oBAAiB,OAAO,EAAE,aAAa,GACrC;AAAA,KAAC,GAAG,eAAe,EAAE,IAAI,CAAC,CAAC,SAAS,cAAc,MAAM;AACvD,aAAO,aAAa,gBAAgB,OAAO;AAAA,IAC7C,CAAC;AAAA,IAEA;AAAA,KACH;AAEJ;AAEO,IAAM,eAAe,CAC1B,qBAC6C;AAC7C,QAAM,MAAM,CAAC,UAAa;AACxB,WACE,oBAAC,YACC,8BAAC,oBAAkB,GAAG,OAAO,GAC/B;AAAA,EAEJ;AAEA,MAAI,cAAc,gBAAgB,iBAAiB,eAAe,iBAAiB,QAAQ,WAAW;AAEtG,SAAO;AACT;","names":[]}

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

@@ -0,0 +1,11 @@
+export { Bell, BellProps } from './Bell.js';
+export { Inbox, InboxProps } from './Inbox.js';
+export { Preferences } from './Preferences.js';
+export { NotificationProps, Notifications } from './Notifications.js';
+export { InboxContent, InboxContentProps } from './InboxContent.js';
+export { InternalNovuProvider, NovuProvider, NovuProviderProps, useNovu, useUnsafeNovu } from '../hooks/NovuProvider.js';
+import 'react';
+import '../utils/types.js';
+import '@novu/js/ui';
+import 'react/jsx-runtime';
+import '@novu/js';

package/dist/esm/components/index.js

@@ -0,0 +1,8 @@
+// src/components/index.ts
+export * from "./Bell.js";
+export * from "./Inbox.js";
+export * from "./Preferences.js";
+export * from "./Notifications.js";
+export * from "./InboxContent.js";
+export * from "../hooks/NovuProvider.js";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/index.ts"],"sourcesContent":["export * from './Bell';\nexport * from './Inbox';\nexport * from './Preferences';\nexport * from './Notifications';\nexport * from './InboxContent';\nexport * from '../hooks/NovuProvider';\n"],"mappings":";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}

package/dist/esm/context/NovuUIContext.d.ts

@@ -0,0 +1,14 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React__default from 'react';
+import { NovuUI } from '@novu/js/ui';
+
+type NovuUIContextValue = {
+    novuUI: NovuUI;
+};
+declare const useNovuUIContext: () => NovuUIContextValue;
+declare const useUnsafeNovuUIContext: () => NovuUIContextValue | Partial<NovuUIContextValue>;
+declare const NovuUIProvider: (props: React__default.PropsWithChildren<{
+    value: NovuUIContextValue;
+}>) => react_jsx_runtime.JSX.Element;
+
+export { NovuUIProvider, useNovuUIContext as useNovuUI, useUnsafeNovuUIContext as useUnsafeNovuUI };

package/dist/esm/context/NovuUIContext.js

@@ -0,0 +1,13 @@
+// src/context/NovuUIContext.tsx
+import { createContextAndHook } from "../utils/createContextAndHook.js";
+import { jsx } from "react/jsx-runtime";
+var [NovuUIContext, useNovuUIContext, useUnsafeNovuUIContext] = createContextAndHook("NovuUIContext");
+var NovuUIProvider = (props) => {
+  return /* @__PURE__ */ jsx(NovuUIContext.Provider, { value: { value: props.value }, children: props.children });
+};
+export {
+  NovuUIProvider,
+  useNovuUIContext as useNovuUI,
+  useUnsafeNovuUIContext as useUnsafeNovuUI
+};
+//# sourceMappingURL=NovuUIContext.js.map

package/dist/esm/context/NovuUIContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/context/NovuUIContext.tsx"],"sourcesContent":["import React from 'react';\nimport type { NovuUI } from '@novu/js/ui';\nimport { createContextAndHook } from '../utils/createContextAndHook';\n\ntype NovuUIContextValue = {\n  novuUI: NovuUI;\n};\n\nconst [NovuUIContext, useNovuUIContext, useUnsafeNovuUIContext] =\n  createContextAndHook<NovuUIContextValue>('NovuUIContext');\n\nconst NovuUIProvider = (props: React.PropsWithChildren<{ value: NovuUIContextValue }>) => {\n  return <NovuUIContext.Provider value={{ value: props.value }}>{props.children}</NovuUIContext.Provider>;\n};\n\nexport { useNovuUIContext as useNovuUI, useUnsafeNovuUIContext as useUnsafeNovuUI, NovuUIProvider };\n"],"mappings":";AAEA,SAAS,4BAA4B;AAU5B;AAJT,IAAM,CAAC,eAAe,kBAAkB,sBAAsB,IAC5D,qBAAyC,eAAe;AAE1D,IAAM,iBAAiB,CAAC,UAAkE;AACxF,SAAO,oBAAC,cAAc,UAAd,EAAuB,OAAO,EAAE,OAAO,MAAM,MAAM,GAAI,gBAAM,UAAS;AAChF;","names":[]}

package/dist/esm/context/RendererContext.d.ts

@@ -0,0 +1,15 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React__default from 'react';
+
+type MountedElement = React__default.ReactNode;
+type MountedElements = Map<HTMLElement, MountedElement>;
+type RendererContextValue = {
+    mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void;
+};
+declare const useRendererContext: () => RendererContextValue;
+declare const useUnsafeRendererContext: () => RendererContextValue | Partial<RendererContextValue>;
+declare const RendererProvider: (props: React__default.PropsWithChildren<{
+    value: RendererContextValue;
+}>) => react_jsx_runtime.JSX.Element;
+
+export { type MountedElement, type MountedElements, RendererProvider, useRendererContext as useRenderer, useUnsafeRendererContext as useUnsafeRenderer };

package/dist/esm/context/RendererContext.js

@@ -0,0 +1,13 @@
+// src/context/RendererContext.tsx
+import { createContextAndHook } from "../utils/createContextAndHook.js";
+import { jsx } from "react/jsx-runtime";
+var [RendererContext, useRendererContext, useUnsafeRendererContext] = createContextAndHook("RendererContext");
+var RendererProvider = (props) => {
+  return /* @__PURE__ */ jsx(RendererContext.Provider, { value: { value: props.value }, children: props.children });
+};
+export {
+  RendererProvider,
+  useRendererContext as useRenderer,
+  useUnsafeRendererContext as useUnsafeRenderer
+};
+//# sourceMappingURL=RendererContext.js.map

package/dist/esm/context/RendererContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/context/RendererContext.tsx"],"sourcesContent":["import React from 'react';\nimport type { NovuUI } from '@novu/js/ui';\nimport { createContextAndHook } from '../utils/createContextAndHook';\n\nexport type MountedElement = React.ReactNode;\nexport type MountedElements = Map<HTMLElement, MountedElement>;\n\ntype RendererContextValue = {\n  mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void;\n};\n\nconst [RendererContext, useRendererContext, useUnsafeRendererContext] =\n  createContextAndHook<RendererContextValue>('RendererContext');\n\nconst RendererProvider = (props: React.PropsWithChildren<{ value: RendererContextValue }>) => {\n  return <RendererContext.Provider value={{ value: props.value }}>{props.children}</RendererContext.Provider>;\n};\n\nexport { useRendererContext as useRenderer, useUnsafeRendererContext as useUnsafeRenderer, RendererProvider };\n"],"mappings":";AAEA,SAAS,4BAA4B;AAa5B;AAJT,IAAM,CAAC,iBAAiB,oBAAoB,wBAAwB,IAClE,qBAA2C,iBAAiB;AAE9D,IAAM,mBAAmB,CAAC,UAAoE;AAC5F,SAAO,oBAAC,gBAAgB,UAAhB,EAAyB,OAAO,EAAE,OAAO,MAAM,MAAM,GAAI,gBAAM,UAAS;AAClF;","names":[]}

package/dist/esm/hooks/NovuProvider.d.ts

@@ -0,0 +1,20 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { NovuOptions, Novu } from '@novu/js';
+import { ReactNode } from 'react';
+
+type NovuProviderProps = NovuOptions & {
+    children: ReactNode;
+};
+declare const NovuProvider: ({ children, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache, }: NovuProviderProps) => react_jsx_runtime.JSX.Element;
+/**
+ * @internal Should be used internally not to be exposed outside of the library
+ * This is needed to differentiate between the hooks and components user agents
+ * Better to use this internally to avoid confusion.
+ */
+declare const InternalNovuProvider: ({ children, applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache, userAgentType, }: NovuProviderProps & {
+    userAgentType: "components" | "hooks";
+}) => react_jsx_runtime.JSX.Element;
+declare const useNovu: () => Novu;
+declare const useUnsafeNovu: () => Novu | undefined;
+
+export { InternalNovuProvider, NovuProvider, type NovuProviderProps, useNovu, useUnsafeNovu };

package/dist/esm/hooks/NovuProvider.js

@@ -0,0 +1,73 @@
+// src/hooks/NovuProvider.tsx
+import { Novu } from "@novu/js";
+import { createContext, useContext, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+var version = "3.0.0-canary.0";
+var name = "@novu/react";
+var baseUserAgent = `${name}@${version}`;
+var NovuContext = createContext(void 0);
+var NovuProvider = ({
+  children,
+  applicationIdentifier,
+  subscriberId,
+  subscriberHash,
+  backendUrl,
+  socketUrl,
+  useCache
+}) => {
+  return /* @__PURE__ */ jsx(
+    InternalNovuProvider,
+    {
+      applicationIdentifier,
+      subscriberId,
+      subscriberHash,
+      backendUrl,
+      socketUrl,
+      useCache,
+      userAgentType: "hooks",
+      children
+    }
+  );
+};
+var InternalNovuProvider = ({
+  children,
+  applicationIdentifier,
+  subscriberId,
+  subscriberHash,
+  backendUrl,
+  socketUrl,
+  useCache,
+  userAgentType
+}) => {
+  const novu = useMemo(
+    () => new Novu({
+      applicationIdentifier,
+      subscriberId,
+      subscriberHash,
+      backendUrl,
+      socketUrl,
+      useCache,
+      __userAgent: `${baseUserAgent} ${userAgentType}`
+    }),
+    [applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache, userAgentType]
+  );
+  return /* @__PURE__ */ jsx(NovuContext.Provider, { value: novu, children });
+};
+var useNovu = () => {
+  const context = useContext(NovuContext);
+  if (!context) {
+    throw new Error("useNovu must be used within a <NovuProvider />");
+  }
+  return context;
+};
+var useUnsafeNovu = () => {
+  const context = useContext(NovuContext);
+  return context;
+};
+export {
+  InternalNovuProvider,
+  NovuProvider,
+  useNovu,
+  useUnsafeNovu
+};
+//# sourceMappingURL=NovuProvider.js.map

package/dist/esm/hooks/NovuProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/hooks/NovuProvider.tsx"],"sourcesContent":["import { Novu, NovuOptions } from '@novu/js';\nimport { ReactNode, createContext, useContext, useMemo } from 'react';\n\n// @ts-ignore\nconst version = PACKAGE_VERSION;\n// @ts-ignore\nconst name = PACKAGE_NAME;\nconst baseUserAgent = `${name}@${version}`;\n\nexport type NovuProviderProps = NovuOptions & {\n  children: ReactNode;\n};\n\nconst NovuContext = createContext<Novu | undefined>(undefined);\n\nexport const NovuProvider = ({\n  children,\n  applicationIdentifier,\n  subscriberId,\n  subscriberHash,\n  backendUrl,\n  socketUrl,\n  useCache,\n}: NovuProviderProps) => {\n  return (\n    <InternalNovuProvider\n      applicationIdentifier={applicationIdentifier}\n      subscriberId={subscriberId}\n      subscriberHash={subscriberHash}\n      backendUrl={backendUrl}\n      socketUrl={socketUrl}\n      useCache={useCache}\n      userAgentType=\"hooks\"\n    >\n      {children}\n    </InternalNovuProvider>\n  );\n};\n\n/**\n * @internal Should be used internally not to be exposed outside of the library\n * This is needed to differentiate between the hooks and components user agents\n * Better to use this internally to avoid confusion.\n */\nexport const InternalNovuProvider = ({\n  children,\n  applicationIdentifier,\n  subscriberId,\n  subscriberHash,\n  backendUrl,\n  socketUrl,\n  useCache,\n  userAgentType,\n}: NovuProviderProps & { userAgentType: 'components' | 'hooks' }) => {\n  const novu = useMemo(\n    () =>\n      new Novu({\n        applicationIdentifier,\n        subscriberId,\n        subscriberHash,\n        backendUrl,\n        socketUrl,\n        useCache,\n        __userAgent: `${baseUserAgent} ${userAgentType}`,\n      }),\n    [applicationIdentifier, subscriberId, subscriberHash, backendUrl, socketUrl, useCache, userAgentType]\n  );\n\n  return <NovuContext.Provider value={novu}>{children}</NovuContext.Provider>;\n};\n\nexport const useNovu = () => {\n  const context = useContext(NovuContext);\n  if (!context) {\n    throw new Error('useNovu must be used within a <NovuProvider />');\n  }\n\n  return context;\n};\n\nexport const useUnsafeNovu = () => {\n  const context = useContext(NovuContext);\n\n  return context;\n};\n"],"mappings":";AAAA,SAAS,YAAyB;AAClC,SAAoB,eAAe,YAAY,eAAe;AAwB1D;AArBJ,IAAM,UAAU;AAEhB,IAAM,OAAO;AACb,IAAM,gBAAgB,GAAG,IAAI,IAAI,OAAO;AAMxC,IAAM,cAAc,cAAgC,MAAS;AAEtD,IAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAyB;AACvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAc;AAAA,MAEb;AAAA;AAAA,EACH;AAEJ;AAOO,IAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAqE;AACnE,QAAM,OAAO;AAAA,IACX,MACE,IAAI,KAAK;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,aAAa,GAAG,aAAa,IAAI,aAAa;AAAA,IAChD,CAAC;AAAA,IACH,CAAC,uBAAuB,cAAc,gBAAgB,YAAY,WAAW,UAAU,aAAa;AAAA,EACtG;AAEA,SAAO,oBAAC,YAAY,UAAZ,EAAqB,OAAO,MAAO,UAAS;AACtD;AAEO,IAAM,UAAU,MAAM;AAC3B,QAAM,UAAU,WAAW,WAAW;AACtC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,gDAAgD;AAAA,EAClE;AAEA,SAAO;AACT;AAEO,IAAM,gBAAgB,MAAM;AACjC,QAAM,UAAU,WAAW,WAAW;AAEtC,SAAO;AACT;","names":[]}

package/dist/esm/hooks/index.d.ts

@@ -0,0 +1,7 @@
+export { UseNotificationsProps, UseNotificationsResult, useNotifications } from './useNotifications.js';
+export { UsePreferencesProps, UsePreferencesResult, usePreferences } from './usePreferences.js';
+export { UseCountsProps, UseCountsResult, useCounts } from './useCounts.js';
+export { NovuProvider, useNovu } from './NovuProvider.js';
+import '@novu/js';
+import 'react/jsx-runtime';
+import 'react';

package/dist/esm/hooks/index.js

@@ -0,0 +1,10 @@
+// src/hooks/index.ts
+export * from "./useNotifications.js";
+export * from "./usePreferences.js";
+export * from "./useCounts.js";
+import { NovuProvider, useNovu } from "./NovuProvider.js";
+export {
+  NovuProvider,
+  useNovu
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/hooks/index.ts"],"sourcesContent":["export * from './useNotifications';\nexport * from './usePreferences';\nexport * from './useCounts';\nexport { NovuProvider, useNovu } from './NovuProvider';\n"],"mappings":";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAAS,cAAc,eAAe;","names":[]}

package/dist/esm/hooks/internal/useBrowserTabsChannel.d.ts

@@ -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/esm/hooks/internal/useBrowserTabsChannel.js

@@ -0,0 +1,27 @@
+// src/hooks/internal/useBrowserTabsChannel.ts
+import { useEffect, useState } from "react";
+var useBrowserTabsChannel = ({
+  channelName,
+  onMessage
+}) => {
+  const [tabsChannel] = useState(
+    typeof BroadcastChannel !== "undefined" ? new BroadcastChannel(channelName) : void 0
+  );
+  const postMessage = (data) => {
+    tabsChannel?.postMessage(data);
+  };
+  useEffect(() => {
+    const listener = (event) => {
+      onMessage(event.data);
+    };
+    tabsChannel?.addEventListener("message", listener);
+    return () => {
+      tabsChannel?.removeEventListener("message", listener);
+    };
+  }, []);
+  return { postMessage };
+};
+export {
+  useBrowserTabsChannel
+};
+//# sourceMappingURL=useBrowserTabsChannel.js.map

package/dist/esm/hooks/internal/useBrowserTabsChannel.js.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,SAAS,WAAW,gBAAgB;AAE7B,IAAM,wBAAwB,CAAc;AAAA,EACjD;AAAA,EACA;AACF,MAGM;AACJ,QAAM,CAAC,WAAW,IAAI;AAAA,IACpB,OAAO,qBAAqB,cAAc,IAAI,iBAAiB,WAAW,IAAI;AAAA,EAChF;AAEA,QAAM,cAAc,CAAC,SAAY;AAC/B,iBAAa,YAAY,IAAI;AAAA,EAC/B;AAEA,YAAU,MAAM;AACd,UAAM,WAAW,CAAC,UAA2B;AAC3C,gBAAU,MAAM,IAAI;AAAA,IACtB;AAEA,iBAAa,iBAAiB,WAAW,QAAQ;AAEjD,WAAO,MAAM;AACX,mBAAa,oBAAoB,WAAW,QAAQ;AAAA,IACtD;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO,EAAE,YAAY;AACvB;","names":[]}

package/dist/esm/hooks/internal/useDataRef.d.ts

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

package/dist/esm/hooks/internal/useDataRef.js

@@ -0,0 +1,11 @@
+// src/hooks/internal/useDataRef.ts
+import { useRef } from "react";
+var useDataRef = (data) => {
+  const ref = useRef(data);
+  ref.current = data;
+  return ref;
+};
+export {
+  useDataRef
+};
+//# sourceMappingURL=useDataRef.js.map

package/dist/esm/hooks/internal/useDataRef.js.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,SAAS,cAAc;AAEhB,IAAM,aAAa,CAAI,SAAY;AACxC,QAAM,MAAM,OAAO,IAAI;AACvB,MAAI,UAAU;AAEd,SAAO;AACT;","names":[]}

package/dist/esm/hooks/internal/useWebsocketEvent.d.ts

@@ -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/esm/hooks/internal/useWebsocketEvent.js

@@ -0,0 +1,32 @@
+// src/hooks/internal/useWebsocketEvent.ts
+import { useEffect } from "react";
+import { useNovu } from "../NovuProvider.js";
+import { requestLock } from "../../utils/requestLock.js";
+import { useBrowserTabsChannel } from "./useBrowserTabsChannel.js";
+var useWebSocketEvent = ({
+  event: webSocketEvent,
+  eventHandler: onMessage
+}) => {
+  const novu = useNovu();
+  const { postMessage } = useBrowserTabsChannel({ channelName: `nv.${webSocketEvent}`, onMessage });
+  const updateReadCount = (data) => {
+    onMessage(data);
+    postMessage(data);
+  };
+  useEffect(() => {
+    let cleanup;
+    const resolveLock = requestLock(`nv.${webSocketEvent}`, () => {
+      cleanup = novu.on(webSocketEvent, updateReadCount);
+    });
+    return () => {
+      if (cleanup) {
+        cleanup();
+      }
+      resolveLock();
+    };
+  }, []);
+};
+export {
+  useWebSocketEvent
+};
+//# sourceMappingURL=useWebsocketEvent.js.map

package/dist/esm/hooks/internal/useWebsocketEvent.js.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":";AACA,SAAS,iBAAiB;AAC1B,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAC5B,SAAS,6BAA6B;AAE/B,IAAM,oBAAoB,CAA6B;AAAA,EAC5D,OAAO;AAAA,EACP,cAAc;AAChB,MAGM;AACJ,QAAM,OAAO,QAAQ;AACrB,QAAM,EAAE,YAAY,IAAI,sBAAsB,EAAE,aAAa,MAAM,cAAc,IAAI,UAAU,CAAC;AAEhG,QAAM,kBAA2C,CAAC,SAAS;AACzD,cAAU,IAAI;AACd,gBAAY,IAAI;AAAA,EAClB;AAEA,YAAU,MAAM;AACd,QAAI;AACJ,UAAM,cAAc,YAAY,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/esm/hooks/useCounts.d.ts

@@ -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/esm/hooks/useCounts.js

@@ -0,0 +1,76 @@
+// src/hooks/useCounts.ts
+import { useEffect, useState } from "react";
+import { areTagsEqual } from "@novu/js";
+import { useNovu } from "./NovuProvider.js";
+import { useWebSocketEvent } from "./internal/useWebsocketEvent.js";
+var useCounts = (props) => {
+  const { filters, onSuccess, onError } = props;
+  const { notifications } = useNovu();
+  const [error, setError] = useState();
+  const [counts, setCounts] = useState();
+  const [isLoading, setIsLoading] = useState(true);
+  const [isFetching, setIsFetching] = 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 (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?.(countsRes.error);
+      return;
+    }
+    const data = countsRes.data;
+    onSuccess?.(data.counts);
+    setCounts((oldCounts) => {
+      const newCounts = [];
+      const countsReceived = data.counts;
+      for (let i = 0; i < existingCounts.length; i++) {
+        const countReceived = countsReceived.find((c) => areTagsEqual(c.filter.tags, existingCounts[i]?.filter.tags));
+        newCounts.push(countReceived || oldCounts[i]);
+      }
+      return newCounts;
+    });
+  };
+  useWebSocketEvent({
+    event: "notifications.notification_received",
+    eventHandler: (data) => {
+      sync(data.result);
+    }
+  });
+  useWebSocketEvent({
+    event: "notifications.unread_count_changed",
+    eventHandler: () => {
+      sync();
+    }
+  });
+  useEffect(() => {
+    setError(void 0);
+    setIsLoading(true);
+    setIsFetching(false);
+    sync();
+  }, [JSON.stringify(filters)]);
+  const refetch = async () => {
+    await sync();
+  };
+  return { counts, error, refetch, isLoading, isFetching };
+};
+export {
+  useCounts
+};
+//# sourceMappingURL=useCounts.js.map

package/dist/esm/hooks/useCounts.js.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,SAAS,WAAW,gBAAgB;AACpC,SAAsD,oBAAoB;AAC1E,SAAS,eAAe;AACxB,SAAS,yBAAyB;AAqB3B,IAAM,YAAY,CAAC,UAA2C;AACnE,QAAM,EAAE,SAAS,WAAW,QAAQ,IAAI;AACxC,QAAM,EAAE,cAAc,IAAI,QAAQ;AAClC,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAoB;AAC9C,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAkB;AAC9C,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAC/C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,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,YAAI,aAAa,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,gBAAU,UAAU,KAAK;AAEzB;AAAA,IACF;AACA,UAAM,OAAO,UAAU;AACvB,gBAAY,KAAK,MAAM;AAEvB,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,MAAM,aAAa,EAAE,OAAO,MAAM,eAAe,CAAC,GAAG,OAAO,IAAI,CAAC;AAE5G,kBAAU,KAAK,iBAAiB,UAAW,CAAC,CAAC;AAAA,MAC/C;AAEA,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AAEA,oBAAkB;AAAA,IAChB,OAAO;AAAA,IACP,cAAc,CAAC,SAAS;AACtB,WAAK,KAAK,MAAM;AAAA,IAClB;AAAA,EACF,CAAC;AAED,oBAAkB;AAAA,IAChB,OAAO;AAAA,IACP,cAAc,MAAM;AAClB,WAAK;AAAA,IACP;AAAA,EACF,CAAC;AAED,YAAU,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/esm/hooks/useNotifications.d.ts

@@ -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 };