@novu/react 3.15.0 → 3.17.0-rc.d0046861c6

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

@@ -0,0 +1,17 @@
+import { ChannelEndpointResponse, NovuError, CreateChannelEndpointArgs } from '@novu/js';
+
+type UseCreateChannelEndpointProps = {
+    onSuccess?: (data: ChannelEndpointResponse) => void;
+    onError?: (error: NovuError) => void;
+};
+type UseCreateChannelEndpointResult = {
+    isCreating: boolean;
+    error?: NovuError;
+    create: (args: CreateChannelEndpointArgs) => Promise<{
+        data?: ChannelEndpointResponse | undefined;
+        error?: NovuError | undefined;
+    }>;
+};
+declare const useCreateChannelEndpoint: (props?: UseCreateChannelEndpointProps) => UseCreateChannelEndpointResult;
+
+export { type UseCreateChannelEndpointProps, type UseCreateChannelEndpointResult, useCreateChannelEndpoint };

package/dist/cjs/hooks/useDeleteChannelEndpoint.cjs

@@ -0,0 +1,69 @@
+"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/useDeleteChannelEndpoint.ts
+var useDeleteChannelEndpoint_exports = {};
+__export(useDeleteChannelEndpoint_exports, {
+  useDeleteChannelEndpoint: () => useDeleteChannelEndpoint
+});
+module.exports = __toCommonJS(useDeleteChannelEndpoint_exports);
+var import_react = require("react");
+var import_NovuProvider = require("./NovuProvider.cjs");
+var useDeleteChannelEndpoint = (props = {}) => {
+  const propsRef = (0, import_react.useRef)(props);
+  propsRef.current = props;
+  const novu = (0, import_NovuProvider.useNovu)();
+  const [isDeleting, setIsDeleting] = (0, import_react.useState)(false);
+  const [error, setError] = (0, import_react.useState)();
+  const remove = (0, import_react.useCallback)(
+    async (identifier) => {
+      var _a, _b, _c, _d, _e, _f;
+      setError(void 0);
+      setIsDeleting(true);
+      try {
+        const response = await novu.channelEndpoints.delete({ identifier });
+        if (response.error) {
+          setError(response.error);
+          (_b = (_a = propsRef.current).onError) == null ? void 0 : _b.call(_a, response.error);
+        } else {
+          (_d = (_c = propsRef.current).onSuccess) == null ? void 0 : _d.call(_c);
+        }
+        return response;
+      } catch (err) {
+        const novuError = err;
+        setError(novuError);
+        (_f = (_e = propsRef.current).onError) == null ? void 0 : _f.call(_e, novuError);
+        return { error: novuError };
+      } finally {
+        setIsDeleting(false);
+      }
+    },
+    [novu]
+  );
+  return {
+    remove,
+    isDeleting,
+    error
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useDeleteChannelEndpoint
+});
+//# sourceMappingURL=useDeleteChannelEndpoint.cjs.map

package/dist/cjs/hooks/useDeleteChannelEndpoint.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/hooks/useDeleteChannelEndpoint.ts"],"sourcesContent":["import type { NovuError } from '@novu/js';\nimport { useCallback, useRef, useState } from 'react';\nimport { useNovu } from './NovuProvider';\n\nexport type UseDeleteChannelEndpointProps = {\n  onSuccess?: () => void;\n  onError?: (error: NovuError) => void;\n};\n\nexport type UseDeleteChannelEndpointResult = {\n  isDeleting: boolean;\n  error?: NovuError;\n  remove: (identifier: string) => Promise<{\n    data?: undefined;\n    error?: NovuError | undefined;\n  }>;\n};\n\nexport const useDeleteChannelEndpoint = (props: UseDeleteChannelEndpointProps = {}): UseDeleteChannelEndpointResult => {\n  const propsRef = useRef<UseDeleteChannelEndpointProps>(props);\n  propsRef.current = props;\n  const novu = useNovu();\n  const [isDeleting, setIsDeleting] = useState(false);\n  const [error, setError] = useState<NovuError>();\n\n  const remove = useCallback(\n    async (identifier: string) => {\n      setError(undefined);\n      setIsDeleting(true);\n\n      try {\n        const response = await novu.channelEndpoints.delete({ identifier });\n\n        if (response.error) {\n          setError(response.error as NovuError);\n          propsRef.current.onError?.(response.error as NovuError);\n        } else {\n          propsRef.current.onSuccess?.();\n        }\n\n        return response as { data?: undefined; error?: NovuError };\n      } catch (err) {\n        const novuError = err as NovuError;\n        setError(novuError);\n        propsRef.current.onError?.(novuError);\n\n        return { error: novuError };\n      } finally {\n        setIsDeleting(false);\n      }\n    },\n    [novu]\n  );\n\n  return {\n    remove,\n    isDeleting,\n    error,\n  };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAA8C;AAC9C,0BAAwB;AAgBjB,IAAM,2BAA2B,CAAC,QAAuC,CAAC,MAAsC;AACrH,QAAM,eAAW,qBAAsC,KAAK;AAC5D,WAAS,UAAU;AACnB,QAAM,WAAO,6BAAQ;AACrB,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAClD,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAoB;AAE9C,QAAM,aAAS;AAAA,IACb,OAAO,eAAuB;AA1BlC;AA2BM,eAAS,MAAS;AAClB,oBAAc,IAAI;AAElB,UAAI;AACF,cAAM,WAAW,MAAM,KAAK,iBAAiB,OAAO,EAAE,WAAW,CAAC;AAElE,YAAI,SAAS,OAAO;AAClB,mBAAS,SAAS,KAAkB;AACpC,+BAAS,SAAQ,YAAjB,4BAA2B,SAAS;AAAA,QACtC,OAAO;AACL,+BAAS,SAAQ,cAAjB;AAAA,QACF;AAEA,eAAO;AAAA,MACT,SAAS,KAAK;AACZ,cAAM,YAAY;AAClB,iBAAS,SAAS;AAClB,6BAAS,SAAQ,YAAjB,4BAA2B;AAE3B,eAAO,EAAE,OAAO,UAAU;AAAA,MAC5B,UAAE;AACA,sBAAc,KAAK;AAAA,MACrB;AAAA,IACF;AAAA,IACA,CAAC,IAAI;AAAA,EACP;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

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

@@ -0,0 +1,17 @@
+import { NovuError } from '@novu/js';
+
+type UseDeleteChannelEndpointProps = {
+    onSuccess?: () => void;
+    onError?: (error: NovuError) => void;
+};
+type UseDeleteChannelEndpointResult = {
+    isDeleting: boolean;
+    error?: NovuError;
+    remove: (identifier: string) => Promise<{
+        data?: undefined;
+        error?: NovuError | undefined;
+    }>;
+};
+declare const useDeleteChannelEndpoint: (props?: UseDeleteChannelEndpointProps) => UseDeleteChannelEndpointResult;
+
+export { type UseDeleteChannelEndpointProps, type UseDeleteChannelEndpointResult, useDeleteChannelEndpoint };

package/dist/cjs/hooks/useNotifications.cjs

@@ -40,6 +40,7 @@ var useNotifications = (props) => {
     createdGte,
     createdLte,
     limit = 10,
+    realtime: propsRealtime,
     onSuccess,
     onError
   } = props || {};
@@ -56,6 +57,8 @@ var useNotifications = (props) => {
     createdLte
   });
   const novu = (0, import_NovuProvider.useNovu)();
+  const providerRealtime = (0, import_NovuProvider.useRealtime)();
+  const realtime = propsRealtime ?? providerRealtime;
   const [data, setData] = (0, import_react.useState)();
   const [error, setError] = (0, import_react.useState)();
   const [isLoading, setIsLoading] = (0, import_react.useState)(true);
@@ -81,6 +84,7 @@ var useNotifications = (props) => {
   }, [filterRef, novu]);
   (0, import_useWebsocketEvent.useWebSocketEvent)({
     event: "notifications.notification_received",
+    enabled: realtime,
     eventHandler: ({ result: notification }) => {
       const currentFilter = filterRef.current;
       const matches = (0, import_js.checkNotificationMatchesFilter)(notification, currentFilter);

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, useState } from 'react';\nimport { useDataRef } from './internal/useDataRef';\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 * // Get notifications from a specific time period\n * const { notifications } = useNotifications({\n *   createdGte: 1704067200000,\n *   createdLte: 1735689599999\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  createdGte?: NotificationFilter['createdGte'];\n  createdLte?: NotificationFilter['createdLte'];\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    createdGte,\n    createdLte,\n    limit = 10,\n    onSuccess,\n    onError,\n  } = props || {};\n  const limitRef = useDataRef<number | undefined>(limit);\n  const filterRef = useDataRef<NotificationFilter>({\n    tags,\n    data: dataFilter,\n    read,\n    archived,\n    snoozed,\n    seen,\n    severity,\n    createdGte,\n    createdLte,\n  });\n  const novu = 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  const afterRef = useDataRef<string | undefined>(after);\n\n  useEffect(() => {\n    const listener = ({\n      data,\n    }: {\n      data: { notifications: Notification[]; hasMore: boolean; filter: NotificationFilter };\n    }) => {\n      if (!data || !isSameFilter(filterRef.current, data.filter)) {\n        return;\n      }\n\n      // the event is called with the list of all notifications cached matching the current filter\n      setData(data.notifications);\n      setHasMore(data.hasMore);\n    };\n\n    const cleanup = novu.on('notifications.list.updated', listener);\n\n    return () => {\n      cleanup();\n    };\n  }, [filterRef, novu]);\n\n  useWebSocketEvent({\n    event: 'notifications.notification_received',\n    eventHandler: ({ result: notification }) => {\n      const currentFilter = filterRef.current;\n      const matches = checkNotificationMatchesFilter(notification, currentFilter);\n      if (matches) {\n        // the limit and after props are used to create a cache key\n        // the first batch of notifications in the cache doesn't include the after prop and we want to push to the first batch\n        const cacheKey = { ...currentFilter, limit: limitRef.current };\n        novu.notifications.cache.unshift(cacheKey, notification);\n      }\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 response = await novu.notifications.list({\n        ...filterRef.current,\n        limit,\n        after: options?.refetch ? undefined : afterRef.current,\n      });\n\n      if (response.error) {\n        setError(response.error);\n        onError?.(response.error);\n        setIsLoading(false);\n        setIsFetching(false);\n      } else if (response.data) {\n        const responseData = response.data;\n        onSuccess?.(responseData.notifications);\n        setData(responseData.notifications);\n        setHasMore(responseData.hasMore);\n        setIsLoading(false);\n        setIsFetching(false);\n      }\n    },\n    [novu, filterRef, afterRef, limit, onError, onSuccess]\n  );\n\n  useEffect(() => {\n    novu.notifications.clearCache({ filter: filterRef.current });\n    fetchNotifications({ refetch: true });\n  }, [filterRef, novu, JSON.stringify(filterRef.current), fetchNotifications]);\n\n  const refetch = useCallback(() => {\n    novu.notifications.clearCache({ filter: filterRef.current });\n    return fetchNotifications({ refetch: true });\n  }, [filterRef, novu, fetchNotifications]);\n\n  const fetchMore = useCallback(async () => {\n    if (!hasMore || isFetching) return;\n\n    return fetchNotifications();\n  }, [hasMore, isFetching, fetchNotifications]);\n\n  const readAll = useCallback(async () => {\n    return await novu.notifications.readAll({ tags: filterRef.current.tags, data: filterRef.current.data });\n  }, [filterRef, novu]);\n\n  const seenAll = useCallback(async () => {\n    return await novu.notifications.seenAll({ tags: filterRef.current.tags, data: filterRef.current.data });\n  }, [filterRef, novu]);\n\n  const archiveAll = useCallback(async () => {\n    return await novu.notifications.archiveAll({ tags: filterRef.current.tags, data: filterRef.current.data });\n  }, [filterRef, novu]);\n\n  const archiveAllRead = useCallback(async () => {\n    return await novu.notifications.archiveAllRead({ tags: filterRef.current.tags, data: filterRef.current.data });\n  }, [filterRef, novu]);\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":["data"]}
+{"version":3,"sources":["../../../src/hooks/useNotifications.ts"],"sourcesContent":["import { checkNotificationMatchesFilter, isSameFilter, Notification, NotificationFilter, NovuError } from '@novu/js';\nimport { useCallback, useEffect, useState } from 'react';\nimport { useDataRef } from './internal/useDataRef';\nimport { useWebSocketEvent } from './internal/useWebsocketEvent';\nimport { useNovu, useRealtime } 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 * // Get notifications from a specific time period\n * const { notifications } = useNotifications({\n *   createdGte: 1704067200000,\n *   createdLte: 1735689599999\n * });\n *\n * // Opt out of the built-in realtime updates and drive them yourself\n * const { notifications, refetch } = useNotifications({\n *   read: false,\n *   realtime: 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  createdGte?: NotificationFilter['createdGte'];\n  createdLte?: NotificationFilter['createdLte'];\n  limit?: number;\n  /**\n   * When `false`, disables the WebSocket subscription that auto-injects\n   * newly received notifications into the list. Built-in mutations like\n   * `readAll`, `seenAll`, `archiveAll`, and `archiveAllRead` continue to\n   * update local state. Use this when you want to drive new-notification updates yourself (e.g.\n   * via your own `novu.on('notifications.notification_received', ...)`\n   * handler combined with `refetch()`).\n   *\n   * When set, this prop takes precedence over the `realtime` config on\n   * `<NovuProvider />`. When omitted, the provider value (default `true`) is used.\n   */\n  realtime?: boolean;\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    createdGte,\n    createdLte,\n    limit = 10,\n    realtime: propsRealtime,\n    onSuccess,\n    onError,\n  } = props || {};\n  const limitRef = useDataRef<number | undefined>(limit);\n  const filterRef = useDataRef<NotificationFilter>({\n    tags,\n    data: dataFilter,\n    read,\n    archived,\n    snoozed,\n    seen,\n    severity,\n    createdGte,\n    createdLte,\n  });\n  const novu = useNovu();\n  const providerRealtime = useRealtime();\n  const realtime = propsRealtime ?? providerRealtime;\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  const afterRef = useDataRef<string | undefined>(after);\n\n  useEffect(() => {\n    const listener = ({\n      data,\n    }: {\n      data: { notifications: Notification[]; hasMore: boolean; filter: NotificationFilter };\n    }) => {\n      if (!data || !isSameFilter(filterRef.current, data.filter)) {\n        return;\n      }\n\n      // the event is called with the list of all notifications cached matching the current filter\n      setData(data.notifications);\n      setHasMore(data.hasMore);\n    };\n\n    const cleanup = novu.on('notifications.list.updated', listener);\n\n    return () => {\n      cleanup();\n    };\n  }, [filterRef, novu]);\n\n  useWebSocketEvent({\n    event: 'notifications.notification_received',\n    enabled: realtime,\n    eventHandler: ({ result: notification }) => {\n      const currentFilter = filterRef.current;\n      const matches = checkNotificationMatchesFilter(notification, currentFilter);\n      if (matches) {\n        // the limit and after props are used to create a cache key\n        // the first batch of notifications in the cache doesn't include the after prop and we want to push to the first batch\n        const cacheKey = { ...currentFilter, limit: limitRef.current };\n        novu.notifications.cache.unshift(cacheKey, notification);\n      }\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 response = await novu.notifications.list({\n        ...filterRef.current,\n        limit,\n        after: options?.refetch ? undefined : afterRef.current,\n      });\n\n      if (response.error) {\n        setError(response.error);\n        onError?.(response.error);\n        setIsLoading(false);\n        setIsFetching(false);\n      } else if (response.data) {\n        const responseData = response.data;\n        onSuccess?.(responseData.notifications);\n        setData(responseData.notifications);\n        setHasMore(responseData.hasMore);\n        setIsLoading(false);\n        setIsFetching(false);\n      }\n    },\n    [novu, filterRef, afterRef, limit, onError, onSuccess]\n  );\n\n  useEffect(() => {\n    novu.notifications.clearCache({ filter: filterRef.current });\n    fetchNotifications({ refetch: true });\n  }, [filterRef, novu, JSON.stringify(filterRef.current), fetchNotifications]);\n\n  const refetch = useCallback(() => {\n    novu.notifications.clearCache({ filter: filterRef.current });\n    return fetchNotifications({ refetch: true });\n  }, [filterRef, novu, fetchNotifications]);\n\n  const fetchMore = useCallback(async () => {\n    if (!hasMore || isFetching) return;\n\n    return fetchNotifications();\n  }, [hasMore, isFetching, fetchNotifications]);\n\n  const readAll = useCallback(async () => {\n    return await novu.notifications.readAll({ tags: filterRef.current.tags, data: filterRef.current.data });\n  }, [filterRef, novu]);\n\n  const seenAll = useCallback(async () => {\n    return await novu.notifications.seenAll({ tags: filterRef.current.tags, data: filterRef.current.data });\n  }, [filterRef, novu]);\n\n  const archiveAll = useCallback(async () => {\n    return await novu.notifications.archiveAll({ tags: filterRef.current.tags, data: filterRef.current.data });\n  }, [filterRef, novu]);\n\n  const archiveAllRead = useCallback(async () => {\n    return await novu.notifications.archiveAllRead({ tags: filterRef.current.tags, data: filterRef.current.data });\n  }, [filterRef, novu]);\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":["data"]}

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

@@ -26,6 +26,12 @@ import { NotificationFilter, Notification, NovuError } from '@novu/js';
  *   createdGte: 1704067200000,
  *   createdLte: 1735689599999
  * });
+ *
+ * // Opt out of the built-in realtime updates and drive them yourself
+ * const { notifications, refetch } = useNotifications({
+ *   read: false,
+ *   realtime: false,
+ * });
  * ```
  */
 type UseNotificationsProps = {
@@ -39,6 +45,18 @@ type UseNotificationsProps = {
     createdGte?: NotificationFilter['createdGte'];
     createdLte?: NotificationFilter['createdLte'];
     limit?: number;
+    /**
+     * When `false`, disables the WebSocket subscription that auto-injects
+     * newly received notifications into the list. Built-in mutations like
+     * `readAll`, `seenAll`, `archiveAll`, and `archiveAllRead` continue to
+     * update local state. Use this when you want to drive new-notification updates yourself (e.g.
+     * via your own `novu.on('notifications.notification_received', ...)`
+     * handler combined with `refetch()`).
+     *
+     * When set, this prop takes precedence over the `realtime` config on
+     * `<NovuProvider />`. When omitted, the provider value (default `true`) is used.
+     */
+    realtime?: boolean;
     onSuccess?: (data: Notification[]) => void;
     onError?: (error: NovuError) => void;
 };

package/dist/cjs/index.cjs

@@ -23,17 +23,26 @@ __export(index_exports, {
   Bell: () => import_components.Bell,
   Inbox: () => import_components.Inbox,
   InboxContent: () => import_components.InboxContent,
+  MsTeamsConnectButton: () => import_components.MsTeamsConnectButton,
+  MsTeamsLinkUser: () => import_components.MsTeamsLinkUser,
   Notifications: () => import_components.Notifications,
   NovuProvider: () => import_components.NovuProvider,
   PreferenceLevel: () => import_js.PreferenceLevel,
   Preferences: () => import_components.Preferences,
   SeverityLevelEnum: () => import_js.SeverityLevelEnum,
+  SlackConnectButton: () => import_components.SlackConnectButton,
+  SlackLinkUser: () => import_components.SlackLinkUser,
   Subscription: () => import_components.Subscription,
   SubscriptionButton: () => import_components.SubscriptionButton,
   SubscriptionPreferences: () => import_components.SubscriptionPreferences,
   WorkflowCriticalityEnum: () => import_js.WorkflowCriticalityEnum,
+  useChannelConnection: () => import_hooks.useChannelConnection,
+  useChannelConnections: () => import_hooks.useChannelConnections,
+  useChannelEndpoint: () => import_hooks.useChannelEndpoint,
   useCounts: () => import_hooks.useCounts,
+  useCreateChannelEndpoint: () => import_hooks.useCreateChannelEndpoint,
   useCreateSubscription: () => import_hooks.useCreateSubscription,
+  useDeleteChannelEndpoint: () => import_hooks.useDeleteChannelEndpoint,
   useNotifications: () => import_hooks.useNotifications,
   useNovu: () => import_hooks.useNovu,
   usePreferences: () => import_hooks.usePreferences,
@@ -52,17 +61,26 @@ var import_hooks = require("./hooks/index.cjs");
   Bell,
   Inbox,
   InboxContent,
+  MsTeamsConnectButton,
+  MsTeamsLinkUser,
   Notifications,
   NovuProvider,
   PreferenceLevel,
   Preferences,
   SeverityLevelEnum,
+  SlackConnectButton,
+  SlackLinkUser,
   Subscription,
   SubscriptionButton,
   SubscriptionPreferences,
   WorkflowCriticalityEnum,
+  useChannelConnection,
+  useChannelConnections,
+  useChannelEndpoint,
   useCounts,
+  useCreateChannelEndpoint,
   useCreateSubscription,
+  useDeleteChannelEndpoint,
   useNotifications,
   useNovu,
   usePreferences,

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export type * from '@novu/js';\nexport { PreferenceLevel, SeverityLevelEnum, WorkflowCriticalityEnum } from '@novu/js';\n\nexport type {\n  AllLocalization,\n  AllLocalizationKey,\n  ElementStyles,\n  InboxAppearance,\n  InboxAppearanceCallback,\n  InboxAppearanceCallbackFunction,\n  InboxAppearanceCallbackKeys,\n  InboxAppearanceKey,\n  InboxElements,\n  InboxLocalization,\n  InboxLocalizationKey,\n  InboxTheme,\n  NotificationActionClickHandler,\n  NotificationClickHandler,\n  NotificationRenderer,\n  PreferenceGroups,\n  PreferencesFilter,\n  RouterPush,\n  SubscriptionAppearance,\n  SubscriptionAppearanceCallback,\n  SubscriptionAppearanceCallbackFunction,\n  SubscriptionAppearanceCallbackKeys,\n  SubscriptionAppearanceKey,\n  SubscriptionElements,\n  SubscriptionLocalization,\n  SubscriptionLocalizationKey,\n  SubscriptionTheme,\n  Tab,\n  Variables,\n} from '@novu/js/ui';\nexport type {\n  BellProps,\n  InboxContentProps,\n  InboxProps,\n  NotificationProps,\n  NovuProviderProps,\n  SubscriptionButtonProps,\n  SubscriptionPreferencesProps,\n  SubscriptionProps,\n} from './components';\nexport {\n  Bell,\n  Inbox,\n  InboxContent,\n  Notifications,\n  NovuProvider,\n  Preferences,\n  Subscription,\n  SubscriptionButton,\n  SubscriptionPreferences,\n} from './components';\nexport type {\n  UseCountsProps,\n  UseCountsResult,\n  UseNotificationsProps,\n  UseNotificationsResult,\n  UsePreferencesResult,\n  UseScheduleProps as UsePreferencesProps,\n} from './hooks';\nexport {\n  useCounts,\n  useCreateSubscription,\n  useNotifications,\n  useNovu,\n  usePreferences,\n  useRemoveSubscription,\n  useSchedule,\n  useSubscription,\n  useSubscriptions,\n  useUpdateSubscription,\n} from './hooks';\n\nexport type {\n  BaseProps,\n  BellRenderer,\n  BodyRenderer,\n  DefaultInboxProps,\n  DefaultProps,\n  NoRendererProps,\n  NotificationRendererProps,\n  NotificationsRenderer,\n  ReactInboxAppearance,\n  ReactInboxTheme,\n  ReactSubscriptionAppearance,\n  ReactSubscriptionTheme,\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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,gBAA4E;AA2C5E,wBAUO;AASP,mBAWO;","names":[]}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["export type * from '@novu/js';\nexport { PreferenceLevel, SeverityLevelEnum, WorkflowCriticalityEnum } from '@novu/js';\n\nexport type {\n  AllLocalization,\n  AllLocalizationKey,\n  ChannelConnectButtonIconKey,\n  ElementStyles,\n  InboxAppearance,\n  InboxAppearanceCallback,\n  InboxAppearanceCallbackFunction,\n  InboxAppearanceCallbackKeys,\n  InboxAppearanceKey,\n  InboxElements,\n  InboxLocalization,\n  InboxLocalizationKey,\n  InboxTheme,\n  NotificationActionClickHandler,\n  NotificationClickHandler,\n  NotificationRenderer,\n  PreferenceGroups,\n  PreferencesFilter,\n  RouterPush,\n  SubscriptionAppearance,\n  SubscriptionAppearanceCallback,\n  SubscriptionAppearanceCallbackFunction,\n  SubscriptionAppearanceCallbackKeys,\n  SubscriptionAppearanceKey,\n  SubscriptionElements,\n  SubscriptionLocalization,\n  SubscriptionLocalizationKey,\n  SubscriptionTheme,\n  Tab,\n  Variables,\n} from '@novu/js/ui';\nexport type {\n  BellProps,\n  InboxContentProps,\n  InboxProps,\n  MsTeamsConnectButtonProps,\n  MsTeamsLinkUserProps,\n  NotificationProps,\n  NovuProviderProps,\n  SlackConnectButtonProps,\n  SlackLinkUserProps,\n  SubscriptionButtonProps,\n  SubscriptionPreferencesProps,\n  SubscriptionProps,\n} from './components';\nexport {\n  Bell,\n  Inbox,\n  InboxContent,\n  MsTeamsConnectButton,\n  MsTeamsLinkUser,\n  Notifications,\n  NovuProvider,\n  Preferences,\n  SlackConnectButton,\n  SlackLinkUser,\n  Subscription,\n  SubscriptionButton,\n  SubscriptionPreferences,\n} from './components';\nexport type {\n  UseChannelConnectionProps,\n  UseChannelConnectionResult,\n  UseChannelConnectionsProps,\n  UseChannelConnectionsResult,\n  UseChannelEndpointProps,\n  UseChannelEndpointResult,\n  UseCountsProps,\n  UseCountsResult,\n  UseCreateChannelEndpointProps,\n  UseCreateChannelEndpointResult,\n  UseDeleteChannelEndpointProps,\n  UseDeleteChannelEndpointResult,\n  UseNotificationsProps,\n  UseNotificationsResult,\n  UsePreferencesResult,\n  UseScheduleProps as UsePreferencesProps,\n} from './hooks';\nexport {\n  useChannelConnection,\n  useChannelConnections,\n  useChannelEndpoint,\n  useCounts,\n  useCreateChannelEndpoint,\n  useCreateSubscription,\n  useDeleteChannelEndpoint,\n  useNotifications,\n  useNovu,\n  usePreferences,\n  useRemoveSubscription,\n  useSchedule,\n  useSubscription,\n  useSubscriptions,\n  useUpdateSubscription,\n} from './hooks';\n\nexport type {\n  BaseProps,\n  BellRenderer,\n  BodyRenderer,\n  DefaultInboxProps,\n  DefaultProps,\n  NoRendererProps,\n  NotificationRendererProps,\n  NotificationsRenderer,\n  ReactAllAppearance,\n  ReactInboxAppearance,\n  ReactInboxTheme,\n  ReactSubscriptionAppearance,\n  ReactSubscriptionTheme,\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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,gBAA4E;AAgD5E,wBAcO;AAmBP,mBAgBO;","names":[]}

package/dist/cjs/index.d.cts

@@ -1,17 +1,26 @@
 export * from '@novu/js';
 export { PreferenceLevel, SeverityLevelEnum, WorkflowCriticalityEnum } from '@novu/js';
-export { AllLocalization, AllLocalizationKey, ElementStyles, InboxAppearance, InboxAppearanceCallback, InboxAppearanceCallbackFunction, InboxAppearanceCallbackKeys, InboxAppearanceKey, InboxElements, InboxLocalization, InboxLocalizationKey, InboxTheme, NotificationActionClickHandler, NotificationClickHandler, NotificationRenderer, PreferenceGroups, PreferencesFilter, RouterPush, SubscriptionAppearance, SubscriptionAppearanceCallback, SubscriptionAppearanceCallbackFunction, SubscriptionAppearanceCallbackKeys, SubscriptionAppearanceKey, SubscriptionElements, SubscriptionLocalization, SubscriptionLocalizationKey, SubscriptionTheme, Tab, Variables } from '@novu/js/ui';
+export { AllLocalization, AllLocalizationKey, ChannelConnectButtonIconKey, ElementStyles, InboxAppearance, InboxAppearanceCallback, InboxAppearanceCallbackFunction, InboxAppearanceCallbackKeys, InboxAppearanceKey, InboxElements, InboxLocalization, InboxLocalizationKey, InboxTheme, NotificationActionClickHandler, NotificationClickHandler, NotificationRenderer, PreferenceGroups, PreferencesFilter, RouterPush, SubscriptionAppearance, SubscriptionAppearanceCallback, SubscriptionAppearanceCallbackFunction, SubscriptionAppearanceCallbackKeys, SubscriptionAppearanceKey, SubscriptionElements, SubscriptionLocalization, SubscriptionLocalizationKey, SubscriptionTheme, Tab, Variables } from '@novu/js/ui';
 export { NovuProvider, NovuProviderProps, useNovu } from './hooks/NovuProvider.cjs';
 export { Bell, BellProps } from './components/Bell.cjs';
 export { Inbox, InboxProps } from './components/Inbox.cjs';
 export { InboxContent, InboxContentProps } from './components/InboxContent.cjs';
+export { MsTeamsConnectButton, MsTeamsConnectButtonProps } from './components/msteams-connect-button/MsTeamsConnectButton.cjs';
+export { MsTeamsLinkUser, MsTeamsLinkUserProps } from './components/msteams-link-user/MsTeamsLinkUser.cjs';
 export { NotificationProps, Notifications } from './components/Notifications.cjs';
 export { Preferences } from './components/Preferences.cjs';
+export { SlackConnectButton, SlackConnectButtonProps } from './components/slack-connect-button/SlackConnectButton.cjs';
+export { SlackLinkUser, SlackLinkUserProps } from './components/slack-link-user/SlackLinkUser.cjs';
 export { Subscription, SubscriptionProps } from './components/subscription/Subscription.cjs';
 export { SubscriptionButton, SubscriptionButtonProps } from './components/subscription/SubscriptionButton.cjs';
 export { SubscriptionPreferences, SubscriptionPreferencesProps } from './components/subscription/SubscriptionPreferences.cjs';
+export { UseChannelConnectionProps, UseChannelConnectionResult, useChannelConnection } from './hooks/useChannelConnection.cjs';
+export { UseChannelConnectionsProps, UseChannelConnectionsResult, useChannelConnections } from './hooks/useChannelConnections.cjs';
+export { UseChannelEndpointProps, UseChannelEndpointResult, useChannelEndpoint } from './hooks/useChannelEndpoint.cjs';
 export { UseCountsProps, UseCountsResult, useCounts } from './hooks/useCounts.cjs';
+export { UseCreateChannelEndpointProps, UseCreateChannelEndpointResult, useCreateChannelEndpoint } from './hooks/useCreateChannelEndpoint.cjs';
 export { useCreateSubscription } from './hooks/useCreateSubscription.cjs';
+export { UseDeleteChannelEndpointProps, UseDeleteChannelEndpointResult, useDeleteChannelEndpoint } from './hooks/useDeleteChannelEndpoint.cjs';
 export { UseNotificationsProps, UseNotificationsResult, useNotifications } from './hooks/useNotifications.cjs';
 export { UsePreferencesResult, usePreferences } from './hooks/usePreferences.cjs';
 export { useRemoveSubscription } from './hooks/useRemoveSubscription.cjs';
@@ -19,8 +28,12 @@ export { UseScheduleProps as UsePreferencesProps, useSchedule } from './hooks/us
 export { useSubscription } from './hooks/useSubscription.cjs';
 export { useSubscriptions } from './hooks/useSubscriptions.cjs';
 export { useUpdateSubscription } from './hooks/useUpdateSubscription.cjs';
-export { BaseProps, BellRenderer, BodyRenderer, DefaultInboxProps, DefaultProps, NoRendererProps, NotificationRendererProps, NotificationsRenderer, ReactInboxAppearance, ReactInboxTheme, ReactSubscriptionAppearance, ReactSubscriptionTheme, SubjectBodyRendererProps, SubjectRenderer, WithChildrenProps } from './utils/types.cjs';
+export { BaseProps, BellRenderer, BodyRenderer, DefaultInboxProps, DefaultProps, NoRendererProps, NotificationRendererProps, NotificationsRenderer, ReactAllAppearance, ReactInboxAppearance, ReactInboxTheme, ReactSubscriptionAppearance, ReactSubscriptionTheme, SubjectBodyRendererProps, SubjectRenderer, WithChildrenProps } from './utils/types.cjs';
 import 'react/jsx-runtime';
 import 'react';
 import './components/NovuUI.cjs';
+import './components/msteams-connect-button/DefaultMsTeamsConnectButton.cjs';
+import './components/msteams-link-user/DefaultMsTeamsLinkUser.cjs';
+import './components/slack-connect-button/DefaultSlackConnectButton.cjs';
+import './components/slack-link-user/DefaultSlackLinkUser.cjs';
 import './components/subscription/DefaultSubscription.cjs';

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

@@ -1 +1,2 @@
 export { buildSubscriber } from '@novu/js/internal';
+import '@novu/js/themes';

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

@@ -15,8 +15,8 @@ import { UseUpdateSubscriptionProps, UseUpdateSubscriptionResult } from '../hook
 export { AllLocalization, AllLocalizationKey, ElementStyles, InboxAppearance, InboxAppearanceCallback, InboxAppearanceCallbackFunction, InboxAppearanceCallbackKeys, InboxAppearanceKey, InboxElements, InboxLocalization, InboxLocalizationKey, InboxTheme, NotificationActionClickHandler, NotificationClickHandler, NotificationRenderer, PreferenceGroups, PreferencesFilter, RouterPush, SubscriptionAppearance, SubscriptionAppearanceCallback, SubscriptionAppearanceCallbackFunction, SubscriptionAppearanceCallbackKeys, SubscriptionAppearanceKey, SubscriptionElements, SubscriptionLocalization, SubscriptionLocalizationKey, SubscriptionTheme, Tab, Variables } from '@novu/js/ui';
 export { BellProps } from '../components/Bell.cjs';
 export { InboxContentProps } from '../components/InboxContent.cjs';
-export { NotificationProps } from '../components/Notifications.cjs';
 export { BaseProps, BellRenderer, BodyRenderer, DefaultInboxProps, DefaultProps, NoRendererProps, NotificationRendererProps, NotificationsRenderer, SubjectBodyRendererProps, SubjectRenderer, WithChildrenProps } from '../utils/types.cjs';
+export { NotificationProps } from '../components/Notifications.cjs';
 import 'react';
 
 /**

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

@@ -1,2 +1 @@
 export * from '@novu/js/themes';
-import '@novu/js/internal';

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/appearance.ts"],"sourcesContent":["import type { AllAppearance, AllIconKey, AllIconOverrides } from '@novu/js/ui';\nimport { MountedElement } from '../context/RendererContext';\nimport type { ReactIconRenderer, ReactInboxAppearance, ReactSubscriptionAppearance } from './types';\n\nexport function adaptAppearanceForJs(\n  appearance: ReactInboxAppearance | ReactSubscriptionAppearance,\n  mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void\n): AllAppearance | undefined {\n  if (!appearance) {\n    return undefined;\n  }\n  const { icons, ...restAppearance } = appearance;\n  const jsAppearance = { ...restAppearance } as AllAppearance;\n\n  if (icons) {\n    const jsIcons: AllIconOverrides = {};\n    const iconKeys = Object.keys(icons) as Array<AllIconKey>;\n\n    for (const iconKey of iconKeys) {\n      // @ts-expect-error: cant easily fix this type error\n      const reactRenderer = icons[iconKey] as ReactIconRenderer;\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,cAC2B;AAC3B,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AACA,QAAM,EAAE,OAAO,GAAG,eAAe,IAAI;AACrC,QAAM,eAAe,EAAE,GAAG,eAAe;AAEzC,MAAI,OAAO;AACT,UAAM,UAA4B,CAAC;AACnC,UAAM,WAAW,OAAO,KAAK,KAAK;AAElC,eAAW,WAAW,UAAU;AAE9B,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":[]}
+{"version":3,"sources":["../../../src/utils/appearance.ts"],"sourcesContent":["import type { AllAppearance, AllIconKey, AllIconOverrides } from '@novu/js/ui';\nimport { MountedElement } from '../context/RendererContext';\nimport type { ReactAllAppearance, ReactIconRenderer, ReactInboxAppearance, ReactSubscriptionAppearance } from './types';\n\nexport function adaptAppearanceForJs(\n  appearance: ReactInboxAppearance | ReactSubscriptionAppearance | ReactAllAppearance,\n  mountElement: (el: HTMLElement, mountedElement: MountedElement) => () => void\n): AllAppearance | undefined {\n  if (!appearance) {\n    return undefined;\n  }\n  const { icons, ...restAppearance } = appearance;\n  const jsAppearance = { ...restAppearance } as AllAppearance;\n\n  if (icons) {\n    const jsIcons: AllIconOverrides = {};\n    const iconKeys = Object.keys(icons) as Array<AllIconKey>;\n\n    for (const iconKey of iconKeys) {\n      // @ts-expect-error: cant easily fix this type error\n      const reactRenderer = icons[iconKey] as ReactIconRenderer;\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,cAC2B;AAC3B,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AACA,QAAM,EAAE,OAAO,GAAG,eAAe,IAAI;AACrC,QAAM,eAAe,EAAE,GAAG,eAAe;AAEzC,MAAI,OAAO;AACT,UAAM,UAA4B,CAAC;AACnC,UAAM,WAAW,OAAO,KAAK,KAAK;AAElC,eAAW,WAAW,UAAU;AAE9B,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":[]}

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

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

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

@@ -2,10 +2,10 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { Novu } from '@novu/js';
 import { NovuUIOptions as NovuUIOptions$1 } from '@novu/js/ui';
 import React__default from 'react';
-import { ReactInboxAppearance, ReactSubscriptionAppearance } from '../utils/types.js';
+import { ReactInboxAppearance, ReactSubscriptionAppearance, ReactAllAppearance } from '../utils/types.js';
 
 type NovuUIOptions = Omit<NovuUIOptions$1, 'appearance'> & {
-    appearance?: ReactInboxAppearance | ReactSubscriptionAppearance;
+    appearance?: ReactInboxAppearance | ReactSubscriptionAppearance | ReactAllAppearance;
 };
 type NovuUIProps = React__default.PropsWithChildren<{
     options: NovuUIOptions;

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

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

package/dist/esm/components/connect-chat/ConnectChat.d.ts

@@ -0,0 +1,12 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React__default from 'react';
+import { NovuUIOptions } from '../NovuUI.js';
+import { DefaultConnectChatProps } from './DefaultConnectChat.js';
+import '@novu/js';
+import '@novu/js/ui';
+import '../../utils/types.js';
+
+type ConnectChatProps = DefaultConnectChatProps & Pick<NovuUIOptions, 'container' | 'appearance'>;
+declare const ConnectChat: React__default.MemoExoticComponent<(props: ConnectChatProps) => react_jsx_runtime.JSX.Element>;
+
+export { ConnectChat, type ConnectChatProps };

package/dist/esm/components/connect-chat/ConnectChat.js

@@ -0,0 +1,28 @@
+// src/components/connect-chat/ConnectChat.tsx
+import React, { useMemo } from "react";
+import { useNovu } from "../../hooks/NovuProvider.js";
+import { NovuUI } from "../NovuUI.js";
+import { withRenderer } from "../Renderer.js";
+import { DefaultConnectChat } from "./DefaultConnectChat.js";
+import { jsx } from "react/jsx-runtime";
+var ConnectChatInternal = withRenderer((props) => {
+  const { container, appearance, ...defaultProps } = props;
+  const novu = useNovu();
+  const options = useMemo(() => {
+    return {
+      container,
+      appearance,
+      options: novu.options
+    };
+  }, [container, appearance, novu.options]);
+  return /* @__PURE__ */ jsx(NovuUI, { options, novu, children: /* @__PURE__ */ jsx(DefaultConnectChat, { ...defaultProps }) });
+});
+ConnectChatInternal.displayName = "ConnectChatInternal";
+var ConnectChat = React.memo((props) => {
+  return /* @__PURE__ */ jsx(ConnectChatInternal, { ...props });
+});
+ConnectChat.displayName = "ConnectChat";
+export {
+  ConnectChat
+};
+//# sourceMappingURL=ConnectChat.js.map

package/dist/esm/components/connect-chat/ConnectChat.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/connect-chat/ConnectChat.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { useNovu } from '../../hooks/NovuProvider';\nimport { NovuUI, NovuUIOptions } from '../NovuUI';\nimport { withRenderer } from '../Renderer';\nimport { DefaultConnectChat, DefaultConnectChatProps } from './DefaultConnectChat';\n\nexport type ConnectChatProps = DefaultConnectChatProps & Pick<NovuUIOptions, 'container' | 'appearance'>;\n\nconst ConnectChatInternal = withRenderer<ConnectChatProps>((props) => {\n  const { container, appearance, ...defaultProps } = props;\n  const novu = useNovu();\n\n  const options: NovuUIOptions = useMemo(() => {\n    return {\n      container,\n      appearance,\n      options: novu.options,\n    };\n  }, [container, appearance, novu.options]);\n\n  return (\n    <NovuUI options={options} novu={novu}>\n      <DefaultConnectChat {...defaultProps} />\n    </NovuUI>\n  );\n});\n\nConnectChatInternal.displayName = 'ConnectChatInternal';\n\nexport const ConnectChat = React.memo((props: ConnectChatProps) => {\n  return <ConnectChatInternal {...props} />;\n});\n\nConnectChat.displayName = 'ConnectChat';\n"],"mappings":";AAAA,OAAO,SAAS,eAAe;AAC/B,SAAS,eAAe;AACxB,SAAS,cAA6B;AACtC,SAAS,oBAAoB;AAC7B,SAAS,0BAAmD;AAkBtD;AAdN,IAAM,sBAAsB,aAA+B,CAAC,UAAU;AACpE,QAAM,EAAE,WAAW,YAAY,GAAG,aAAa,IAAI;AACnD,QAAM,OAAO,QAAQ;AAErB,QAAM,UAAyB,QAAQ,MAAM;AAC3C,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA,SAAS,KAAK;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,WAAW,YAAY,KAAK,OAAO,CAAC;AAExC,SACE,oBAAC,UAAO,SAAkB,MACxB,8BAAC,sBAAoB,GAAG,cAAc,GACxC;AAEJ,CAAC;AAED,oBAAoB,cAAc;AAE3B,IAAM,cAAc,MAAM,KAAK,CAAC,UAA4B;AACjE,SAAO,oBAAC,uBAAqB,GAAG,OAAO;AACzC,CAAC;AAED,YAAY,cAAc;","names":[]}

package/dist/esm/components/connect-chat/DefaultConnectChat.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ConnectChatProps } from '@novu/js/ui';
+
+type DefaultConnectChatProps = Pick<ConnectChatProps, 'integrationIdentifier' | 'connectionIdentifier' | 'subscriberId' | 'context' | 'scope' | 'connectionMode' | 'onConnectSuccess' | 'onConnectError' | 'onDisconnectSuccess' | 'onDisconnectError'>;
+declare const DefaultConnectChat: (props: DefaultConnectChatProps) => react_jsx_runtime.JSX.Element;
+
+export { DefaultConnectChat, type DefaultConnectChatProps };

package/dist/esm/components/connect-chat/DefaultConnectChat.js

@@ -0,0 +1,58 @@
+// src/components/connect-chat/DefaultConnectChat.tsx
+import { useCallback } from "react";
+import { useNovuUI } from "../../context/NovuUIContext.js";
+import { Mounter } from "../Mounter.js";
+import { jsx } from "react/jsx-runtime";
+var DefaultConnectChat = (props) => {
+  const {
+    integrationIdentifier,
+    connectionIdentifier,
+    subscriberId,
+    context,
+    scope,
+    connectionMode,
+    onConnectSuccess,
+    onConnectError,
+    onDisconnectSuccess,
+    onDisconnectError
+  } = props;
+  const { novuUI } = useNovuUI();
+  const mount = useCallback(
+    (element) => {
+      return novuUI.mountComponent({
+        name: "ConnectChat",
+        props: {
+          integrationIdentifier,
+          connectionIdentifier,
+          subscriberId,
+          context,
+          scope,
+          connectionMode,
+          onConnectSuccess,
+          onConnectError,
+          onDisconnectSuccess,
+          onDisconnectError
+        },
+        element
+      });
+    },
+    [
+      novuUI,
+      integrationIdentifier,
+      connectionIdentifier,
+      subscriberId,
+      context,
+      scope,
+      connectionMode,
+      onConnectSuccess,
+      onConnectError,
+      onDisconnectSuccess,
+      onDisconnectError
+    ]
+  );
+  return /* @__PURE__ */ jsx(Mounter, { mount });
+};
+export {
+  DefaultConnectChat
+};
+//# sourceMappingURL=DefaultConnectChat.js.map

package/dist/esm/components/connect-chat/DefaultConnectChat.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/connect-chat/DefaultConnectChat.tsx"],"sourcesContent":["import { ConnectChatProps } from '@novu/js/ui';\nimport { useCallback } from 'react';\nimport { useNovuUI } from '../../context/NovuUIContext';\nimport { Mounter } from '../Mounter';\n\nexport type DefaultConnectChatProps = Pick<\n  ConnectChatProps,\n  | 'integrationIdentifier'\n  | 'connectionIdentifier'\n  | 'subscriberId'\n  | 'context'\n  | 'scope'\n  | 'connectionMode'\n  | 'onConnectSuccess'\n  | 'onConnectError'\n  | 'onDisconnectSuccess'\n  | 'onDisconnectError'\n>;\n\nexport const DefaultConnectChat = (props: DefaultConnectChatProps) => {\n  const {\n    integrationIdentifier,\n    connectionIdentifier,\n    subscriberId,\n    context,\n    scope,\n    connectionMode,\n    onConnectSuccess,\n    onConnectError,\n    onDisconnectSuccess,\n    onDisconnectError,\n  } = props;\n  const { novuUI } = useNovuUI();\n\n  const mount = useCallback(\n    (element: HTMLElement) => {\n      return novuUI.mountComponent({\n        name: 'ConnectChat',\n        props: {\n          integrationIdentifier,\n          connectionIdentifier,\n          subscriberId,\n          context,\n          scope,\n          connectionMode,\n          onConnectSuccess,\n          onConnectError,\n          onDisconnectSuccess,\n          onDisconnectError,\n        },\n        element,\n      });\n    },\n    [\n      novuUI,\n      integrationIdentifier,\n      connectionIdentifier,\n      subscriberId,\n      context,\n      scope,\n      connectionMode,\n      onConnectSuccess,\n      onConnectError,\n      onDisconnectSuccess,\n      onDisconnectError,\n    ]\n  );\n\n  return <Mounter mount={mount} />;\n};\n"],"mappings":";AACA,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB;AAC1B,SAAS,eAAe;AAiEf;AAjDF,IAAM,qBAAqB,CAAC,UAAmC;AACpE,QAAM;AAAA,IACJ;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,IAAI,UAAU;AAE7B,QAAM,QAAQ;AAAA,IACZ,CAAC,YAAyB;AACxB,aAAO,OAAO,eAAe;AAAA,QAC3B,MAAM;AAAA,QACN,OAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA;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,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO,oBAAC,WAAQ,OAAc;AAChC;","names":[]}

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

@@ -1,9 +1,13 @@
-export { InternalNovuProvider, NovuProvider, NovuProviderProps, useNovu, useUnsafeNovu } from '../hooks/NovuProvider.js';
+export { InternalNovuProvider, NovuProvider, NovuProviderProps, useNovu, useRealtime, useUnsafeNovu } from '../hooks/NovuProvider.js';
 export { Bell, BellProps } from './Bell.js';
 export { Inbox, InboxProps } from './Inbox.js';
 export { InboxContent, InboxContentProps } from './InboxContent.js';
+export { MsTeamsConnectButton, MsTeamsConnectButtonProps } from './msteams-connect-button/MsTeamsConnectButton.js';
+export { MsTeamsLinkUser, MsTeamsLinkUserProps } from './msteams-link-user/MsTeamsLinkUser.js';
 export { NotificationProps, Notifications } from './Notifications.js';
 export { Preferences } from './Preferences.js';
+export { SlackConnectButton, SlackConnectButtonProps } from './slack-connect-button/SlackConnectButton.js';
+export { SlackLinkUser, SlackLinkUserProps } from './slack-link-user/SlackLinkUser.js';
 export { Subscription, SubscriptionProps } from './subscription/Subscription.js';
 export { SubscriptionButton, SubscriptionButtonProps } from './subscription/SubscriptionButton.js';
 export { SubscriptionPreferences, SubscriptionPreferencesProps } from './subscription/SubscriptionPreferences.js';
@@ -13,4 +17,8 @@ import 'react';
 import '../utils/types.js';
 import '@novu/js/ui';
 import './NovuUI.js';
+import './msteams-connect-button/DefaultMsTeamsConnectButton.js';
+import './msteams-link-user/DefaultMsTeamsLinkUser.js';
+import './slack-connect-button/DefaultSlackConnectButton.js';
+import './slack-link-user/DefaultSlackLinkUser.js';
 import './subscription/DefaultSubscription.js';

package/dist/esm/components/index.js

@@ -3,8 +3,12 @@ export * from "../hooks/NovuProvider.js";
 export * from "./Bell.js";
 export * from "./Inbox.js";
 export * from "./InboxContent.js";
+export * from "./msteams-connect-button/MsTeamsConnectButton.js";
+export * from "./msteams-link-user/MsTeamsLinkUser.js";
 export * from "./Notifications.js";
 export * from "./Preferences.js";
+export * from "./slack-connect-button/SlackConnectButton.js";
+export * from "./slack-link-user/SlackLinkUser.js";
 export * from "./subscription/Subscription.js";
 export * from "./subscription/SubscriptionButton.js";
 export * from "./subscription/SubscriptionPreferences.js";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/index.ts"],"sourcesContent":["export * from '../hooks/NovuProvider';\nexport * from './Bell';\nexport * from './Inbox';\nexport * from './InboxContent';\nexport * from './Notifications';\nexport * from './Preferences';\nexport * from './subscription/Subscription';\nexport * from './subscription/SubscriptionButton';\nexport * from './subscription/SubscriptionPreferences';\n"],"mappings":";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/index.ts"],"sourcesContent":["export * from '../hooks/NovuProvider';\nexport * from './Bell';\nexport * from './Inbox';\nexport * from './InboxContent';\nexport * from './msteams-connect-button/MsTeamsConnectButton';\nexport * from './msteams-link-user/MsTeamsLinkUser';\nexport * from './Notifications';\nexport * from './Preferences';\nexport * from './slack-connect-button/SlackConnectButton';\nexport * from './slack-link-user/SlackLinkUser';\nexport * from './subscription/Subscription';\nexport * from './subscription/SubscriptionButton';\nexport * from './subscription/SubscriptionPreferences';\n"],"mappings":";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}

package/dist/esm/components/msteams-connect-button/DefaultMsTeamsConnectButton.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MsTeamsConnectButtonProps } from '@novu/js/ui';
+
+type DefaultMsTeamsConnectButtonProps = Pick<MsTeamsConnectButtonProps, 'integrationIdentifier' | 'connectionIdentifier' | 'subscriberId' | 'context' | 'scope' | 'connectionMode' | 'autoLinkUser' | 'onConnectSuccess' | 'onConnectError' | 'onDisconnectSuccess' | 'onDisconnectError' | 'connectLabel' | 'connectedLabel'>;
+declare const DefaultMsTeamsConnectButton: (props: DefaultMsTeamsConnectButtonProps) => react_jsx_runtime.JSX.Element;
+
+export { DefaultMsTeamsConnectButton, type DefaultMsTeamsConnectButtonProps };