@sesionario/blocks 1.17.1 → 1.18.0

package/dist/index.d.cts

@@ -676,6 +676,11 @@ interface VideoPlayerProps {
     labels?: VideoPlayerLabels;
     /** Show the resolution picker when multiple levels exist. Default true. */
     showQualitySelector?: boolean;
+    /**
+     * When true, force-pauses the media element. Clearing it does not
+     * auto-resume — the user must press play again.
+     */
+    paused?: boolean;
     onPlayingChange?: (playing: boolean) => void;
     /** Fires once, the first time playback actually starts — wire your view
      * beacon here. */
@@ -692,7 +697,30 @@ interface VideoPlayerProps {
  *
  * hls.js is a peer dependency loaded on demand; see {@link useHlsPlayback}.
  */
-declare function VideoPlayer({ src, mode, poster, autoPlay, muted, stats, labels, showQualitySelector, onPlayingChange, onFirstPlay, onError, className, }: VideoPlayerProps): React.JSX.Element;
+declare function VideoPlayer({ src, mode, poster, autoPlay, muted, stats, labels, showQualitySelector, paused, onPlayingChange, onFirstPlay, onError, className, }: VideoPlayerProps): React.JSX.Element;
+
+interface FeedVideoPlayerProps extends VideoPlayerProps {
+    /** Stable id for exclusive playback (typically the feed post id). */
+    playbackId: string;
+}
+/**
+ * Feed-scoped {@link VideoPlayer}: only one feed video plays at a time, and
+ * playback autopauses when the card leaves the viewport or the tab is hidden.
+ */
+declare function FeedVideoPlayer({ playbackId, onPlayingChange, paused: pausedProp, ...playerProps }: FeedVideoPlayerProps): React.JSX.Element;
+
+interface UseFeedExclusivePlaybackResult {
+    containerRef: React.RefObject<HTMLDivElement | null>;
+    paused: boolean;
+    onPlayingChange: (playing: boolean) => void;
+}
+/**
+ * Coordinates exclusive feed playback: claims the global slot on play,
+ * force-pauses when another feed video plays, when the player leaves the
+ * viewport, or when the tab is hidden. Picture-in-Picture is exempt from
+ * scroll/visibility autopause.
+ */
+declare function useFeedExclusivePlayback(playbackId: string): UseFeedExclusivePlaybackResult;
 
 type PlaybackState = "idle" | "loading" | "ready" | "waiting" | "error";
 /** Autoplay overlay state once the manifest is parsed. */
@@ -1261,4 +1289,4 @@ declare function useRealtimeChannel({ getWsUrl, onEvent, enabled, reconnectDelay
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { type AutoplayState, AvatarEditor, AvatarEditorDialog, type AvatarEditorDialogProps, type AvatarEditorProps, type BlocksLanguage, Bubble, BubbleContent, BubbleGroup, BubbleReactions, type ChatListMessage, ChatMessageList, type ChatMessageListProps, ConfirmDestructiveDialog, type ConfirmDestructiveDialogProps, type ConversationKind, type DescribedPlaybackError, DropdownMenuItem, DropdownMenuSeparator, type EmojiCategoryData, type EmojiCategoryKey, type EmojiDatum, EmojiInput, type EmojiInputProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerLocale, EmojiPickerPopover, type EmojiPickerPopoverProps, type EmojiPickerProps, type EmojiSkinTone, EmojiTextarea, type EmojiTextareaProps, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, type EmptyStateProps, EmptyTitle, ErrorState, ExpandableText, type ExpandableTextProps, type FeatureEntry, type FindOrCreateConversationInput, type HlsPlayerMode, ImageLightbox, type ImageLightboxLabels, type ImageLightboxProps, type Language, LanguageContext, type LanguageContextValue, LanguageSwitcher, type LanguageSwitcherLabels, type LanguageSwitcherProps, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, type MergedPlatformAccountOrg, Message, MessageAvatar, MessageComposer, type MessageComposerProps, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, type MexicoMapProps, type MexicoState, type MexicoStateId, type OpenThreadRequest, OrgSwitcher, type OrgSwitcherLabels, type OrgSwitcherProps, type OrgSwitcherTenant, PLATFORM_ACCOUNT_ORG_COLLAPSE_AT, PhoneInput, type PhoneInputProps, PlatformAccountMenu, type PlatformAccountMenuLabels, type PlatformAccountMenuOrg, type PlatformAccountMenuProps, type PlatformAccountMenuUrls, type PlatformAccountMenuUser, type PlatformAccountMenuVariant, PlatformNavbar, type PlatformNavbarProps, type PlaybackErrorContext, type PlaybackErrorDetail, type PlaybackErrorKind, type PlaybackState, type PlaybackStats, type ProfessionalVerificationStatus, type QualityLevel, type RealtimeEvent, type ScrollFadeXEdges, SearchCommand, type SearchCommandLabels, type SearchCommandProps, type SearchCommandSelection, type SearchHit, SearchablePicker, type SearchablePickerCreateOption, type SearchablePickerLabels, type SearchablePickerMultipleProps, type SearchablePickerPinned, type SearchablePickerProps, type SearchablePickerSingleProps, type SupportChatClient, type SupportConversation, type SupportMessage, type SupportMessengerItem, type SupportMessengerLabels, SupportMessengerProvider, type SupportMessengerProviderProps, type SupportMessengerTab, ThemeSwitcher, type ThemeSwitcherLabels, type ThemeSwitcherProps, type UseHlsPlaybackOptions, type UseHlsPlaybackResult, type UsePlaybackStatsOptions, type UseRealtimeChannelOptions, type UseSearchHotkeyOptions, type UseSearchHotkeyResult, type UseSupportConversationOptions, type UseSupportConversationResult, VerifiedProfessionalBadge, type VerifiedProfessionalBadgeProps, VideoPlayer, type VideoPlayerLabels, type VideoPlayerProps, bubbleVariants, cn, createLiveHlsConfig, createSupportChatClient, createVodHlsConfig, defaultLanguages, describeAvResync, describePlaybackError, fuzzyMatch, insertAtCaret, markerVariants, mergePlatformAccountOrgs, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useHlsPlayback, useLanguageContext, useMediaQuery, usePlaybackStats, useRealtimeChannel, useScrollFadeXEdges, useSearchHotkey, useSupportConversation, useSupportMessenger, useSupportMessengerOptional };
+export { type AutoplayState, AvatarEditor, AvatarEditorDialog, type AvatarEditorDialogProps, type AvatarEditorProps, type BlocksLanguage, Bubble, BubbleContent, BubbleGroup, BubbleReactions, type ChatListMessage, ChatMessageList, type ChatMessageListProps, ConfirmDestructiveDialog, type ConfirmDestructiveDialogProps, type ConversationKind, type DescribedPlaybackError, DropdownMenuItem, DropdownMenuSeparator, type EmojiCategoryData, type EmojiCategoryKey, type EmojiDatum, EmojiInput, type EmojiInputProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerLocale, EmojiPickerPopover, type EmojiPickerPopoverProps, type EmojiPickerProps, type EmojiSkinTone, EmojiTextarea, type EmojiTextareaProps, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, type EmptyStateProps, EmptyTitle, ErrorState, ExpandableText, type ExpandableTextProps, type FeatureEntry, FeedVideoPlayer, type FeedVideoPlayerProps, type FindOrCreateConversationInput, type HlsPlayerMode, ImageLightbox, type ImageLightboxLabels, type ImageLightboxProps, type Language, LanguageContext, type LanguageContextValue, LanguageSwitcher, type LanguageSwitcherLabels, type LanguageSwitcherProps, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, type MergedPlatformAccountOrg, Message, MessageAvatar, MessageComposer, type MessageComposerProps, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, type MexicoMapProps, type MexicoState, type MexicoStateId, type OpenThreadRequest, OrgSwitcher, type OrgSwitcherLabels, type OrgSwitcherProps, type OrgSwitcherTenant, PLATFORM_ACCOUNT_ORG_COLLAPSE_AT, PhoneInput, type PhoneInputProps, PlatformAccountMenu, type PlatformAccountMenuLabels, type PlatformAccountMenuOrg, type PlatformAccountMenuProps, type PlatformAccountMenuUrls, type PlatformAccountMenuUser, type PlatformAccountMenuVariant, PlatformNavbar, type PlatformNavbarProps, type PlaybackErrorContext, type PlaybackErrorDetail, type PlaybackErrorKind, type PlaybackState, type PlaybackStats, type ProfessionalVerificationStatus, type QualityLevel, type RealtimeEvent, type ScrollFadeXEdges, SearchCommand, type SearchCommandLabels, type SearchCommandProps, type SearchCommandSelection, type SearchHit, SearchablePicker, type SearchablePickerCreateOption, type SearchablePickerLabels, type SearchablePickerMultipleProps, type SearchablePickerPinned, type SearchablePickerProps, type SearchablePickerSingleProps, type SupportChatClient, type SupportConversation, type SupportMessage, type SupportMessengerItem, type SupportMessengerLabels, SupportMessengerProvider, type SupportMessengerProviderProps, type SupportMessengerTab, ThemeSwitcher, type ThemeSwitcherLabels, type ThemeSwitcherProps, type UseFeedExclusivePlaybackResult, type UseHlsPlaybackOptions, type UseHlsPlaybackResult, type UsePlaybackStatsOptions, type UseRealtimeChannelOptions, type UseSearchHotkeyOptions, type UseSearchHotkeyResult, type UseSupportConversationOptions, type UseSupportConversationResult, VerifiedProfessionalBadge, type VerifiedProfessionalBadgeProps, VideoPlayer, type VideoPlayerLabels, type VideoPlayerProps, bubbleVariants, cn, createLiveHlsConfig, createSupportChatClient, createVodHlsConfig, defaultLanguages, describeAvResync, describePlaybackError, fuzzyMatch, insertAtCaret, markerVariants, mergePlatformAccountOrgs, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useFeedExclusivePlayback, useHlsPlayback, useLanguageContext, useMediaQuery, usePlaybackStats, useRealtimeChannel, useScrollFadeXEdges, useSearchHotkey, useSupportConversation, useSupportMessenger, useSupportMessengerOptional };

package/dist/index.d.ts

@@ -676,6 +676,11 @@ interface VideoPlayerProps {
     labels?: VideoPlayerLabels;
     /** Show the resolution picker when multiple levels exist. Default true. */
     showQualitySelector?: boolean;
+    /**
+     * When true, force-pauses the media element. Clearing it does not
+     * auto-resume — the user must press play again.
+     */
+    paused?: boolean;
     onPlayingChange?: (playing: boolean) => void;
     /** Fires once, the first time playback actually starts — wire your view
      * beacon here. */
@@ -692,7 +697,30 @@ interface VideoPlayerProps {
  *
  * hls.js is a peer dependency loaded on demand; see {@link useHlsPlayback}.
  */
-declare function VideoPlayer({ src, mode, poster, autoPlay, muted, stats, labels, showQualitySelector, onPlayingChange, onFirstPlay, onError, className, }: VideoPlayerProps): React.JSX.Element;
+declare function VideoPlayer({ src, mode, poster, autoPlay, muted, stats, labels, showQualitySelector, paused, onPlayingChange, onFirstPlay, onError, className, }: VideoPlayerProps): React.JSX.Element;
+
+interface FeedVideoPlayerProps extends VideoPlayerProps {
+    /** Stable id for exclusive playback (typically the feed post id). */
+    playbackId: string;
+}
+/**
+ * Feed-scoped {@link VideoPlayer}: only one feed video plays at a time, and
+ * playback autopauses when the card leaves the viewport or the tab is hidden.
+ */
+declare function FeedVideoPlayer({ playbackId, onPlayingChange, paused: pausedProp, ...playerProps }: FeedVideoPlayerProps): React.JSX.Element;
+
+interface UseFeedExclusivePlaybackResult {
+    containerRef: React.RefObject<HTMLDivElement | null>;
+    paused: boolean;
+    onPlayingChange: (playing: boolean) => void;
+}
+/**
+ * Coordinates exclusive feed playback: claims the global slot on play,
+ * force-pauses when another feed video plays, when the player leaves the
+ * viewport, or when the tab is hidden. Picture-in-Picture is exempt from
+ * scroll/visibility autopause.
+ */
+declare function useFeedExclusivePlayback(playbackId: string): UseFeedExclusivePlaybackResult;
 
 type PlaybackState = "idle" | "loading" | "ready" | "waiting" | "error";
 /** Autoplay overlay state once the manifest is parsed. */
@@ -1261,4 +1289,4 @@ declare function useRealtimeChannel({ getWsUrl, onEvent, enabled, reconnectDelay
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { type AutoplayState, AvatarEditor, AvatarEditorDialog, type AvatarEditorDialogProps, type AvatarEditorProps, type BlocksLanguage, Bubble, BubbleContent, BubbleGroup, BubbleReactions, type ChatListMessage, ChatMessageList, type ChatMessageListProps, ConfirmDestructiveDialog, type ConfirmDestructiveDialogProps, type ConversationKind, type DescribedPlaybackError, DropdownMenuItem, DropdownMenuSeparator, type EmojiCategoryData, type EmojiCategoryKey, type EmojiDatum, EmojiInput, type EmojiInputProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerLocale, EmojiPickerPopover, type EmojiPickerPopoverProps, type EmojiPickerProps, type EmojiSkinTone, EmojiTextarea, type EmojiTextareaProps, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, type EmptyStateProps, EmptyTitle, ErrorState, ExpandableText, type ExpandableTextProps, type FeatureEntry, type FindOrCreateConversationInput, type HlsPlayerMode, ImageLightbox, type ImageLightboxLabels, type ImageLightboxProps, type Language, LanguageContext, type LanguageContextValue, LanguageSwitcher, type LanguageSwitcherLabels, type LanguageSwitcherProps, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, type MergedPlatformAccountOrg, Message, MessageAvatar, MessageComposer, type MessageComposerProps, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, type MexicoMapProps, type MexicoState, type MexicoStateId, type OpenThreadRequest, OrgSwitcher, type OrgSwitcherLabels, type OrgSwitcherProps, type OrgSwitcherTenant, PLATFORM_ACCOUNT_ORG_COLLAPSE_AT, PhoneInput, type PhoneInputProps, PlatformAccountMenu, type PlatformAccountMenuLabels, type PlatformAccountMenuOrg, type PlatformAccountMenuProps, type PlatformAccountMenuUrls, type PlatformAccountMenuUser, type PlatformAccountMenuVariant, PlatformNavbar, type PlatformNavbarProps, type PlaybackErrorContext, type PlaybackErrorDetail, type PlaybackErrorKind, type PlaybackState, type PlaybackStats, type ProfessionalVerificationStatus, type QualityLevel, type RealtimeEvent, type ScrollFadeXEdges, SearchCommand, type SearchCommandLabels, type SearchCommandProps, type SearchCommandSelection, type SearchHit, SearchablePicker, type SearchablePickerCreateOption, type SearchablePickerLabels, type SearchablePickerMultipleProps, type SearchablePickerPinned, type SearchablePickerProps, type SearchablePickerSingleProps, type SupportChatClient, type SupportConversation, type SupportMessage, type SupportMessengerItem, type SupportMessengerLabels, SupportMessengerProvider, type SupportMessengerProviderProps, type SupportMessengerTab, ThemeSwitcher, type ThemeSwitcherLabels, type ThemeSwitcherProps, type UseHlsPlaybackOptions, type UseHlsPlaybackResult, type UsePlaybackStatsOptions, type UseRealtimeChannelOptions, type UseSearchHotkeyOptions, type UseSearchHotkeyResult, type UseSupportConversationOptions, type UseSupportConversationResult, VerifiedProfessionalBadge, type VerifiedProfessionalBadgeProps, VideoPlayer, type VideoPlayerLabels, type VideoPlayerProps, bubbleVariants, cn, createLiveHlsConfig, createSupportChatClient, createVodHlsConfig, defaultLanguages, describeAvResync, describePlaybackError, fuzzyMatch, insertAtCaret, markerVariants, mergePlatformAccountOrgs, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useHlsPlayback, useLanguageContext, useMediaQuery, usePlaybackStats, useRealtimeChannel, useScrollFadeXEdges, useSearchHotkey, useSupportConversation, useSupportMessenger, useSupportMessengerOptional };
+export { type AutoplayState, AvatarEditor, AvatarEditorDialog, type AvatarEditorDialogProps, type AvatarEditorProps, type BlocksLanguage, Bubble, BubbleContent, BubbleGroup, BubbleReactions, type ChatListMessage, ChatMessageList, type ChatMessageListProps, ConfirmDestructiveDialog, type ConfirmDestructiveDialogProps, type ConversationKind, type DescribedPlaybackError, DropdownMenuItem, DropdownMenuSeparator, type EmojiCategoryData, type EmojiCategoryKey, type EmojiDatum, EmojiInput, type EmojiInputProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerLocale, EmojiPickerPopover, type EmojiPickerPopoverProps, type EmojiPickerProps, type EmojiSkinTone, EmojiTextarea, type EmojiTextareaProps, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, type EmptyStateProps, EmptyTitle, ErrorState, ExpandableText, type ExpandableTextProps, type FeatureEntry, FeedVideoPlayer, type FeedVideoPlayerProps, type FindOrCreateConversationInput, type HlsPlayerMode, ImageLightbox, type ImageLightboxLabels, type ImageLightboxProps, type Language, LanguageContext, type LanguageContextValue, LanguageSwitcher, type LanguageSwitcherLabels, type LanguageSwitcherProps, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, type MergedPlatformAccountOrg, Message, MessageAvatar, MessageComposer, type MessageComposerProps, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, type MexicoMapProps, type MexicoState, type MexicoStateId, type OpenThreadRequest, OrgSwitcher, type OrgSwitcherLabels, type OrgSwitcherProps, type OrgSwitcherTenant, PLATFORM_ACCOUNT_ORG_COLLAPSE_AT, PhoneInput, type PhoneInputProps, PlatformAccountMenu, type PlatformAccountMenuLabels, type PlatformAccountMenuOrg, type PlatformAccountMenuProps, type PlatformAccountMenuUrls, type PlatformAccountMenuUser, type PlatformAccountMenuVariant, PlatformNavbar, type PlatformNavbarProps, type PlaybackErrorContext, type PlaybackErrorDetail, type PlaybackErrorKind, type PlaybackState, type PlaybackStats, type ProfessionalVerificationStatus, type QualityLevel, type RealtimeEvent, type ScrollFadeXEdges, SearchCommand, type SearchCommandLabels, type SearchCommandProps, type SearchCommandSelection, type SearchHit, SearchablePicker, type SearchablePickerCreateOption, type SearchablePickerLabels, type SearchablePickerMultipleProps, type SearchablePickerPinned, type SearchablePickerProps, type SearchablePickerSingleProps, type SupportChatClient, type SupportConversation, type SupportMessage, type SupportMessengerItem, type SupportMessengerLabels, SupportMessengerProvider, type SupportMessengerProviderProps, type SupportMessengerTab, ThemeSwitcher, type ThemeSwitcherLabels, type ThemeSwitcherProps, type UseFeedExclusivePlaybackResult, type UseHlsPlaybackOptions, type UseHlsPlaybackResult, type UsePlaybackStatsOptions, type UseRealtimeChannelOptions, type UseSearchHotkeyOptions, type UseSearchHotkeyResult, type UseSupportConversationOptions, type UseSupportConversationResult, VerifiedProfessionalBadge, type VerifiedProfessionalBadgeProps, VideoPlayer, type VideoPlayerLabels, type VideoPlayerProps, bubbleVariants, cn, createLiveHlsConfig, createSupportChatClient, createVodHlsConfig, defaultLanguages, describeAvResync, describePlaybackError, fuzzyMatch, insertAtCaret, markerVariants, mergePlatformAccountOrgs, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useFeedExclusivePlayback, useHlsPlayback, useLanguageContext, useMediaQuery, usePlaybackStats, useRealtimeChannel, useScrollFadeXEdges, useSearchHotkey, useSupportConversation, useSupportMessenger, useSupportMessengerOptional };

package/dist/index.js

@@ -3757,7 +3757,7 @@ function insertAtCaret(element, value, text) {
 }
 
 // src/components/emoji/emoji-field-shared.ts
-var emojiFieldWrapperClassName = "relative w-full rounded-md border border-input bg-transparent shadow-xs transition-[color,box-shadow] focus-within:border-ring focus-within:ring-[3px] focus-within:ring-ring/50 has-[[aria-invalid=true]]:border-destructive has-[[aria-invalid=true]]:ring-destructive/20 has-[:disabled]:opacity-50 dark:bg-input/30 dark:has-[[aria-invalid=true]]:ring-destructive/40";
+var emojiFieldWrapperClassName = "relative w-full rounded-md border border-input bg-transparent shadow-xs transition-[color,box-shadow] focus-within:border-ring focus-within:ring-[3px] focus-within:ring-ring/50 has-[[aria-invalid=true]]:border-destructive has-[[aria-invalid=true]]:ring-destructive/20 has-[[data-slot=textarea]:disabled]:opacity-50 has-[[data-slot=input]:disabled]:opacity-50 dark:bg-input/30 dark:has-[[aria-invalid=true]]:ring-destructive/40";
 var emojiFieldResetClassName = "border-0 bg-transparent shadow-none focus-visible:border-transparent focus-visible:ring-0 dark:bg-transparent";
 function mergeRefs(...refs) {
   return (node) => {
@@ -4483,6 +4483,7 @@ function VideoPlayer({
   stats,
   labels,
   showQualitySelector = true,
+  paused = false,
   onPlayingChange,
   onFirstPlay,
   onError,
@@ -4574,6 +4575,11 @@ function VideoPlayer({
       video.removeEventListener("ratechange", onRate);
     };
   }, [videoRef, active, mode]);
+  React7.useEffect(() => {
+    const video = videoRef.current;
+    if (!paused || !video || !isPlaying) return;
+    video.pause();
+  }, [paused, videoRef, isPlaying]);
   React7.useEffect(() => {
     setWebkitFullscreenSupported(hasWebkitVideoFullscreen(videoRef.current));
   }, [videoRef, active]);
@@ -5081,6 +5087,106 @@ function MenuItem({
     }
   );
 }
+
+// src/components/video/feedPlaybackCoordinator.ts
+var players = /* @__PURE__ */ new Map();
+function registerFeedPlayer(id, pause) {
+  players.set(id, pause);
+  return () => {
+    if (players.get(id) === pause) {
+      players.delete(id);
+    }
+  };
+}
+function claimFeedPlaying(id) {
+  for (const [otherId, pause] of players) {
+    if (otherId !== id) pause();
+  }
+}
+
+// src/components/video/useFeedExclusivePlayback.ts
+var VISIBILITY_THRESHOLDS = [0, 0.5, 1];
+var MIN_VISIBLE_RATIO = 0.5;
+function videoInPictureInPicture(container) {
+  if (typeof document === "undefined" || !container) return false;
+  const pip = document.pictureInPictureElement;
+  if (!pip) return false;
+  return container.contains(pip);
+}
+function useFeedExclusivePlayback(playbackId) {
+  const containerRef = React7.useRef(null);
+  const [forcePaused, setForcePaused] = React7.useState(false);
+  const requestPause = React7.useCallback(() => {
+    if (videoInPictureInPicture(containerRef.current)) return;
+    setForcePaused(true);
+  }, []);
+  React7.useEffect(() => {
+    return registerFeedPlayer(playbackId, requestPause);
+  }, [playbackId, requestPause]);
+  React7.useEffect(() => {
+    const node = containerRef.current;
+    if (!node || typeof IntersectionObserver === "undefined") return;
+    const observer = new IntersectionObserver(
+      (entries) => {
+        const entry = entries[0];
+        if (!entry) return;
+        if (!entry.isIntersecting || entry.intersectionRatio < MIN_VISIBLE_RATIO) {
+          requestPause();
+        }
+      },
+      { threshold: [...VISIBILITY_THRESHOLDS] }
+    );
+    observer.observe(node);
+    return () => observer.disconnect();
+  }, [requestPause]);
+  React7.useEffect(() => {
+    const onVisibility = () => {
+      if (document.hidden) requestPause();
+    };
+    document.addEventListener("visibilitychange", onVisibility);
+    return () => document.removeEventListener("visibilitychange", onVisibility);
+  }, [requestPause]);
+  const onPlayingChange = React7.useCallback(
+    (playing) => {
+      if (!playing) return;
+      setForcePaused(false);
+      claimFeedPlaying(playbackId);
+    },
+    [playbackId]
+  );
+  return {
+    containerRef,
+    paused: forcePaused,
+    onPlayingChange
+  };
+}
+function FeedVideoPlayer({
+  playbackId,
+  onPlayingChange,
+  paused: pausedProp,
+  ...playerProps
+}) {
+  const {
+    containerRef,
+    paused: exclusivePaused,
+    onPlayingChange: onExclusivePlayingChange
+  } = useFeedExclusivePlayback(playbackId);
+  const handlePlayingChange = React7.useCallback(
+    (playing) => {
+      onExclusivePlayingChange(playing);
+      onPlayingChange?.(playing);
+    },
+    [onExclusivePlayingChange, onPlayingChange]
+  );
+  return /* @__PURE__ */ jsx("div", { ref: containerRef, "data-slot": "feed-video-player", children: /* @__PURE__ */ jsx(
+    VideoPlayer,
+    {
+      ...playerProps,
+      paused: pausedProp || exclusivePaused,
+      onPlayingChange: handlePlayingChange
+    }
+  ) });
+}
 function usePlaybackStats(statsUrl, { intervalMs = 15e3, enabled = true } = {}) {
   const [stats, setStats] = React7.useState({});
   React7.useEffect(() => {
@@ -7703,6 +7809,6 @@ function useRealtimeChannel({
   }, [enabled, reconnectDelayMs]);
 }
 
-export { AvatarEditor, AvatarEditorDialog, Bubble, BubbleContent, BubbleGroup, BubbleReactions, ChatMessageList, ConfirmDestructiveDialog, DropdownMenuItem, DropdownMenuSeparator, EmojiInput, EmojiPicker, EmojiPickerPopover, EmojiTextarea, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, EmptyTitle, ErrorState, ExpandableText, ImageLightbox, LanguageContext, LanguageSwitcher, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, Message, MessageAvatar, MessageComposer, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, OrgSwitcher, PLATFORM_ACCOUNT_ORG_COLLAPSE_AT, PhoneInput, PlatformAccountMenu, PlatformNavbar, SearchCommand, SearchablePicker, SupportMessengerProvider, ThemeSwitcher, VerifiedProfessionalBadge, VideoPlayer, avatarFallbackStyle, bubbleVariants, cn, createLiveHlsConfig, createSupportChatClient, createVodHlsConfig, defaultLanguages, describeAvResync, describePlaybackError, fuzzyMatch, getAvatarColors, getInitials, insertAtCaret, markerVariants, mergePlatformAccountOrgs, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useHlsPlayback, useLanguageContext, useMediaQuery2 as useMediaQuery, usePlaybackStats, useRealtimeChannel, useScrollFadeXEdges, useSearchHotkey, useSupportConversation, useSupportMessenger, useSupportMessengerOptional };
+export { AvatarEditor, AvatarEditorDialog, Bubble, BubbleContent, BubbleGroup, BubbleReactions, ChatMessageList, ConfirmDestructiveDialog, DropdownMenuItem, DropdownMenuSeparator, EmojiInput, EmojiPicker, EmojiPickerPopover, EmojiTextarea, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, EmptyTitle, ErrorState, ExpandableText, FeedVideoPlayer, ImageLightbox, LanguageContext, LanguageSwitcher, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, Message, MessageAvatar, MessageComposer, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, OrgSwitcher, PLATFORM_ACCOUNT_ORG_COLLAPSE_AT, PhoneInput, PlatformAccountMenu, PlatformNavbar, SearchCommand, SearchablePicker, SupportMessengerProvider, ThemeSwitcher, VerifiedProfessionalBadge, VideoPlayer, avatarFallbackStyle, bubbleVariants, cn, createLiveHlsConfig, createSupportChatClient, createVodHlsConfig, defaultLanguages, describeAvResync, describePlaybackError, fuzzyMatch, getAvatarColors, getInitials, insertAtCaret, markerVariants, mergePlatformAccountOrgs, normalizeEmojiQuery, shouldRetryLiveEdge404, useDebouncedValue, useDebouncedValueStrict, useFeedExclusivePlayback, useHlsPlayback, useLanguageContext, useMediaQuery2 as useMediaQuery, usePlaybackStats, useRealtimeChannel, useScrollFadeXEdges, useSearchHotkey, useSupportConversation, useSupportMessenger, useSupportMessengerOptional };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map