@realtimexsco/live-chat 1.4.2 → 1.4.4

package/dist/index.mjs

@@ -9,7 +9,7 @@ import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { flushSync } from 'react-dom';
-import { Sun, Moon, Search, X, Loader2, UserPlus, ChevronDown, ArrowLeft, Users, WifiOff, Wifi, Sparkles, MessageSquareText, ChevronRight, Pin, Star, Phone, Video, MoreVertical, Info, UserKey, ShieldUser, Paperclip, Clock, MessageSquareX, Trash2, LogOut, Ban, CheckCheck, Check, Camera, Save, Pencil, Mail, CornerUpLeft, CheckSquare, Smile, ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon, MessageCircleMore, History, Shield, Send, AlertCircle, ShieldCheck, UserMinus, MessageCircle, ExternalLink, Download, ChevronLeft, ZoomOut, ZoomIn, RotateCcw, Music, ArrowRight, MoreHorizontal, PinOff, StarOff, XIcon, ImageIcon, Film, Play, Pause, FileText, FileSpreadsheet, FileIcon, Eye, Captions } from 'lucide-react';
+import { Sun, Moon, Search, X, Loader2, UserPlus, ChevronDown, ArrowLeft, Users, WifiOff, Wifi, Sparkles, MessageSquareText, ChevronRight, Pin, Star, MoreVertical, Info, UserKey, ShieldUser, Paperclip, Clock, MessageSquareX, Trash2, LogOut, Ban, CheckCheck, Check, Camera, Save, Pencil, Mail, CornerUpLeft, CheckSquare, Smile, ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon, MessageCircleMore, History, Shield, Send, AlertCircle, ShieldCheck, UserMinus, MessageCircle, Phone, Video, ExternalLink, Download, ChevronLeft, ZoomOut, ZoomIn, RotateCcw, Music, ArrowRight, MoreHorizontal, PinOff, StarOff, XIcon, ImageIcon, Film, Play, Pause, FileText, FileSpreadsheet, FileIcon, Eye, Captions } from 'lucide-react';
 import { cva } from 'class-variance-authority';
 import EmojiPicker, { Theme } from 'emoji-picker-react';
 import { getDefaultClassNames, DayPicker } from 'react-day-picker';
@@ -7620,6 +7620,76 @@ var HeaderSearchPopover = ({
   ] });
 };
 var HeaderSearchPopover_default = HeaderSearchPopover;
+var actionBtnClass = "size-8 rounded-lg text-(--chat-muted) transition-colors hover:bg-(--chat-surface) hover:text-(--chat-text)";
+var DefaultHeaderCallActions = ({
+  activeChannel,
+  conversationId,
+  showPhoneCall = true,
+  showVideoCall = true,
+  onPhoneCall,
+  onVideoCall,
+  className
+}) => {
+  const { components, slotClassName, features } = useChatCustomizationOptional();
+  const PhoneSlot = components.PhoneCallButton;
+  const VideoSlot = components.VideoCallButton;
+  const hideInGroups = features.hideCallActionsInGroupChats ?? false;
+  if (hideInGroups && activeChannel.isGroup) return null;
+  if (!showPhoneCall && !showVideoCall) return null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    showPhoneCall && (PhoneSlot ? /* @__PURE__ */ jsx(
+      PhoneSlot,
+      {
+        activeChannel,
+        conversationId,
+        onPhoneCall,
+        className: cn(className, slotClassName("phoneCallButton"))
+      }
+    ) : /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "ghost",
+        size: "icon",
+        className: cn(actionBtnClass, className, slotClassName("phoneCallButton")),
+        "aria-label": "Voice call",
+        onClick: onPhoneCall,
+        children: /* @__PURE__ */ jsx(Phone, { size: 15 })
+      }
+    )),
+    showVideoCall && (VideoSlot ? /* @__PURE__ */ jsx(
+      VideoSlot,
+      {
+        activeChannel,
+        conversationId,
+        onVideoCall,
+        className: cn(className, slotClassName("videoCallButton"))
+      }
+    ) : /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "ghost",
+        size: "icon",
+        className: cn(actionBtnClass, className, slotClassName("videoCallButton")),
+        "aria-label": "Video call",
+        onClick: onVideoCall,
+        children: /* @__PURE__ */ jsx(Video, { size: 15 })
+      }
+    ))
+  ] });
+};
+var HeaderCallActions = (props) => {
+  const { components, slotClassName, features } = useChatCustomizationOptional();
+  const Custom = components.HeaderCallActions;
+  if (!Custom) {
+    const hideInGroups = features.hideCallActionsInGroupChats ?? false;
+    const showPhoneCall = props.showPhoneCall ?? true;
+    const showVideoCall = props.showVideoCall ?? true;
+    if (hideInGroups && props.activeChannel.isGroup) return null;
+    if (!showPhoneCall && !showVideoCall) return null;
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("flex items-center gap-0.5", slotClassName("headerCallActions")), children: Custom ? /* @__PURE__ */ jsx(Custom, { ...props }) : /* @__PURE__ */ jsx(DefaultHeaderCallActions, { ...props }) });
+};
+var HeaderCallActions_default = HeaderCallActions;
 function OptionsMenuItem({
   icon: Icon,
   label,
@@ -7640,6 +7710,7 @@ function OptionsMenuItem({
 }
 var HeaderRightSide = ({
   activeChannel,
+  conversationId,
   isAdmin,
   canViewMembers,
   pinnedCount,
@@ -7669,6 +7740,15 @@ var HeaderRightSide = ({
 }) => {
   const { scopeClassName, themeStyles, showColorModeToggle } = useChatTheme();
   const { showDateTimeSettings } = useChatLocale();
+  const features = useChatFeaturesOptional();
+  const showPhoneCall = features.showPhoneCall ?? defaultChatFeatures.showPhoneCall;
+  const showVideoCall = features.showVideoCall ?? defaultChatFeatures.showVideoCall;
+  const handlePhoneCall = () => {
+    features.onPhoneCall?.({ activeChannel, conversationId });
+  };
+  const handleVideoCall = () => {
+    features.onVideoCall?.({ activeChannel, conversationId });
+  };
   const headerItemGapClass = "gap-0.5";
   const headerIconBtnClass = "inline-flex size-6 shrink-0 items-center justify-center rounded-lg p-0 text-(--chat-muted) transition-colors hover:bg-(--chat-hover) hover:text-(--chat-text) has-[>svg]:p-0";
   const headerCountBtnClass = "inline-flex h-7 shrink-0 items-center justify-center gap-0.5 rounded-lg px-1.5 text-(--chat-muted) transition-colors hover:bg-(--chat-hover) hover:text-(--chat-text)";
@@ -7726,26 +7806,18 @@ var HeaderRightSide = ({
         triggerClassName: headerIconBtnClass
       }
     ),
-    /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "ghost",
-        size: "icon-xs",
-        className: cn(headerIconBtnClass, "hidden sm:inline-flex"),
-        "aria-label": "Voice call",
-        children: /* @__PURE__ */ jsx(Phone, { size: 15 })
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      Button,
+    /* @__PURE__ */ jsx("div", { className: "hidden sm:contents", children: /* @__PURE__ */ jsx(
+      HeaderCallActions_default,
       {
-        variant: "ghost",
-        size: "icon-xs",
-        className: cn(headerIconBtnClass, "hidden sm:inline-flex"),
-        "aria-label": "Video call",
-        children: /* @__PURE__ */ jsx(Video, { size: 15 })
+        activeChannel,
+        conversationId,
+        showPhoneCall,
+        showVideoCall,
+        onPhoneCall: handlePhoneCall,
+        onVideoCall: handleVideoCall,
+        className: headerIconBtnClass
       }
-    ),
+    ) }),
     /* @__PURE__ */ jsx("span", { className: headerDividerClass, "aria-hidden": true }),
     /* @__PURE__ */ jsxs(DropdownMenu, { children: [
       /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon-xs", className: headerIconBtnClass, "aria-label": "More options", children: /* @__PURE__ */ jsx(MoreVertical, { size: 15 }) }) }),
@@ -12883,6 +12955,7 @@ var ChannelHeaderView = (props) => {
       HeaderRightSideSlot,
       {
         activeChannel,
+        conversationId,
         isAdmin,
         canViewMembers,
         pinnedCount,
@@ -17282,156 +17355,6 @@ function ChatViewport({
   );
 }
 var ChatViewport_default = ChatViewport;
-var ChatMain = ({
-  clientId,
-  loggedUserDetails,
-  accessToken,
-  apiUrl,
-  socketUrl,
-  queryParams,
-  queryParamApis,
-  queryParamsByApi,
-  themeColor = "#7494ec",
-  theme,
-  uiConfig,
-  components,
-  classNames,
-  features,
-  layout,
-  colorMode,
-  defaultColorMode = "light",
-  onColorModeChange,
-  showColorModeToggle = true,
-  locale,
-  timeZone,
-  hour12,
-  defaultLocale,
-  defaultTimeZone,
-  defaultHour12,
-  onDateTimePreferencesChange,
-  showDateTimeSettings = true,
-  error,
-  info,
-  onErrorDismiss,
-  onInfoDismiss,
-  viewportHeight = "full",
-  viewportClassName
-}) => {
-  const clientObj = React2__default.useMemo(() => ({ id: clientId }), [clientId]);
-  const uiConfigObj = React2__default.useMemo(
-    () => ({
-      ...uiConfig || {},
-      components: { ...uiConfig?.components, ...components },
-      classNames: { ...uiConfig?.classNames, ...classNames },
-      features: { ...uiConfig?.features, ...features }
-    }),
-    [uiConfig, components, classNames, features]
-  );
-  return /* @__PURE__ */ jsx(ChatViewport_default, { height: viewportHeight, className: viewportClassName, children: /* @__PURE__ */ jsx(
-    ChatThemeProvider,
-    {
-      themeColor,
-      colorMode,
-      defaultColorMode,
-      onColorModeChange,
-      showColorModeToggle,
-      children: /* @__PURE__ */ jsx(
-        ChatLocaleProvider,
-        {
-          locale,
-          timeZone,
-          hour12,
-          defaultLocale,
-          defaultTimeZone,
-          defaultHour12,
-          onDateTimePreferencesChange,
-          showDateTimeSettings,
-          children: /* @__PURE__ */ jsx(
-            Chat,
-            {
-              client: clientObj,
-              accessToken,
-              loggedUserDetails,
-              themeColor,
-              theme,
-              uiConfig: uiConfigObj,
-              apiUrl,
-              socketUrl,
-              queryParams,
-              queryParamApis,
-              queryParamsByApi,
-              children: /* @__PURE__ */ jsx(
-                ChatAlertsProvider,
-                {
-                  value: {
-                    error,
-                    info,
-                    onDismissError: onErrorDismiss,
-                    onDismissInfo: onInfoDismiss
-                  },
-                  children: /* @__PURE__ */ jsx(
-                    ChatLayout_default,
-                    {
-                      layout,
-                      loggedUserDetails,
-                      themeColor
-                    }
-                  )
-                }
-              )
-            }
-          )
-        }
-      )
-    }
-  ) });
-};
-var ChatMain_default = ChatMain;
-
-// src/index.ts
-init_useStore();
-init_socket_service2();
-var Channel = ({ children }) => {
-  return /* @__PURE__ */ jsx("div", { className: "relative flex h-full min-w-0 w-full flex-1 flex-col overflow-hidden bg-(--chat-main-bg)", children });
-};
-
-// src/index.ts
-init_api_service();
-
-// src/config/socket.config.ts
-init_client();
-var getSocketConfig = (accessToken, tenantId, options) => {
-  const baseURL = resolveSocketUrl(
-    options?.socketUrl ?? getChatSocketUrl(),
-    options?.apiUrl ?? getChatBaseUrl()
-  );
-  return {
-    url: baseURL,
-    options: {
-      path: "/connection",
-      auth: {
-        accessToken
-      },
-      query: {
-        platform: "web",
-        tenantId: tenantId || "",
-        isTenant: "true"
-      },
-      extraHeaders: {
-        Authorization: `Bearer ${accessToken}`,
-        platform: "web",
-        tenantId: tenantId || "",
-        isTenant: "true"
-      },
-      transports: ["websocket", "polling"],
-      reconnection: true,
-      reconnectionAttempts: Infinity,
-      reconnectionDelay: 2e3,
-      reconnectionDelayMax: 5e3,
-      timeout: 2e4
-    }
-  };
-};
 var showNotification = (message, type = "info", icon, duration) => {
   const options = {
     icon,
@@ -17506,21 +17429,373 @@ var getFirstAndLastNameOneCharacter = (name) => {
   const names = name.split(" ");
   return names.map((name2) => name2.charAt(0).toUpperCase()).join("");
 };
-var SIZE_MAP = {
-  xs: "size-6",
-  sm: "size-8",
-  md: "size-9",
-  lg: "size-10",
-  xl: "size-12"
+
+// src/notifications/ForegroundPushBridge.tsx
+init_useStore();
+
+// src/notifications/push.service.ts
+init_client();
+var PUSH_TOKEN_STORAGE_KEY = "realtimex-push-token";
+var SERVICE_WORKER_PATH = "/firebase-messaging-sw.js";
+var PUSH_CHANGED_EVENT = "realtimex:push-changed";
+var emitPushChanged = (enabled) => {
+  try {
+    window.dispatchEvent(
+      new CustomEvent(PUSH_CHANGED_EVENT, { detail: { enabled } })
+    );
+  } catch {
+  }
 };
-var DefaultChatAvatar = ({
-  src,
-  alt,
-  name,
-  fallback,
-  size = "md",
-  showOnline = false,
-  isOnline = false,
+var v2Url = "https://realtimex.softwareco.com/api/v2";
+var apiGetPushConfig = async () => {
+  const { data } = await apiClient.get(`${v2Url}/notifications/push/config`);
+  return data?.data;
+};
+var apiRegisterPushToken = async (token, deviceLabel) => {
+  const { data } = await apiClient.post(`${v2Url}/notifications/push/token`, {
+    token,
+    deviceLabel
+  });
+  return data?.data;
+};
+var apiRemovePushToken = async (token) => {
+  const { data } = await apiClient.delete(`${v2Url}/notifications/push/token`, {
+    data: { token }
+  });
+  return data;
+};
+var apiGetPushPreference = async () => {
+  const { data } = await apiClient.get(
+    `${v2Url}/notifications/push/preference`
+  );
+  return data?.data;
+};
+var apiUpdatePushPreference = async (enabled) => {
+  const { data } = await apiClient.patch(
+    `${v2Url}/notifications/push/preference`,
+    { enabled }
+  );
+  return data?.data;
+};
+var isPushSupported = () => typeof window !== "undefined" && "Notification" in window && "serviceWorker" in navigator && "PushManager" in window;
+var getStoredPushToken = () => {
+  try {
+    return localStorage.getItem(PUSH_TOKEN_STORAGE_KEY);
+  } catch {
+    return null;
+  }
+};
+var storePushToken = (token) => {
+  try {
+    if (token) localStorage.setItem(PUSH_TOKEN_STORAGE_KEY, token);
+    else localStorage.removeItem(PUSH_TOKEN_STORAGE_KEY);
+  } catch {
+  }
+};
+var defaultDeviceLabel = () => {
+  const ua = navigator.userAgent;
+  const browser = /edg\//i.test(ua) ? "Edge" : /chrome/i.test(ua) ? "Chrome" : /safari/i.test(ua) ? "Safari" : /firefox/i.test(ua) ? "Firefox" : "Browser";
+  const os = /mac/i.test(ua) ? "macOS" : /windows/i.test(ua) ? "Windows" : /android/i.test(ua) ? "Android" : /iphone|ipad/i.test(ua) ? "iOS" : /linux/i.test(ua) ? "Linux" : "Unknown OS";
+  return `${browser} on ${os}`;
+};
+var loadFirebaseMessaging = async () => {
+  try {
+    const [{ initializeApp, getApps }, messagingModule] = await Promise.all([
+      import('firebase/app'),
+      import('firebase/messaging')
+    ]);
+    return { initializeApp, getApps, ...messagingModule };
+  } catch {
+    throw new Error(
+      'Push notifications need the "firebase" package \u2014 run: npm install firebase'
+    );
+  }
+};
+var getFirebaseMessaging = async (firebaseConfig) => {
+  const fb = await loadFirebaseMessaging();
+  const app = fb.getApps().length ? fb.getApps()[0] : fb.initializeApp(firebaseConfig);
+  return { fb, messaging: fb.getMessaging(app) };
+};
+var enablePushOnThisDevice = async () => {
+  if (!isPushSupported()) {
+    throw new Error("Push notifications are not supported in this browser");
+  }
+  const config = await apiGetPushConfig();
+  if (!config?.enabled) {
+    throw new Error("Push notifications are disabled for this workspace");
+  }
+  if (!config.configured || !config.firebaseConfig || !config.vapidKey) {
+    throw new Error(
+      "Push notifications are not configured on the server yet"
+    );
+  }
+  const permission = await Notification.requestPermission();
+  if (permission !== "granted") {
+    throw new Error("Notification permission was not granted");
+  }
+  let registration;
+  try {
+    registration = await navigator.serviceWorker.register(
+      `${SERVICE_WORKER_PATH}?config=${encodeURIComponent(
+        JSON.stringify(config.firebaseConfig)
+      )}`
+    );
+  } catch {
+    throw new Error(
+      `Could not register ${SERVICE_WORKER_PATH} \u2014 copy it from node_modules/@realtimexsco/live-chat/dist/firebase-messaging-sw.js into your app's public folder`
+    );
+  }
+  const { fb, messaging } = await getFirebaseMessaging(config.firebaseConfig);
+  const token = await fb.getToken(messaging, {
+    vapidKey: config.vapidKey,
+    serviceWorkerRegistration: registration
+  });
+  if (!token) {
+    throw new Error("Could not obtain a push token from Firebase");
+  }
+  await apiRegisterPushToken(token, defaultDeviceLabel());
+  storePushToken(token);
+  emitPushChanged(true);
+  return token;
+};
+var disablePushOnThisDevice = async () => {
+  const token = getStoredPushToken();
+  if (!token) return;
+  try {
+    const config = await apiGetPushConfig();
+    if (config?.firebaseConfig) {
+      const { fb, messaging } = await getFirebaseMessaging(
+        config.firebaseConfig
+      );
+      await fb.deleteToken(messaging).catch(() => void 0);
+    }
+  } catch {
+  }
+  await apiRemovePushToken(token).catch(() => void 0);
+  storePushToken(null);
+  emitPushChanged(false);
+};
+var onForegroundPush = async (callback) => {
+  const config = await apiGetPushConfig();
+  if (!config?.configured || !config.firebaseConfig) return () => void 0;
+  const { fb, messaging } = await getFirebaseMessaging(config.firebaseConfig);
+  return fb.onMessage(messaging, (payload) => {
+    callback({
+      title: payload?.notification?.title,
+      body: payload?.notification?.body,
+      data: payload?.data
+    });
+  });
+};
+
+// src/notifications/ForegroundPushBridge.tsx
+var ForegroundPushBridge = ({ onPush }) => {
+  useEffect(() => {
+    let unsubscribe = null;
+    let cancelled = false;
+    const handlePayload = (payload) => {
+      const incoming = payload.data?.conversationId;
+      const activeId = useStore.getState().activeConversationId;
+      if (incoming && activeId && incoming === activeId) return;
+      if (onPush && onPush(payload) !== false) return;
+      const text = payload.title ? payload.body ? `${payload.title}: ${payload.body}` : payload.title : payload.body;
+      if (text) showNotification(text, "info");
+    };
+    const start = async () => {
+      if (cancelled || unsubscribe || !getStoredPushToken()) return;
+      try {
+        const stop = await onForegroundPush(handlePayload);
+        if (cancelled) stop();
+        else unsubscribe = stop;
+      } catch {
+      }
+    };
+    void start();
+    const onPushChanged = (event) => {
+      const enabled = event.detail?.enabled;
+      if (enabled) void start();
+      else {
+        unsubscribe?.();
+        unsubscribe = null;
+      }
+    };
+    window.addEventListener(PUSH_CHANGED_EVENT, onPushChanged);
+    return () => {
+      cancelled = true;
+      unsubscribe?.();
+      window.removeEventListener(PUSH_CHANGED_EVENT, onPushChanged);
+    };
+  }, [onPush]);
+  return null;
+};
+var ChatMain = ({
+  clientId,
+  loggedUserDetails,
+  accessToken,
+  apiUrl,
+  socketUrl,
+  queryParams,
+  queryParamApis,
+  queryParamsByApi,
+  themeColor = "#7494ec",
+  theme,
+  uiConfig,
+  components,
+  classNames,
+  features,
+  layout,
+  colorMode,
+  defaultColorMode = "light",
+  onColorModeChange,
+  showColorModeToggle = true,
+  locale,
+  timeZone,
+  hour12,
+  defaultLocale,
+  defaultTimeZone,
+  defaultHour12,
+  onDateTimePreferencesChange,
+  showDateTimeSettings = true,
+  error,
+  info,
+  onErrorDismiss,
+  onInfoDismiss,
+  viewportHeight = "full",
+  viewportClassName
+}) => {
+  const clientObj = React2__default.useMemo(() => ({ id: clientId }), [clientId]);
+  const uiConfigObj = React2__default.useMemo(
+    () => ({
+      ...uiConfig || {},
+      components: { ...uiConfig?.components, ...components },
+      classNames: { ...uiConfig?.classNames, ...classNames },
+      features: { ...uiConfig?.features, ...features }
+    }),
+    [uiConfig, components, classNames, features]
+  );
+  return /* @__PURE__ */ jsx(ChatViewport_default, { height: viewportHeight, className: viewportClassName, children: /* @__PURE__ */ jsx(
+    ChatThemeProvider,
+    {
+      themeColor,
+      colorMode,
+      defaultColorMode,
+      onColorModeChange,
+      showColorModeToggle,
+      children: /* @__PURE__ */ jsx(
+        ChatLocaleProvider,
+        {
+          locale,
+          timeZone,
+          hour12,
+          defaultLocale,
+          defaultTimeZone,
+          defaultHour12,
+          onDateTimePreferencesChange,
+          showDateTimeSettings,
+          children: /* @__PURE__ */ jsxs(
+            Chat,
+            {
+              client: clientObj,
+              accessToken,
+              loggedUserDetails,
+              themeColor,
+              theme,
+              uiConfig: uiConfigObj,
+              apiUrl,
+              socketUrl,
+              queryParams,
+              queryParamApis,
+              queryParamsByApi,
+              children: [
+                /* @__PURE__ */ jsx(ForegroundPushBridge, {}),
+                /* @__PURE__ */ jsx(
+                  ChatAlertsProvider,
+                  {
+                    value: {
+                      error,
+                      info,
+                      onDismissError: onErrorDismiss,
+                      onDismissInfo: onInfoDismiss
+                    },
+                    children: /* @__PURE__ */ jsx(
+                      ChatLayout_default,
+                      {
+                        layout,
+                        loggedUserDetails,
+                        themeColor
+                      }
+                    )
+                  }
+                )
+              ]
+            }
+          )
+        }
+      )
+    }
+  ) });
+};
+var ChatMain_default = ChatMain;
+
+// src/index.ts
+init_useStore();
+init_socket_service2();
+var Channel = ({ children }) => {
+  return /* @__PURE__ */ jsx("div", { className: "relative flex h-full min-w-0 w-full flex-1 flex-col overflow-hidden bg-(--chat-main-bg)", children });
+};
+
+// src/index.ts
+init_api_service();
+
+// src/config/socket.config.ts
+init_client();
+var getSocketConfig = (accessToken, tenantId, options) => {
+  const baseURL = resolveSocketUrl(
+    options?.socketUrl ?? getChatSocketUrl(),
+    options?.apiUrl ?? getChatBaseUrl()
+  );
+  return {
+    url: baseURL,
+    options: {
+      path: "/connection",
+      auth: {
+        accessToken
+      },
+      query: {
+        platform: "web",
+        tenantId: tenantId || "",
+        isTenant: "true"
+      },
+      extraHeaders: {
+        Authorization: `Bearer ${accessToken}`,
+        platform: "web",
+        tenantId: tenantId || "",
+        isTenant: "true"
+      },
+      transports: ["websocket", "polling"],
+      reconnection: true,
+      reconnectionAttempts: Infinity,
+      reconnectionDelay: 2e3,
+      reconnectionDelayMax: 5e3,
+      timeout: 2e4
+    }
+  };
+};
+var SIZE_MAP = {
+  xs: "size-6",
+  sm: "size-8",
+  md: "size-9",
+  lg: "size-10",
+  xl: "size-12"
+};
+var DefaultChatAvatar = ({
+  src,
+  alt,
+  name,
+  fallback,
+  size = "md",
+  showOnline = false,
+  isOnline = false,
   className,
   fallbackClassName
 }) => {
@@ -17644,76 +17919,6 @@ var ChannelListItem2 = (props) => {
   return /* @__PURE__ */ jsx(ItemSlot, { ...props });
 };
 var ChannelListItem_default = ChannelListItem2;
-var actionBtnClass = "size-8 rounded-lg text-(--chat-muted) transition-colors hover:bg-(--chat-surface) hover:text-(--chat-text)";
-var DefaultHeaderCallActions = ({
-  activeChannel,
-  conversationId,
-  showPhoneCall = true,
-  showVideoCall = true,
-  onPhoneCall,
-  onVideoCall,
-  className
-}) => {
-  const { components, slotClassName, features } = useChatCustomizationOptional();
-  const PhoneSlot = components.PhoneCallButton;
-  const VideoSlot = components.VideoCallButton;
-  const hideInGroups = features.hideCallActionsInGroupChats ?? false;
-  if (hideInGroups && activeChannel.isGroup) return null;
-  if (!showPhoneCall && !showVideoCall) return null;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    showPhoneCall && (PhoneSlot ? /* @__PURE__ */ jsx(
-      PhoneSlot,
-      {
-        activeChannel,
-        conversationId,
-        onPhoneCall,
-        className: cn(className, slotClassName("phoneCallButton"))
-      }
-    ) : /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "ghost",
-        size: "icon",
-        className: cn(actionBtnClass, className, slotClassName("phoneCallButton")),
-        "aria-label": "Voice call",
-        onClick: onPhoneCall,
-        children: /* @__PURE__ */ jsx(Phone, { size: 15 })
-      }
-    )),
-    showVideoCall && (VideoSlot ? /* @__PURE__ */ jsx(
-      VideoSlot,
-      {
-        activeChannel,
-        conversationId,
-        onVideoCall,
-        className: cn(className, slotClassName("videoCallButton"))
-      }
-    ) : /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "ghost",
-        size: "icon",
-        className: cn(actionBtnClass, className, slotClassName("videoCallButton")),
-        "aria-label": "Video call",
-        onClick: onVideoCall,
-        children: /* @__PURE__ */ jsx(Video, { size: 15 })
-      }
-    ))
-  ] });
-};
-var HeaderCallActions = (props) => {
-  const { components, slotClassName, features } = useChatCustomizationOptional();
-  const Custom = components.HeaderCallActions;
-  if (!Custom) {
-    const hideInGroups = features.hideCallActionsInGroupChats ?? false;
-    const showPhoneCall = props.showPhoneCall ?? true;
-    const showVideoCall = props.showVideoCall ?? true;
-    if (hideInGroups && props.activeChannel.isGroup) return null;
-    if (!showPhoneCall && !showVideoCall) return null;
-  }
-  return /* @__PURE__ */ jsx("div", { className: slotClassName("headerCallActions"), children: Custom ? /* @__PURE__ */ jsx(Custom, { ...props }) : /* @__PURE__ */ jsx(DefaultHeaderCallActions, { ...props }) });
-};
-var HeaderCallActions_default = HeaderCallActions;
 
 // src/chat/packageDefaultComponents.ts
 var packageDefaultComponents = {
@@ -17749,150 +17954,6 @@ var packageDefaultComponents = {
   ChatDateTimeSettings: ChatDateTimeSettings_default,
   ChatSocketStatus: ChatSocketStatus_default
 };
-
-// src/notifications/push.service.ts
-init_client();
-var PUSH_TOKEN_STORAGE_KEY = "realtimex-push-token";
-var SERVICE_WORKER_PATH = "/firebase-messaging-sw.js";
-var v2Url = "https://realtimex.softwareco.com/api/v2";
-var apiGetPushConfig = async () => {
-  const { data } = await apiClient.get(`${v2Url}/notifications/push/config`);
-  return data?.data;
-};
-var apiRegisterPushToken = async (token, deviceLabel) => {
-  const { data } = await apiClient.post(`${v2Url}/notifications/push/token`, {
-    token,
-    deviceLabel
-  });
-  return data?.data;
-};
-var apiRemovePushToken = async (token) => {
-  const { data } = await apiClient.delete(`${v2Url}/notifications/push/token`, {
-    data: { token }
-  });
-  return data;
-};
-var apiGetPushPreference = async () => {
-  const { data } = await apiClient.get(
-    `${v2Url}/notifications/push/preference`
-  );
-  return data?.data;
-};
-var apiUpdatePushPreference = async (enabled) => {
-  const { data } = await apiClient.patch(
-    `${v2Url}/notifications/push/preference`,
-    { enabled }
-  );
-  return data?.data;
-};
-var isPushSupported = () => typeof window !== "undefined" && "Notification" in window && "serviceWorker" in navigator && "PushManager" in window;
-var getStoredPushToken = () => {
-  try {
-    return localStorage.getItem(PUSH_TOKEN_STORAGE_KEY);
-  } catch {
-    return null;
-  }
-};
-var storePushToken = (token) => {
-  try {
-    if (token) localStorage.setItem(PUSH_TOKEN_STORAGE_KEY, token);
-    else localStorage.removeItem(PUSH_TOKEN_STORAGE_KEY);
-  } catch {
-  }
-};
-var defaultDeviceLabel = () => {
-  const ua = navigator.userAgent;
-  const browser = /edg\//i.test(ua) ? "Edge" : /chrome/i.test(ua) ? "Chrome" : /safari/i.test(ua) ? "Safari" : /firefox/i.test(ua) ? "Firefox" : "Browser";
-  const os = /mac/i.test(ua) ? "macOS" : /windows/i.test(ua) ? "Windows" : /android/i.test(ua) ? "Android" : /iphone|ipad/i.test(ua) ? "iOS" : /linux/i.test(ua) ? "Linux" : "Unknown OS";
-  return `${browser} on ${os}`;
-};
-var loadFirebaseMessaging = async () => {
-  try {
-    const [{ initializeApp, getApps }, messagingModule] = await Promise.all([
-      import('firebase/app'),
-      import('firebase/messaging')
-    ]);
-    return { initializeApp, getApps, ...messagingModule };
-  } catch {
-    throw new Error(
-      'Push notifications need the "firebase" package \u2014 run: npm install firebase'
-    );
-  }
-};
-var getFirebaseMessaging = async (firebaseConfig) => {
-  const fb = await loadFirebaseMessaging();
-  const app = fb.getApps().length ? fb.getApps()[0] : fb.initializeApp(firebaseConfig);
-  return { fb, messaging: fb.getMessaging(app) };
-};
-var enablePushOnThisDevice = async () => {
-  if (!isPushSupported()) {
-    throw new Error("Push notifications are not supported in this browser");
-  }
-  const config = await apiGetPushConfig();
-  if (!config?.enabled) {
-    throw new Error("Push notifications are disabled for this workspace");
-  }
-  if (!config.configured || !config.firebaseConfig || !config.vapidKey) {
-    throw new Error(
-      "Push notifications are not configured on the server yet"
-    );
-  }
-  const permission = await Notification.requestPermission();
-  if (permission !== "granted") {
-    throw new Error("Notification permission was not granted");
-  }
-  let registration;
-  try {
-    registration = await navigator.serviceWorker.register(
-      `${SERVICE_WORKER_PATH}?config=${encodeURIComponent(
-        JSON.stringify(config.firebaseConfig)
-      )}`
-    );
-  } catch {
-    throw new Error(
-      `Could not register ${SERVICE_WORKER_PATH} \u2014 copy it from node_modules/@realtimexsco/live-chat/dist/firebase-messaging-sw.js into your app's public folder`
-    );
-  }
-  const { fb, messaging } = await getFirebaseMessaging(config.firebaseConfig);
-  const token = await fb.getToken(messaging, {
-    vapidKey: config.vapidKey,
-    serviceWorkerRegistration: registration
-  });
-  if (!token) {
-    throw new Error("Could not obtain a push token from Firebase");
-  }
-  await apiRegisterPushToken(token, defaultDeviceLabel());
-  storePushToken(token);
-  return token;
-};
-var disablePushOnThisDevice = async () => {
-  const token = getStoredPushToken();
-  if (!token) return;
-  try {
-    const config = await apiGetPushConfig();
-    if (config?.firebaseConfig) {
-      const { fb, messaging } = await getFirebaseMessaging(
-        config.firebaseConfig
-      );
-      await fb.deleteToken(messaging).catch(() => void 0);
-    }
-  } catch {
-  }
-  await apiRemovePushToken(token).catch(() => void 0);
-  storePushToken(null);
-};
-var onForegroundPush = async (callback) => {
-  const config = await apiGetPushConfig();
-  if (!config?.configured || !config.firebaseConfig) return () => void 0;
-  const { fb, messaging } = await getFirebaseMessaging(config.firebaseConfig);
-  return fb.onMessage(messaging, (payload) => {
-    callback({
-      title: payload?.notification?.title,
-      body: payload?.notification?.body,
-      data: payload?.data
-    });
-  });
-};
 var usePushNotifications = () => {
   const [state, setState] = useState({
     supported: false,
@@ -18026,6 +18087,6 @@ var PushNotificationToggle = ({
 // src/index.ts
 var index_default = ChatMain_default;
 
-export { CHAT_API_KEYS, CHAT_GET_API_KEYS, Calendar, CalendarDayButton, Channel, ChannelHeaderView_default as ChannelHeader, ChannelListView_default as ChannelList, ChannelListItem_default as ChannelListItem, Chat, ChatAlertsProvider, ChatAvatar_default as ChatAvatar, ChatCustomizationProvider, ChatDateJumpMenu, ChatLayout_default as ChatLayout, ChatLocaleProvider, ChatMain_default as ChatMain, ChatThemeProvider, ChatViewport, DefaultChannelListItem, DefaultChatAvatar, DefaultChatLayout_default as DefaultChatLayout, ForwardModalView as ForwardModal, HeaderCallActions_default as HeaderCallActions, LoggedUserDetails_default as LoggedUserDetails, ChannelMessageBoxView_default as MessageInput, MessageItemView as MessageItem, ActiveChannelMessagesView_default as MessageList, PushNotificationToggle, apiGetPushConfig, apiGetPushPreference, apiRegisterPushToken, apiRemovePushToken, apiUpdatePushPreference, capitalizeFirst, clampJumpDate, index_default as default, defaultChatClassNames, defaultChatComponents, defaultChatFeatures, defaultChatLayoutConfig, disablePushOnThisDevice, downloadFile, enablePushOnThisDevice, getChatBaseUrl, getChatQueryParamApis, getChatQueryParams, getChatQueryParamsByApi, getChatSocketUrl, getFirstAndLastNameOneCharacter, getResponsiveWidth, getSocketConfig, getStoredPushToken, isEmpty, isPushSupported, mergeChatCustomization, mergeChatLayoutConfig, onForegroundPush, packageDefaultComponents, resolveApiUrl, resolveChatApiKey, resolveJumpDateBounds, resolveJumpPreset, resolveJumpStep, resolveSocketUrl, setChatAccessToken, setChatBaseURL, setChatClientId, setChatQueryParamApis, setChatQueryParams, setChatQueryParamsByApi, setChatSocketUrl, showNotification, smoothScrollToMessage, socket_service_default as socketService, startOfLocalDay, toDateInputValue, uniqueList, useChatAlerts, useChatContext, useChatController, useChatCustomization, useChatCustomizationOptional, useChatFeatures, useChatFeaturesOptional, useChatLocale, useStore as useChatStore, useChatTheme, usePushNotifications };
+export { CHAT_API_KEYS, CHAT_GET_API_KEYS, Calendar, CalendarDayButton, Channel, ChannelHeaderView_default as ChannelHeader, ChannelListView_default as ChannelList, ChannelListItem_default as ChannelListItem, Chat, ChatAlertsProvider, ChatAvatar_default as ChatAvatar, ChatCustomizationProvider, ChatDateJumpMenu, ChatLayout_default as ChatLayout, ChatLocaleProvider, ChatMain_default as ChatMain, ChatThemeProvider, ChatViewport, DefaultChannelListItem, DefaultChatAvatar, DefaultChatLayout_default as DefaultChatLayout, ForegroundPushBridge, ForwardModalView as ForwardModal, HeaderCallActions_default as HeaderCallActions, LoggedUserDetails_default as LoggedUserDetails, ChannelMessageBoxView_default as MessageInput, MessageItemView as MessageItem, ActiveChannelMessagesView_default as MessageList, PUSH_CHANGED_EVENT, PushNotificationToggle, apiGetPushConfig, apiGetPushPreference, apiRegisterPushToken, apiRemovePushToken, apiUpdatePushPreference, capitalizeFirst, clampJumpDate, index_default as default, defaultChatClassNames, defaultChatComponents, defaultChatFeatures, defaultChatLayoutConfig, disablePushOnThisDevice, downloadFile, enablePushOnThisDevice, getChatBaseUrl, getChatQueryParamApis, getChatQueryParams, getChatQueryParamsByApi, getChatSocketUrl, getFirstAndLastNameOneCharacter, getResponsiveWidth, getSocketConfig, getStoredPushToken, isEmpty, isPushSupported, mergeChatCustomization, mergeChatLayoutConfig, onForegroundPush, packageDefaultComponents, resolveApiUrl, resolveChatApiKey, resolveJumpDateBounds, resolveJumpPreset, resolveJumpStep, resolveSocketUrl, setChatAccessToken, setChatBaseURL, setChatClientId, setChatQueryParamApis, setChatQueryParams, setChatQueryParamsByApi, setChatSocketUrl, showNotification, smoothScrollToMessage, socket_service_default as socketService, startOfLocalDay, toDateInputValue, uniqueList, useChatAlerts, useChatContext, useChatController, useChatCustomization, useChatCustomizationOptional, useChatFeatures, useChatFeaturesOptional, useChatLocale, useStore as useChatStore, useChatTheme, usePushNotifications };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map