@poolse/react-native 2.1.6 → 2.3.0

package/dist/index.d.cts

@@ -1,7 +1,8 @@
 import * as react from 'react';
 import { ReactNode, ReactElement } from 'react';
-import { Conversation, Uuid, Message, AttachmentUploadInput, Membership, Attachment } from '@poolse/sdk';
+import { Conversation, Uuid, Message, AttachmentUploadInput, Membership, Attachment, WebRtcAdapter } from '@poolse/sdk';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { UseCalls } from '@poolse/react';
 
 interface InboxUser {
     /** The user's external_id (the same id you mint JWTs with). */
@@ -976,4 +977,125 @@ declare const defaultDarkTheme: PoolseRNTheme;
  */
 declare function useAppStateLifecycle(): void;
 
-export { AttachmentPicker, type AttachmentPickerProps, AttachmentPreview, type AttachmentPreviewProps, Avatar, type AvatarProps, ChatHeader, type ChatHeaderProps, ConversationList, type ConversationListProps, ConversationView, type ConversationViewProps, DaySeparator, type DaySeparatorProps, GroupDetailsSheet, type GroupDetailsSheetProps, type IconName, ImageMosaic, type ImageMosaicProps, type InboxUser, MemberList, type MemberListProps, MentionInput, type MentionInputProps, MessageActions, type MessageActionsProps, MessageBubble, type MessageBubbleProps, MessageComposer, type MessageComposerProps, MessageList, type MessageListItem, type MessageListProps, MessageRow, type MessageRowProps, PoolseIcon, type PoolseIconProps, PoolseInbox, type PoolseInboxHandle, type PoolseInboxProps, PoolseLogo, type PoolseLogoProps, type PoolseLogoVariant, type PoolseRNTheme, type PoolseRNThemeOverrides, PoolseTheme, type PoolseThemeProps, primitives as Primitives, ReactionPicker, type ReactionPickerProps, ReactionStrip, type ReactionStripProps, type ThemeColors, type ThemeRadii, type ThemeShadows, type ThemeSpacing, type ThemeType, ThreadView, type ThreadViewProps, TypingIndicator, type TypingIndicatorProps, UploadQueueStrip, UserName, type UserNameProps, defaultDarkTheme, defaultLightTheme, useAppStateLifecycle, useDisplayName, usePoolseTheme };
+/**
+ * React Native WebRTC binding, backed by `react-native-webrtc`.
+ *
+ * The module is passed IN rather than required here, and that is
+ * deliberate. Metro resolves dependencies statically, and this package
+ * is published through tsup, which rewrites a literal `require(...)`
+ * into a `__require(...)` call it cannot see — so bundling
+ * `react-native-webrtc` from inside this file never worked. It wasn't
+ * merely unavailable in Expo Go; it was absent from every bundle,
+ * development builds included, and surfaced as
+ * "Requiring unknown module react-native-webrtc" at runtime.
+ *
+ * Importing it in the app fixes that: Metro sees a static import in
+ * your source and bundles it. Optionality then lives where it belongs —
+ * an app that doesn't want voice simply never imports it, and never
+ * installs the native dependency.
+ *
+ *     import * as webrtc from 'react-native-webrtc';
+ *     <VoiceRoomBar conversationId={id} webrtc={webrtc} />
+ *
+ * Media streams on native aren't attached to an element the way they
+ * are on the web — audio-only calls route to the device's audio session
+ * once the peer connection is live, so the sink is a no-op. Video would
+ * render the stream through `<RTCView>` via the `toURL()` it exposes.
+ */
+
+/**
+ * The shape this binding needs from `react-native-webrtc`. The module's
+ * own namespace satisfies it, so `import * as webrtc` type-checks
+ * straight through.
+ */
+interface NativeWebRtcModule {
+    RTCPeerConnection: new (...args: never[]) => unknown;
+    mediaDevices: {
+        getUserMedia: (...args: never[]) => Promise<unknown>;
+    };
+}
+/**
+ * True when `mod` looks like a usable `react-native-webrtc`.
+ *
+ * Guards against a half-linked native module: in a bare Expo Go client
+ * the JS may load while the native side is missing, leaving
+ * `RTCPeerConnection` undefined.
+ */
+declare function isNativeWebRtcAvailable(mod: NativeWebRtcModule | null | undefined): boolean;
+/**
+ * Adapter for `useVoiceRoom`'s `webrtc` option.
+ *
+ * @param mod the `react-native-webrtc` module, imported by your app.
+ * @throws when `mod` isn't a usable binding — check
+ *         {@link isNativeWebRtcAvailable} first if that's reachable in
+ *         your UI.
+ */
+declare function createNativeWebRtcAdapter(mod: NativeWebRtcModule): WebRtcAdapter;
+
+interface VoiceRoomBarProps {
+    conversationId: string;
+    /**
+     * The `react-native-webrtc` module, imported by your app:
+     *
+     *     import * as webrtc from 'react-native-webrtc';
+     *
+     * Required for audio. Metro only bundles what it can see statically,
+     * so this package cannot import it for you — see `voice/webrtc-native`.
+     * Omit it and the bar renders its unavailable state, which is what you
+     * want in Expo Go.
+     */
+    webrtc?: NativeWebRtcModule | null;
+    /** Resolves a user id to a display label. Defaults to a short id. */
+    labelFor?: (userId: string) => string;
+    /**
+     * Rendered instead of the join button when `react-native-webrtc`
+     * isn't installed. Defaults to an inline explanation.
+     */
+    unavailableSlot?: React.ReactNode;
+}
+/**
+ * Discord-style voice bar: one "Join Voice" button that expands into a
+ * roster of who's in, with a ring around whoever is talking.
+ *
+ * Drop it above a `<ConversationView>` to give a conversation an
+ * always-on voice channel. For ringing a specific person, use
+ * `<IncomingCallSheet>` together with `useCalls`.
+ */
+declare function VoiceRoomBar({ conversationId, labelFor, unavailableSlot, webrtc, }: VoiceRoomBarProps): react_jsx_runtime.JSX.Element;
+
+interface CallScreenProps {
+    /** The signed-in user's id — the topic calls are delivered on. */
+    userId: string;
+    /** Resolves a user id to a display label. Defaults to a short id. */
+    labelFor?: (userId: string) => string;
+    /**
+     * Escape hatch for apps that already own a `useCalls` instance (for
+     * example to place calls from elsewhere in the UI). When omitted the
+     * component manages its own.
+     */
+    calls?: UseCalls;
+    /**
+     * The `react-native-webrtc` module, imported by your app. Required for
+     * call audio; without it the screen still rings and connects but warns
+     * that there is no audio. See {@link VoiceRoomBarProps.webrtc}.
+     */
+    webrtc?: NativeWebRtcModule | null;
+}
+/**
+ * WhatsApp-style call UI: a full-screen sheet that covers the app while
+ * a call is ringing or connected, and renders nothing when idle.
+ *
+ * Mount it once, high in the tree, so a call can arrive on any screen:
+ *
+ *     <PoolseProvider config={config}>
+ *       <CallScreen userId={me.id} />
+ *       <YourApp />
+ *     </PoolseProvider>
+ *
+ * Placing a call is separate — `useCalls().call(conversationId)`, wired
+ * to whatever button your UI wants. Pass the same instance in via
+ * `calls` so both halves share one state machine.
+ */
+declare function CallScreen({ userId, labelFor, calls: external, webrtc }: CallScreenProps): react_jsx_runtime.JSX.Element;
+
+export { AttachmentPicker, type AttachmentPickerProps, AttachmentPreview, type AttachmentPreviewProps, Avatar, type AvatarProps, CallScreen, type CallScreenProps, ChatHeader, type ChatHeaderProps, ConversationList, type ConversationListProps, ConversationView, type ConversationViewProps, DaySeparator, type DaySeparatorProps, GroupDetailsSheet, type GroupDetailsSheetProps, type IconName, ImageMosaic, type ImageMosaicProps, type InboxUser, MemberList, type MemberListProps, MentionInput, type MentionInputProps, MessageActions, type MessageActionsProps, MessageBubble, type MessageBubbleProps, MessageComposer, type MessageComposerProps, MessageList, type MessageListItem, type MessageListProps, MessageRow, type MessageRowProps, type NativeWebRtcModule, PoolseIcon, type PoolseIconProps, PoolseInbox, type PoolseInboxHandle, type PoolseInboxProps, PoolseLogo, type PoolseLogoProps, type PoolseLogoVariant, type PoolseRNTheme, type PoolseRNThemeOverrides, PoolseTheme, type PoolseThemeProps, primitives as Primitives, ReactionPicker, type ReactionPickerProps, ReactionStrip, type ReactionStripProps, type ThemeColors, type ThemeRadii, type ThemeShadows, type ThemeSpacing, type ThemeType, ThreadView, type ThreadViewProps, TypingIndicator, type TypingIndicatorProps, UploadQueueStrip, UserName, type UserNameProps, VoiceRoomBar, type VoiceRoomBarProps, createNativeWebRtcAdapter, defaultDarkTheme, defaultLightTheme, isNativeWebRtcAvailable, useAppStateLifecycle, useDisplayName, usePoolseTheme };

package/dist/index.d.ts

@@ -1,7 +1,8 @@
 import * as react from 'react';
 import { ReactNode, ReactElement } from 'react';
-import { Conversation, Uuid, Message, AttachmentUploadInput, Membership, Attachment } from '@poolse/sdk';
+import { Conversation, Uuid, Message, AttachmentUploadInput, Membership, Attachment, WebRtcAdapter } from '@poolse/sdk';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { UseCalls } from '@poolse/react';
 
 interface InboxUser {
     /** The user's external_id (the same id you mint JWTs with). */
@@ -976,4 +977,125 @@ declare const defaultDarkTheme: PoolseRNTheme;
  */
 declare function useAppStateLifecycle(): void;
 
-export { AttachmentPicker, type AttachmentPickerProps, AttachmentPreview, type AttachmentPreviewProps, Avatar, type AvatarProps, ChatHeader, type ChatHeaderProps, ConversationList, type ConversationListProps, ConversationView, type ConversationViewProps, DaySeparator, type DaySeparatorProps, GroupDetailsSheet, type GroupDetailsSheetProps, type IconName, ImageMosaic, type ImageMosaicProps, type InboxUser, MemberList, type MemberListProps, MentionInput, type MentionInputProps, MessageActions, type MessageActionsProps, MessageBubble, type MessageBubbleProps, MessageComposer, type MessageComposerProps, MessageList, type MessageListItem, type MessageListProps, MessageRow, type MessageRowProps, PoolseIcon, type PoolseIconProps, PoolseInbox, type PoolseInboxHandle, type PoolseInboxProps, PoolseLogo, type PoolseLogoProps, type PoolseLogoVariant, type PoolseRNTheme, type PoolseRNThemeOverrides, PoolseTheme, type PoolseThemeProps, primitives as Primitives, ReactionPicker, type ReactionPickerProps, ReactionStrip, type ReactionStripProps, type ThemeColors, type ThemeRadii, type ThemeShadows, type ThemeSpacing, type ThemeType, ThreadView, type ThreadViewProps, TypingIndicator, type TypingIndicatorProps, UploadQueueStrip, UserName, type UserNameProps, defaultDarkTheme, defaultLightTheme, useAppStateLifecycle, useDisplayName, usePoolseTheme };
+/**
+ * React Native WebRTC binding, backed by `react-native-webrtc`.
+ *
+ * The module is passed IN rather than required here, and that is
+ * deliberate. Metro resolves dependencies statically, and this package
+ * is published through tsup, which rewrites a literal `require(...)`
+ * into a `__require(...)` call it cannot see — so bundling
+ * `react-native-webrtc` from inside this file never worked. It wasn't
+ * merely unavailable in Expo Go; it was absent from every bundle,
+ * development builds included, and surfaced as
+ * "Requiring unknown module react-native-webrtc" at runtime.
+ *
+ * Importing it in the app fixes that: Metro sees a static import in
+ * your source and bundles it. Optionality then lives where it belongs —
+ * an app that doesn't want voice simply never imports it, and never
+ * installs the native dependency.
+ *
+ *     import * as webrtc from 'react-native-webrtc';
+ *     <VoiceRoomBar conversationId={id} webrtc={webrtc} />
+ *
+ * Media streams on native aren't attached to an element the way they
+ * are on the web — audio-only calls route to the device's audio session
+ * once the peer connection is live, so the sink is a no-op. Video would
+ * render the stream through `<RTCView>` via the `toURL()` it exposes.
+ */
+
+/**
+ * The shape this binding needs from `react-native-webrtc`. The module's
+ * own namespace satisfies it, so `import * as webrtc` type-checks
+ * straight through.
+ */
+interface NativeWebRtcModule {
+    RTCPeerConnection: new (...args: never[]) => unknown;
+    mediaDevices: {
+        getUserMedia: (...args: never[]) => Promise<unknown>;
+    };
+}
+/**
+ * True when `mod` looks like a usable `react-native-webrtc`.
+ *
+ * Guards against a half-linked native module: in a bare Expo Go client
+ * the JS may load while the native side is missing, leaving
+ * `RTCPeerConnection` undefined.
+ */
+declare function isNativeWebRtcAvailable(mod: NativeWebRtcModule | null | undefined): boolean;
+/**
+ * Adapter for `useVoiceRoom`'s `webrtc` option.
+ *
+ * @param mod the `react-native-webrtc` module, imported by your app.
+ * @throws when `mod` isn't a usable binding — check
+ *         {@link isNativeWebRtcAvailable} first if that's reachable in
+ *         your UI.
+ */
+declare function createNativeWebRtcAdapter(mod: NativeWebRtcModule): WebRtcAdapter;
+
+interface VoiceRoomBarProps {
+    conversationId: string;
+    /**
+     * The `react-native-webrtc` module, imported by your app:
+     *
+     *     import * as webrtc from 'react-native-webrtc';
+     *
+     * Required for audio. Metro only bundles what it can see statically,
+     * so this package cannot import it for you — see `voice/webrtc-native`.
+     * Omit it and the bar renders its unavailable state, which is what you
+     * want in Expo Go.
+     */
+    webrtc?: NativeWebRtcModule | null;
+    /** Resolves a user id to a display label. Defaults to a short id. */
+    labelFor?: (userId: string) => string;
+    /**
+     * Rendered instead of the join button when `react-native-webrtc`
+     * isn't installed. Defaults to an inline explanation.
+     */
+    unavailableSlot?: React.ReactNode;
+}
+/**
+ * Discord-style voice bar: one "Join Voice" button that expands into a
+ * roster of who's in, with a ring around whoever is talking.
+ *
+ * Drop it above a `<ConversationView>` to give a conversation an
+ * always-on voice channel. For ringing a specific person, use
+ * `<IncomingCallSheet>` together with `useCalls`.
+ */
+declare function VoiceRoomBar({ conversationId, labelFor, unavailableSlot, webrtc, }: VoiceRoomBarProps): react_jsx_runtime.JSX.Element;
+
+interface CallScreenProps {
+    /** The signed-in user's id — the topic calls are delivered on. */
+    userId: string;
+    /** Resolves a user id to a display label. Defaults to a short id. */
+    labelFor?: (userId: string) => string;
+    /**
+     * Escape hatch for apps that already own a `useCalls` instance (for
+     * example to place calls from elsewhere in the UI). When omitted the
+     * component manages its own.
+     */
+    calls?: UseCalls;
+    /**
+     * The `react-native-webrtc` module, imported by your app. Required for
+     * call audio; without it the screen still rings and connects but warns
+     * that there is no audio. See {@link VoiceRoomBarProps.webrtc}.
+     */
+    webrtc?: NativeWebRtcModule | null;
+}
+/**
+ * WhatsApp-style call UI: a full-screen sheet that covers the app while
+ * a call is ringing or connected, and renders nothing when idle.
+ *
+ * Mount it once, high in the tree, so a call can arrive on any screen:
+ *
+ *     <PoolseProvider config={config}>
+ *       <CallScreen userId={me.id} />
+ *       <YourApp />
+ *     </PoolseProvider>
+ *
+ * Placing a call is separate — `useCalls().call(conversationId)`, wired
+ * to whatever button your UI wants. Pass the same instance in via
+ * `calls` so both halves share one state machine.
+ */
+declare function CallScreen({ userId, labelFor, calls: external, webrtc }: CallScreenProps): react_jsx_runtime.JSX.Element;
+
+export { AttachmentPicker, type AttachmentPickerProps, AttachmentPreview, type AttachmentPreviewProps, Avatar, type AvatarProps, CallScreen, type CallScreenProps, ChatHeader, type ChatHeaderProps, ConversationList, type ConversationListProps, ConversationView, type ConversationViewProps, DaySeparator, type DaySeparatorProps, GroupDetailsSheet, type GroupDetailsSheetProps, type IconName, ImageMosaic, type ImageMosaicProps, type InboxUser, MemberList, type MemberListProps, MentionInput, type MentionInputProps, MessageActions, type MessageActionsProps, MessageBubble, type MessageBubbleProps, MessageComposer, type MessageComposerProps, MessageList, type MessageListItem, type MessageListProps, MessageRow, type MessageRowProps, type NativeWebRtcModule, PoolseIcon, type PoolseIconProps, PoolseInbox, type PoolseInboxHandle, type PoolseInboxProps, PoolseLogo, type PoolseLogoProps, type PoolseLogoVariant, type PoolseRNTheme, type PoolseRNThemeOverrides, PoolseTheme, type PoolseThemeProps, primitives as Primitives, ReactionPicker, type ReactionPickerProps, ReactionStrip, type ReactionStripProps, type ThemeColors, type ThemeRadii, type ThemeShadows, type ThemeSpacing, type ThemeType, ThreadView, type ThreadViewProps, TypingIndicator, type TypingIndicatorProps, UploadQueueStrip, UserName, type UserNameProps, VoiceRoomBar, type VoiceRoomBarProps, createNativeWebRtcAdapter, defaultDarkTheme, defaultLightTheme, isNativeWebRtcAvailable, useAppStateLifecycle, useDisplayName, usePoolseTheme };

package/dist/index.js

@@ -1,4 +1,4 @@
-import { useUser, useMe, useConversations, useAttachmentUpload, useConversation, useMembers, usePresence, useMessages, useTyping, useRealtimeStatus, computeGroupPosition, formatDayLabel, useReactions, sameDay, useThread, useAttachmentUrl, usePoolse } from '@poolse/react';
+import { useUser, useMe, useConversations, useAttachmentUpload, useConversation, useMembers, usePresence, useMessages, useTyping, useRealtimeStatus, computeGroupPosition, formatDayLabel, useReactions, sameDay, useThread, useAttachmentUrl, usePoolse, useVoiceRoom, useCalls } from '@poolse/react';
 import { createContext, forwardRef, useRef, useState, useEffect, useImperativeHandle, useMemo, useCallback, useContext, createElement } from 'react';
 import { StyleSheet, Platform, Keyboard, View, Pressable, TextInput, Text, useWindowDimensions, Animated, Easing, PanResponder, Image, ScrollView, ActivityIndicator, FlatList, AppState, KeyboardAvoidingView, Modal, Dimensions, Linking } from 'react-native';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
@@ -4914,6 +4914,287 @@ function useAppStateLifecycle() {
   }, [poolse]);
 }
 
-export { AttachmentPicker, AttachmentPreview, Avatar, ChatHeader, ConversationList, ConversationView, DaySeparator, GroupDetailsSheet, ImageMosaic, MemberList, MentionInput, MessageActions, MessageBubble, MessageComposer, MessageList, MessageRow, PoolseIcon, PoolseInbox, PoolseLogo, PoolseTheme, primitives as Primitives, ReactionPicker, ReactionStrip, ThreadView, TypingIndicator, UploadQueueStrip, UserName, defaultDarkTheme, defaultLightTheme, useAppStateLifecycle, useDisplayName, usePoolseTheme };
+// src/voice/webrtc-native.ts
+function isNativeWebRtcAvailable(mod) {
+  return typeof mod?.RTCPeerConnection === "function" && mod?.mediaDevices != null;
+}
+function createNativeWebRtcAdapter(mod) {
+  if (!isNativeWebRtcAvailable(mod)) {
+    throw new Error(
+      "react-native-webrtc is missing or not linked. Install it and rebuild:\n  npx expo install react-native-webrtc\nIt contains native code, so it needs a development build \u2014 it will not run in Expo Go."
+    );
+  }
+  const rtc = mod;
+  return {
+    createPeerConnection(iceServers) {
+      return new rtc.RTCPeerConnection({ iceServers });
+    },
+    getUserMedia() {
+      return rtc.mediaDevices.getUserMedia({
+        audio: { echoCancellation: true, noiseSuppression: true },
+        video: false
+      });
+    },
+    playRemoteStream() {
+      return () => {
+      };
+    }
+  };
+}
+function VoiceRoomBar({
+  conversationId,
+  labelFor,
+  unavailableSlot,
+  webrtc
+}) {
+  const theme = usePoolseTheme();
+  const available = isNativeWebRtcAvailable(webrtc);
+  const opts = useMemo(
+    () => available && webrtc ? { webrtc: createNativeWebRtcAdapter(webrtc) } : {},
+    [available, webrtc]
+  );
+  const { status, participants, muted, join, leave, toggleMute, error } = useVoiceRoom(
+    available ? conversationId : null,
+    opts
+  );
+  const label = labelFor ?? ((id) => `User ${id.slice(0, 6)}`);
+  const connected = status === "connected";
+  if (!available) {
+    return /* @__PURE__ */ jsx(
+      View,
+      {
+        style: [
+          styles23.bar,
+          { backgroundColor: theme.colors.surface, borderBottomColor: theme.colors.border }
+        ],
+        children: unavailableSlot ?? /* @__PURE__ */ jsx(Text, { style: [styles23.hint, { color: theme.colors.ink3 }], children: "Voice needs react-native-webrtc and a development build." })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: [
+        styles23.bar,
+        { backgroundColor: theme.colors.surface, borderBottomColor: theme.colors.border }
+      ],
+      children: [
+        /* @__PURE__ */ jsxs(View, { style: styles23.row, children: [
+          /* @__PURE__ */ jsx(
+            View,
+            {
+              style: [
+                styles23.dot,
+                { backgroundColor: connected ? theme.colors.brand : theme.colors.ink3 }
+              ]
+            }
+          ),
+          connected ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(View, { style: styles23.people, children: participants.length === 0 ? /* @__PURE__ */ jsx(Text, { style: [styles23.hint, { color: theme.colors.ink3 }], children: "Waiting for others\u2026" }) : participants.map((p) => /* @__PURE__ */ jsx(ParticipantChip, { participant: p, label: label(p.userId) }, p.userId)) }),
+            /* @__PURE__ */ jsx(
+              Pressable,
+              {
+                onPress: toggleMute,
+                accessibilityRole: "button",
+                accessibilityState: { selected: muted },
+                style: [
+                  styles23.btn,
+                  {
+                    borderColor: muted ? theme.colors.brand : theme.colors.border,
+                    backgroundColor: muted ? theme.colors.brandSoft : theme.colors.paper
+                  }
+                ],
+                children: /* @__PURE__ */ jsx(Text, { style: { color: theme.colors.ink2 }, children: muted ? "Unmute" : "Mute" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Pressable,
+              {
+                onPress: leave,
+                accessibilityRole: "button",
+                style: [styles23.btn, { borderColor: theme.colors.error }],
+                children: /* @__PURE__ */ jsx(Text, { style: { color: theme.colors.error }, children: "Leave" })
+              }
+            )
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Text, { style: [styles23.hint, { color: theme.colors.ink3 }], children: status === "connecting" ? "Connecting\u2026" : "Talk to everyone here" }),
+            /* @__PURE__ */ jsx(
+              Pressable,
+              {
+                onPress: () => void join(),
+                disabled: status === "connecting",
+                accessibilityRole: "button",
+                style: [styles23.btn, styles23.btnPrimary, { backgroundColor: theme.colors.brand }],
+                children: /* @__PURE__ */ jsx(Text, { style: { color: theme.colors.onBrand, fontWeight: "600" }, children: status === "connecting" ? "Joining\u2026" : "Join Voice" })
+              }
+            )
+          ] })
+        ] }),
+        error && /* @__PURE__ */ jsx(Text, { style: [styles23.error, { color: theme.colors.error }], children: error.message })
+      ]
+    }
+  );
+}
+function ParticipantChip({ participant, label }) {
+  const theme = usePoolseTheme();
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: [
+        styles23.chip,
+        {
+          backgroundColor: theme.colors.paper,
+          // The speaking ring is a border colour swap rather than an
+          // extra element, so the row never reflows mid-sentence.
+          borderColor: participant.speaking ? theme.colors.brand : theme.colors.border,
+          opacity: participant.muted ? 0.62 : 1
+        }
+      ],
+      children: [
+        /* @__PURE__ */ jsxs(Text, { style: { color: theme.colors.ink2, fontSize: 13 }, numberOfLines: 1, children: [
+          label,
+          participant.isSelf ? " (you)" : ""
+        ] }),
+        participant.muted && /* @__PURE__ */ jsx(Text, { style: { color: theme.colors.error, fontSize: 11, fontWeight: "700" }, children: "\u2715" })
+      ]
+    }
+  );
+}
+var styles23 = StyleSheet.create({
+  bar: { paddingHorizontal: 14, paddingVertical: 8, borderBottomWidth: StyleSheet.hairlineWidth },
+  row: { flexDirection: "row", alignItems: "center", gap: 8, flexWrap: "wrap" },
+  dot: { width: 8, height: 8, borderRadius: 4 },
+  people: { flexDirection: "row", alignItems: "center", gap: 6, flexShrink: 1, flexWrap: "wrap" },
+  chip: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 5,
+    paddingHorizontal: 10,
+    paddingVertical: 4,
+    borderRadius: 999,
+    borderWidth: 1
+  },
+  btn: { paddingHorizontal: 12, paddingVertical: 6, borderRadius: 999, borderWidth: 1 },
+  btnPrimary: { borderWidth: 0 },
+  hint: { fontSize: 13, flexShrink: 1 },
+  error: { fontSize: 12, marginTop: 6 }
+});
+function CallScreen({ userId, labelFor, calls: external, webrtc }) {
+  const theme = usePoolseTheme();
+  const own = useCalls(external ? null : userId);
+  const calls = external ?? own;
+  const available = isNativeWebRtcAvailable(webrtc);
+  const opts = useMemo(
+    () => available && webrtc ? { webrtc: createNativeWebRtcAdapter(webrtc) } : {},
+    [available, webrtc]
+  );
+  const voice = useVoiceRoom(
+    calls.phase === "active" && available ? calls.activeConversationId : null,
+    opts
+  );
+  useEffect(() => {
+    if (calls.phase === "active" && voice.status === "idle") void voice.join();
+  }, [calls.phase, voice]);
+  const label = labelFor ?? ((id) => `User ${id.slice(0, 6)}`);
+  const visible = calls.phase !== "idle";
+  const hangUp = () => {
+    voice.leave();
+    calls.reset();
+  };
+  return /* @__PURE__ */ jsx(Modal, { visible, animationType: "slide", transparent: false, onRequestClose: hangUp, children: /* @__PURE__ */ jsxs(View, { style: [styles24.screen, { backgroundColor: theme.colors.paper }], children: [
+    /* @__PURE__ */ jsxs(View, { style: styles24.identity, children: [
+      /* @__PURE__ */ jsx(Text, { style: [styles24.who, { color: theme.colors.ink }], children: calls.phase === "ringing-in" && calls.incoming ? label(calls.incoming.callerUserId) : calls.outgoing ? calls.outgoing.calleeUserIds.map(label).join(", ") : "" }),
+      /* @__PURE__ */ jsx(Text, { style: [styles24.state, { color: theme.colors.ink3 }], children: statusLine(calls, voice.status) })
+    ] }),
+    /* @__PURE__ */ jsx(View, { style: styles24.actions, children: calls.phase === "ringing-in" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        CallButton,
+        {
+          label: "Decline",
+          color: theme.colors.error,
+          onPress: () => void calls.decline()
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        CallButton,
+        {
+          label: "Accept",
+          color: theme.colors.brand,
+          onPress: () => void calls.accept()
+        }
+      )
+    ] }) : calls.phase === "ringing-out" ? /* @__PURE__ */ jsx(
+      CallButton,
+      {
+        label: "Cancel",
+        color: theme.colors.error,
+        onPress: () => void calls.cancel()
+      }
+    ) : calls.phase === "declined" || calls.phase === "busy" || calls.phase === "timed-out" ? /* @__PURE__ */ jsx(CallButton, { label: "Close", color: theme.colors.ink3, onPress: calls.reset }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        CallButton,
+        {
+          label: voice.muted ? "Unmute" : "Mute",
+          color: theme.colors.ink2,
+          onPress: voice.toggleMute
+        }
+      ),
+      /* @__PURE__ */ jsx(CallButton, { label: "Hang up", color: theme.colors.error, onPress: hangUp })
+    ] }) }),
+    !available && /* @__PURE__ */ jsx(Text, { style: [styles24.warn, { color: theme.colors.error }], children: "react-native-webrtc is not installed \u2014 this call has no audio." }),
+    (calls.error ?? voice.error) && /* @__PURE__ */ jsx(Text, { style: [styles24.warn, { color: theme.colors.error }], children: (calls.error ?? voice.error)?.message })
+  ] }) });
+}
+function statusLine(calls, voiceStatus) {
+  switch (calls.phase) {
+    case "ringing-in":
+      return "Incoming call\u2026";
+    case "ringing-out":
+      return "Ringing\u2026";
+    case "declined":
+      return "Call declined";
+    case "busy":
+      return "Already on another call";
+    case "timed-out":
+      return "No answer";
+    case "active":
+      return voiceStatus === "connected" ? "Connected" : "Connecting\u2026";
+    default:
+      return "";
+  }
+}
+function CallButton({
+  label,
+  color,
+  onPress
+}) {
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      onPress,
+      accessibilityRole: "button",
+      style: [styles24.callBtn, { backgroundColor: color }],
+      children: /* @__PURE__ */ jsx(Text, { style: styles24.callBtnText, children: label })
+    }
+  );
+}
+var styles24 = StyleSheet.create({
+  screen: { flex: 1, justifyContent: "space-between", paddingVertical: 72, paddingHorizontal: 24 },
+  identity: { alignItems: "center", gap: 8, marginTop: 48 },
+  who: { fontSize: 28, fontWeight: "600", textAlign: "center" },
+  state: { fontSize: 15 },
+  actions: { flexDirection: "row", justifyContent: "center", gap: 16 },
+  callBtn: {
+    paddingHorizontal: 26,
+    paddingVertical: 16,
+    borderRadius: 999,
+    minWidth: 128,
+    alignItems: "center"
+  },
+  callBtnText: { color: "#ffffff", fontSize: 16, fontWeight: "600" },
+  warn: { fontSize: 12, textAlign: "center", marginTop: 12 }
+});
+
+export { AttachmentPicker, AttachmentPreview, Avatar, CallScreen, ChatHeader, ConversationList, ConversationView, DaySeparator, GroupDetailsSheet, ImageMosaic, MemberList, MentionInput, MessageActions, MessageBubble, MessageComposer, MessageList, MessageRow, PoolseIcon, PoolseInbox, PoolseLogo, PoolseTheme, primitives as Primitives, ReactionPicker, ReactionStrip, ThreadView, TypingIndicator, UploadQueueStrip, UserName, VoiceRoomBar, createNativeWebRtcAdapter, defaultDarkTheme, defaultLightTheme, isNativeWebRtcAvailable, useAppStateLifecycle, useDisplayName, usePoolseTheme };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map