@realtimexsco/live-chat 1.4.15 → 1.4.16

package/dist/index.cjs

@@ -6906,8 +6906,21 @@ function AdminPermissionTooltip({
   if (!disabled || !message) {
     return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
   }
+  const gatedChildren = React3__namespace.default.Children.map(children, (child) => {
+    if (!React3__namespace.default.isValidElement(child)) return child;
+    return React3__namespace.default.cloneElement(child, {
+      className: cn(child.props.className, "pointer-events-none")
+    });
+  });
   return /* @__PURE__ */ jsxRuntime.jsxs(Tooltip, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("inline-flex", className), children }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        className: cn("inline-flex cursor-not-allowed", className),
+        tabIndex: 0,
+        children: gatedChildren
+      }
+    ) }),
     /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { side, className: "max-w-[240px] text-xs", children: message })
   ] });
 }
@@ -7320,9 +7333,34 @@ var PushNotificationToggle = ({
   children
 }) => {
   const push = usePushNotifications();
-  const { getPushNotificationGate } = useEffectiveSettingsOptional();
+  const { loading: settingsLoading, getPushNotificationGate } = useEffectiveSettingsOptional();
   const adminGate = getPushNotificationGate();
   const [isToggling, setIsToggling] = React3.useState(false);
+  const isBootstrapping = push.loading || settingsLoading;
+  if (isBootstrapping && !push.supported) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "flex items-center justify-between gap-4 rounded-xl border border-(--chat-border) bg-(--chat-surface) px-4 py-3",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-0.5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-(--chat-text)", children: label }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-(--chat-muted)", children: "Loading\u2026" })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            lucideReact.Loader2,
+            {
+              className: "size-5 shrink-0 animate-spin text-(--chat-theme)",
+              "aria-label": "Loading push notification settings"
+            }
+          )
+        ]
+      }
+    );
+  }
   if (!push.supported) {
     return null;
   }
@@ -7330,8 +7368,8 @@ var PushNotificationToggle = ({
   const permissionBlocked = push.permission === "denied";
   const adminBlocked = !adminGate.enabled;
   const notConfigured = !push.configured;
-  const showLoader = isToggling;
-  const isDisabled = showLoader || permissionBlocked || push.loading || adminBlocked || notConfigured;
+  const showLoader = isToggling || isBootstrapping;
+  const isDisabled = showLoader || permissionBlocked || push.loading || settingsLoading || adminBlocked || notConfigured;
   const handleChange = async (checked) => {
     if (adminBlocked || notConfigured) return;
     setIsToggling(true);
@@ -9003,14 +9041,12 @@ var DefaultHeaderCallActions = ({
   onVideoCall,
   className
 }) => {
-  const { components, slotClassName, features } = useChatCustomizationOptional();
+  const { components, slotClassName } = useChatCustomizationOptional();
   const { getAudioCallGate, getVideoCallGate } = useEffectiveSettingsOptional();
   const PhoneSlot = components.PhoneCallButton;
   const VideoSlot = components.VideoCallButton;
-  const hideInGroups = features.hideCallActionsInGroupChats ?? false;
   const audioGate = getAudioCallGate();
   const videoGate = getVideoCallGate();
-  if (hideInGroups && activeChannel.isGroup) return null;
   if (!showPhoneCall && !showVideoCall) return null;
   const phoneEnabled = showPhoneCall && audioGate.enabled;
   const videoEnabled = showVideoCall && videoGate.enabled;
@@ -9020,6 +9056,7 @@ var DefaultHeaderCallActions = ({
       {
         disabled: !audioGate.enabled,
         message: audioGate.disabledReason,
+        side: "bottom",
         children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex", children: /* @__PURE__ */ jsxRuntime.jsx(
           PhoneSlot,
           {
@@ -9029,7 +9066,7 @@ var DefaultHeaderCallActions = ({
             className: cn(
               className,
               slotClassName("phoneCallButton"),
-              !audioGate.enabled && "pointer-events-none opacity-40"
+              !audioGate.enabled && "opacity-40"
             )
           }
         ) })
@@ -9039,6 +9076,7 @@ var DefaultHeaderCallActions = ({
       {
         disabled: !audioGate.enabled,
         message: audioGate.disabledReason,
+        side: "bottom",
         children: /* @__PURE__ */ jsxRuntime.jsx(
           Button,
           {
@@ -9058,6 +9096,7 @@ var DefaultHeaderCallActions = ({
       {
         disabled: !videoGate.enabled,
         message: videoGate.disabledReason,
+        side: "bottom",
         children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex", children: /* @__PURE__ */ jsxRuntime.jsx(
           VideoSlot,
           {
@@ -9067,7 +9106,7 @@ var DefaultHeaderCallActions = ({
             className: cn(
               className,
               slotClassName("videoCallButton"),
-              !videoGate.enabled && "pointer-events-none opacity-40"
+              !videoGate.enabled && "opacity-40"
             )
           }
         ) })
@@ -9077,6 +9116,7 @@ var DefaultHeaderCallActions = ({
       {
         disabled: !videoGate.enabled,
         message: videoGate.disabledReason,
+        side: "bottom",
         children: /* @__PURE__ */ jsxRuntime.jsx(
           Button,
           {
@@ -9094,16 +9134,13 @@ var DefaultHeaderCallActions = ({
   ] });
 };
 var HeaderCallActions = (props) => {
-  const { components, slotClassName, features } = useChatCustomizationOptional();
+  const { components, slotClassName } = 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__ */ jsxRuntime.jsx("div", { className: cn("flex items-center gap-0.5", slotClassName("headerCallActions")), children: Custom ? /* @__PURE__ */ jsxRuntime.jsx(Custom, { ...props }) : /* @__PURE__ */ jsxRuntime.jsx(DefaultHeaderCallActions, { ...props }) });
+  const showPhoneCall = props.showPhoneCall ?? true;
+  const showVideoCall = props.showVideoCall ?? true;
+  if (!showPhoneCall && !showVideoCall) return null;
+  const useCustom = Custom != null && Custom !== HeaderCallActions;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center gap-0.5", slotClassName("headerCallActions")), children: useCustom ? /* @__PURE__ */ jsxRuntime.jsx(Custom, { ...props }) : /* @__PURE__ */ jsxRuntime.jsx(DefaultHeaderCallActions, { ...props }) });
 };
 var HeaderCallActions_default = HeaderCallActions;
 function OptionsMenuItem({
@@ -13501,8 +13538,8 @@ var PermissionDrawer = ({ isOpen, onOpenChange, conversationId, conversationInfo
     { key: "onlyAdminCanSendMessage", label: "Only Admin Can Send Message", desc: "Restricts message sending to group administrators only." },
     { key: "onlyAdminCanEditInfo", label: "Only Admin Can Edit Info", desc: "Only admins can change group name, description, and avatar." },
     { key: "senderCanEditMessage", label: "Sender Can Edit Message", desc: "Allows users to edit their own sent messages." },
-    { key: "allowMemberAdd", label: "Only Admin Can Add Members", desc: "Only administrators can add new participants to the group.", inverted: true },
-    { key: "allowMemberRemove", label: "Only Admin Can Remove Members", desc: "Only administrators can remove other participants.", inverted: true },
+    { key: "allowMemberAdd", label: "Allow Members to Add", desc: "Allows group members to add new participants." },
+    { key: "allowMemberRemove", label: "Allow Members to Remove", desc: "Allows group members to remove other participants." },
     { key: "moderationEnabled", label: "Moderation Enabled", desc: "Enables advanced message moderation features." }
   ];
   return /* @__PURE__ */ jsxRuntime.jsx(Sheet, { open: isOpen, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(ChatSheetContent, { showCloseButton: true, className: "sm:max-w-[380px]", children: [
@@ -13518,7 +13555,7 @@ var PermissionDrawer = ({ isOpen, onOpenChange, conversationId, conversationInfo
         /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-1 px-0.5 text-[10px] font-semibold uppercase tracking-wide text-(--chat-muted)", children: "Permissions" }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border border-(--chat-border) px-3", children: permissionItems.map((item, index) => {
           const locked = isGroupPermissionLocked(item.key);
-          const checked = item.inverted ? !permissions[item.key] : permissions[item.key];
+          const checked = permissions[item.key];
           return /* @__PURE__ */ jsxRuntime.jsxs(
             "div",
             {