@sesionario/blocks 1.11.0 → 1.13.0

package/dist/index.cjs

@@ -2988,8 +2988,8 @@ function EmojiPicker({
           {
             ref: scrollRef,
             onKeyDown: handleGridKeyDown,
-            className: "h-64 overflow-x-hidden overflow-y-auto p-2",
-            children: normalizedQuery ? searchResults.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground py-8 text-center text-sm", children: strings.noResults }) : /* @__PURE__ */ jsxRuntime.jsx(
+            className: "h-64 overflow-x-hidden overflow-y-auto px-2 pb-2",
+            children: normalizedQuery ? searchResults.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground py-8 text-center text-sm", children: strings.noResults }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-2", children: /* @__PURE__ */ jsxRuntime.jsx(
               EmojiGrid,
               {
                 emojis: searchResults,
@@ -2998,7 +2998,7 @@ function EmojiPicker({
                 skinTone,
                 onSelect: handleSelect
               }
-            ) : sections.map((section) => {
+            ) }) : sections.map((section) => {
               const startIndex = flatOffset;
               flatOffset += section.emojis.length;
               return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -3009,7 +3009,7 @@ function EmojiPicker({
                   },
                   className: "mb-2",
                   children: [
-                    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-muted-foreground bg-popover sticky top-0 z-[1] px-1 py-1 text-xs font-medium", children: section.title }),
+                    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-muted-foreground bg-popover sticky top-0 z-[1] -mx-2 px-3 pt-2 pb-1 text-xs font-medium", children: section.title }),
                     /* @__PURE__ */ jsxRuntime.jsx(
                       "div",
                       {
@@ -3130,7 +3130,7 @@ function EmojiPickerPopover({
   align = "end",
   open,
   onOpenChange,
-  keepOpenOnSelect = false,
+  keepOpenOnSelect = true,
   locale = "en",
   ...pickerProps
 }) {
@@ -3164,7 +3164,16 @@ function EmojiPickerPopover({
         children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Smile, { className: "size-5" })
       }
     ) }),
-    /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { side, align, className: "w-auto p-0", children: /* @__PURE__ */ jsxRuntime.jsx(EmojiPicker, { onSelect: handleSelect, locale, ...pickerProps }) })
+    /* @__PURE__ */ jsxRuntime.jsx(
+      PopoverContent,
+      {
+        side,
+        align,
+        className: "w-auto p-0",
+        onFocusOutside: (e) => e.preventDefault(),
+        children: /* @__PURE__ */ jsxRuntime.jsx(EmojiPicker, { onSelect: handleSelect, locale, ...pickerProps })
+      }
+    )
   ] });
 }
 
@@ -3453,6 +3462,20 @@ function kindForNative(input) {
   if (code === MEDIA_ERR_NETWORK) return "unavailable";
   return "generic";
 }
+function describeAvResync(input) {
+  const lag = Number.isFinite(input.lagSeconds) ? input.lagSeconds : 0;
+  return {
+    summary: `av-resync lag=${lag.toFixed(3)}s (non-fatal)`,
+    kind: "resync",
+    detail: {
+      source: input.context.source,
+      kind: "resync",
+      fatal: false,
+      reason: `presented frame lag ${lag.toFixed(3)}s`,
+      context: input.context
+    }
+  };
+}
 function describePlaybackError(input) {
   if (input.source === "unsupported") {
     return {
@@ -3511,6 +3534,10 @@ function describePlaybackError(input) {
 // src/components/video/useHlsPlayback.ts
 var RETRY_INTERVAL_MS = 3e3;
 var MAX_MEDIA_ERROR_RETRIES = 5;
+var DRIFT_THRESHOLD_S = 0.4;
+var DRIFT_CONSECUTIVE_SAMPLES = 3;
+var RESYNC_COOLDOWN_MS = 1e4;
+var LIVE_EDGE_RESYNC_THRESHOLD_S = 8;
 function useHlsPlayback({
   src,
   mode,
@@ -3550,6 +3577,7 @@ function useHlsPlayback({
     let retryTimer = null;
     let manifestParsed = false;
     let mediaErrorRetries = 0;
+    let playbackSource = "hls";
     const teardown = [];
     media.muted = muted;
     setState("loading");
@@ -3558,7 +3586,13 @@ function useHlsPlayback({
     setQualities([]);
     setActiveLevel(-1);
     function baseContext() {
-      return { mode, src, manifestParsed, retryCount: mediaErrorRetries };
+      return {
+        mode,
+        src,
+        manifestParsed,
+        retryCount: mediaErrorRetries,
+        source: playbackSource
+      };
     }
     function clearRetryTimer() {
       if (retryTimer !== null) {
@@ -3597,6 +3631,53 @@ function useHlsPlayback({
         if (!cancelled) retryFn();
       }, RETRY_INTERVAL_MS);
     }
+    function startDriftWatchdog(el) {
+      if (typeof el.requestVideoFrameCallback !== "function") return;
+      let consecutiveLagSamples = 0;
+      let lastResyncAt = 0;
+      let handle = null;
+      const tick = (_now, metadata) => {
+        if (cancelled) return;
+        handle = el.requestVideoFrameCallback(tick);
+        if (el.paused || el.ended) {
+          consecutiveLagSamples = 0;
+          return;
+        }
+        const lag = el.currentTime - metadata.mediaTime;
+        if (!(lag > DRIFT_THRESHOLD_S)) {
+          consecutiveLagSamples = 0;
+          return;
+        }
+        consecutiveLagSamples += 1;
+        if (consecutiveLagSamples < DRIFT_CONSECUTIVE_SAMPLES) return;
+        const nowMs = performance.now();
+        if (nowMs - lastResyncAt < RESYNC_COOLDOWN_MS) return;
+        lastResyncAt = nowMs;
+        consecutiveLagSamples = 0;
+        if (mode === "live" && el.seekable.length > 0) {
+          const edge = el.seekable.end(el.seekable.length - 1);
+          if (edge - el.currentTime > LIVE_EDGE_RESYNC_THRESHOLD_S) {
+            el.currentTime = edge;
+          } else {
+            el.currentTime = el.currentTime + 1e-3;
+          }
+        } else {
+          el.currentTime = el.currentTime + 1e-3;
+        }
+        onErrorRef.current?.(
+          describeAvResync({
+            lagSeconds: lag,
+            context: baseContext()
+          })
+        );
+      };
+      handle = el.requestVideoFrameCallback(tick);
+      teardown.push(() => {
+        if (handle != null && typeof el.cancelVideoFrameCallback === "function") {
+          el.cancelVideoFrameCallback(handle);
+        }
+      });
+    }
     function onPlaying() {
       manifestParsed = true;
       mediaErrorRetries = 0;
@@ -3615,7 +3696,9 @@ function useHlsPlayback({
       media.removeEventListener("pause", onPaused);
       media.removeEventListener("ended", onPaused);
     });
+    startDriftWatchdog(media);
     function initNative() {
+      playbackSource = "native";
       manifestParsed = false;
       media.removeAttribute("src");
       media.load();
@@ -3631,7 +3714,7 @@ function useHlsPlayback({
           reportFatal({
             source: "native",
             mediaError: media.error,
-            context: { ...baseContext(), source: "native" }
+            context: baseContext()
           });
           return;
         }
@@ -3639,7 +3722,7 @@ function useHlsPlayback({
           describePlaybackError({
             source: "native",
             mediaError: media.error,
-            context: { ...baseContext(), source: "native" }
+            context: baseContext()
           })
         );
         scheduleRetry(() => {
@@ -3655,6 +3738,7 @@ function useHlsPlayback({
       });
     }
     function initHlsJs(Hls) {
+      playbackSource = "hls";
       destroyHls();
       manifestParsed = false;
       const config = mode === "live" ? createLiveHlsConfig() : createVodHlsConfig();
@@ -3686,7 +3770,7 @@ function useHlsPlayback({
             response: data.response,
             reason: data.reason,
             error: data.error,
-            context: { ...baseContext(), source: "hls" }
+            context: baseContext()
           })
         );
         if (!data.fatal) return;
@@ -3721,7 +3805,7 @@ function useHlsPlayback({
           response: data.response,
           reason: data.reason,
           error: data.error,
-          context: { ...baseContext(), source: "hls" }
+          context: baseContext()
         });
       });
     }
@@ -3738,9 +3822,10 @@ function useHlsPlayback({
       } else if (media.canPlayType("application/vnd.apple.mpegurl")) {
         initNative();
       } else {
+        playbackSource = "unsupported";
         reportFatal({
           source: "unsupported",
-          context: { ...baseContext(), source: "unsupported" }
+          context: baseContext()
         });
       }
     }
@@ -4087,6 +4172,8 @@ function VideoPlayer({
         return t.errorMedia;
       case "unsupported":
         return t.errorUnsupported;
+      case "resync":
+        return t.errorMedia;
       case "generic":
         return t.errorGeneric;
       default: {
@@ -6167,8 +6254,12 @@ var MessageComposer = React7__namespace.forwardRef(function MessageComposer2({
   onKeyDown,
   sendLabel,
   sendDisabled = false,
+  allowEmptySubmit = false,
   sendButtonClassName,
   sendButtonSize = "sm",
+  submitOnEnter = true,
+  tools,
+  attachments,
   triggerLabel,
   keepOpenOnSelect,
   open,
@@ -6187,7 +6278,7 @@ var MessageComposer = React7__namespace.forwardRef(function MessageComposer2({
   const handleEmojiSelect = useEmojiInsert(fieldRef, value, onChange);
   const pickerDisabled = Boolean(disabled || readOnly);
   const draft = value !== void 0 && value !== null ? String(value) : "";
-  const canSubmit = Boolean(draft.trim()) && !sendDisabled && !disabled && !readOnly;
+  const canSubmit = (allowEmptySubmit || Boolean(draft.trim())) && !sendDisabled && !disabled && !readOnly;
   const handleSubmit = React7__namespace.useCallback(
     (event) => {
       event.preventDefault();
@@ -6200,13 +6291,14 @@ var MessageComposer = React7__namespace.forwardRef(function MessageComposer2({
     (event) => {
       onKeyDown?.(event);
       if (event.defaultPrevented) return;
+      if (!submitOnEnter) return;
       if (event.key !== "Enter" || event.shiftKey) return;
       if (event.nativeEvent.isComposing || event.keyCode === 229) return;
       event.preventDefault();
       if (!canSubmit) return;
       formRef.current?.requestSubmit();
     },
-    [canSubmit, onKeyDown]
+    [canSubmit, onKeyDown, submitOnEnter]
   );
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "form",
@@ -6233,28 +6325,32 @@ var MessageComposer = React7__namespace.forwardRef(function MessageComposer2({
             ...props
           }
         ),
+        attachments ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t px-2 py-2", children: attachments }) : null,
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2 px-1.5 pb-1.5", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            EmojiPickerPopover,
-            {
-              locale,
-              onSelect: handleEmojiSelect,
-              disabled: pickerDisabled,
-              triggerLabel,
-              keepOpenOnSelect,
-              open,
-              onOpenChange,
-              side,
-              align,
-              labels,
-              recentLimit,
-              storageKey,
-              triggerClassName: cn(
-                "size-7 text-muted-foreground",
-                emojiTriggerClassName
-              )
-            }
-          ),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-0.5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              EmojiPickerPopover,
+              {
+                locale,
+                onSelect: handleEmojiSelect,
+                disabled: pickerDisabled,
+                triggerLabel,
+                keepOpenOnSelect,
+                open,
+                onOpenChange,
+                side,
+                align,
+                labels,
+                recentLimit,
+                storageKey,
+                triggerClassName: cn(
+                  "size-7 text-muted-foreground",
+                  emojiTriggerClassName
+                )
+              }
+            ),
+            tools
+          ] }),
           /* @__PURE__ */ jsxRuntime.jsx(
             Button,
             {
@@ -6887,6 +6983,105 @@ function createSupportChatClient(basePath = "/api/chat-svc") {
     }
   };
 }
+var DEFAULT_RECONNECT_MS = 2e3;
+var MAX_RECONNECT_MS = 3e4;
+function useRealtimeChannel({
+  getWsUrl,
+  onEvent,
+  enabled = true,
+  reconnectDelayMs = DEFAULT_RECONNECT_MS
+}) {
+  const onEventRef = React7.useRef(onEvent);
+  onEventRef.current = onEvent;
+  const getWsUrlRef = React7.useRef(getWsUrl);
+  getWsUrlRef.current = getWsUrl;
+  React7.useEffect(() => {
+    if (!enabled) return;
+    let cancelled = false;
+    let socket = null;
+    let reconnectTimer = null;
+    let attempt = 0;
+    const connectGen = { current: 0 };
+    const clearReconnect = () => {
+      if (reconnectTimer) {
+        clearTimeout(reconnectTimer);
+        reconnectTimer = null;
+      }
+    };
+    const scheduleReconnect = () => {
+      if (cancelled) return;
+      clearReconnect();
+      const delay = Math.min(reconnectDelayMs * 2 ** attempt, MAX_RECONNECT_MS);
+      attempt += 1;
+      reconnectTimer = setTimeout(() => {
+        void connect();
+      }, delay);
+    };
+    const connect = async () => {
+      const gen = ++connectGen.current;
+      clearReconnect();
+      const url = await getWsUrlRef.current();
+      if (cancelled || gen !== connectGen.current) return;
+      if (!url) {
+        scheduleReconnect();
+        return;
+      }
+      if (socket) {
+        try {
+          socket.close();
+        } catch {
+        }
+        socket = null;
+      }
+      const ws = new WebSocket(url);
+      socket = ws;
+      ws.onopen = () => {
+        if (cancelled || gen !== connectGen.current) return;
+        attempt = 0;
+      };
+      ws.onmessage = (msg) => {
+        if (cancelled || gen !== connectGen.current) return;
+        let data;
+        try {
+          data = JSON.parse(String(msg.data));
+        } catch {
+          return;
+        }
+        if (typeof data?.type !== "string") return;
+        if (data.type === "pong") return;
+        onEventRef.current(data);
+      };
+      ws.onclose = () => {
+        if (cancelled || gen !== connectGen.current) return;
+        socket = null;
+        scheduleReconnect();
+      };
+      ws.onerror = () => {
+      };
+    };
+    const onVisibility = () => {
+      if (document.visibilityState !== "visible" || cancelled) return;
+      if (!socket || socket.readyState === WebSocket.CLOSED) {
+        void connect();
+      }
+    };
+    void connect();
+    document.addEventListener("visibilitychange", onVisibility);
+    return () => {
+      cancelled = true;
+      connectGen.current += 1;
+      clearReconnect();
+      document.removeEventListener("visibilitychange", onVisibility);
+      if (socket) {
+        try {
+          socket.close();
+        } catch {
+        }
+        socket = null;
+      }
+    };
+  }, [enabled, reconnectDelayMs]);
+}
 
 Object.defineProperty(exports, "useMessageScroller", {
   enumerable: true,
@@ -6959,6 +7154,7 @@ exports.createLiveHlsConfig = createLiveHlsConfig;
 exports.createSupportChatClient = createSupportChatClient;
 exports.createVodHlsConfig = createVodHlsConfig;
 exports.defaultLanguages = defaultLanguages;
+exports.describeAvResync = describeAvResync;
 exports.describePlaybackError = describePlaybackError;
 exports.fuzzyMatch = fuzzyMatch;
 exports.getAvatarColors = getAvatarColors;
@@ -6973,6 +7169,7 @@ exports.useHlsPlayback = useHlsPlayback;
 exports.useLanguageContext = useLanguageContext;
 exports.useMediaQuery = useMediaQuery2;
 exports.usePlaybackStats = usePlaybackStats;
+exports.useRealtimeChannel = useRealtimeChannel;
 exports.useSearchHotkey = useSearchHotkey;
 exports.useSupportConversation = useSupportConversation;
 exports.useSupportMessenger = useSupportMessenger;