@cometchat/calls-sdk-react-native 5.0.0-beta.7 → 5.0.0-beta.8

package/dist/index.d.mts

@@ -754,6 +754,38 @@ declare const getMainParticipantFromState: (state: {
   localParticipant: HumanParticipant;
 }) => Participant$2;
 //#endregion
+//#region calls-sdk-core/store/toast.d.ts
+interface ToastAction {
+  label: string;
+  onPress: () => void;
+}
+interface ToastItem {
+  id: string;
+  message: string;
+  type: NotificationType;
+  duration: number;
+  position: 'top' | 'bottom';
+  action?: ToastAction;
+  createdAt: number;
+}
+interface ToastState {
+  toasts: ToastItem[];
+}
+interface ToastActions {
+  addToast: (toast: Omit<ToastItem, 'id' | 'createdAt'>) => string;
+  removeToast: (id: string) => void;
+  clearAll: () => void;
+  reset: () => void;
+}
+declare const useToastStore: zustand7.UseBoundStore<zustand7.StoreApi<ToastState & ToastActions>>;
+declare function showToast(params: {
+  message: string;
+  type?: NotificationType;
+  duration?: number;
+  position?: 'top' | 'bottom';
+  action?: ToastAction;
+}): string;
+//#endregion
 //#region calls-sdk-core/store/tracks.d.ts
 type Track = {
   local: boolean;
@@ -2660,7 +2692,7 @@ interface AppProps extends Partial<ConfigStateMobile & ConfigStateBoth> {
   /**
    * @deprecated Use `sessionSettings` instead.
    */
-  callSettings: CallSettings | Partial<ConfigStateMobile & ConfigStateBoth>;
+  callSettings?: CallSettings | Partial<ConfigStateMobile & ConfigStateBoth>;
   sessionSettings?: CallSettings | Partial<ConfigStateMobile & ConfigStateBoth>;
 }
 declare function AppReactNativeSDK(props: AppProps): React.JSX.Element;

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import * as zustand0 from "zustand";
+import * as zustand3 from "zustand";
 import * as zustand_middleware0 from "zustand/middleware";
 import { AppStateStatus } from "react-native";
 import JitsiMeetJS from "lib-jitsi-meet";
@@ -373,7 +373,7 @@ type Actions$5 = {
   isMobileSDK: () => boolean;
   isMobile: () => boolean;
 };
-declare const useBaseStore: zustand0.UseBoundStore<Omit<Omit<zustand0.StoreApi<BaseState & Actions$5>, "subscribe"> & {
+declare const useBaseStore: zustand3.UseBoundStore<Omit<Omit<zustand3.StoreApi<BaseState & Actions$5>, "subscribe"> & {
   subscribe: {
     (listener: (selectedState: BaseState & Actions$5, previousSelectedState: BaseState & Actions$5) => void): () => void;
     <U>(selector: (state: BaseState & Actions$5) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
@@ -453,7 +453,7 @@ type Actions$4 = {
   endConference: () => Promise<void>;
   stopRecording: () => Promise<void>;
 };
-declare const useConferenceStore: zustand0.UseBoundStore<Omit<zustand0.StoreApi<ConferenceState & Actions$4>, "subscribe"> & {
+declare const useConferenceStore: zustand3.UseBoundStore<Omit<zustand3.StoreApi<ConferenceState & Actions$4>, "subscribe"> & {
   subscribe: {
     (listener: (selectedState: ConferenceState & Actions$4, previousSelectedState: ConferenceState & Actions$4) => void): () => void;
     <U>(selector: (state: ConferenceState & Actions$4) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
@@ -529,7 +529,7 @@ type ConfigState = ConfigStateInternal & ConfigStateMobile & ConfigStateWeb & Co
 type Actions$3 = {
   reset: () => void;
 };
-declare const useConfigStore: zustand0.UseBoundStore<Omit<zustand0.StoreApi<ConfigStateInternal & ConfigStateMobile & ConfigStateWeb & ConfigStateBoth & Actions$3>, "subscribe"> & {
+declare const useConfigStore: zustand3.UseBoundStore<Omit<zustand3.StoreApi<ConfigStateInternal & ConfigStateMobile & ConfigStateWeb & ConfigStateBoth & Actions$3>, "subscribe"> & {
   subscribe: {
     (listener: (selectedState: ConfigStateInternal & ConfigStateMobile & ConfigStateWeb & ConfigStateBoth & Actions$3, previousSelectedState: ConfigStateInternal & ConfigStateMobile & ConfigStateWeb & ConfigStateBoth & Actions$3) => void): () => void;
     <U>(selector: (state: ConfigStateInternal & ConfigStateMobile & ConfigStateWeb & ConfigStateBoth & Actions$3) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
@@ -681,7 +681,7 @@ type Actions$2 = {
   disconnect: () => Promise<void>;
   reset: () => void;
 };
-declare const useConnectionStore: zustand0.UseBoundStore<Omit<zustand0.StoreApi<ConnectionState & Actions$2>, "subscribe"> & {
+declare const useConnectionStore: zustand3.UseBoundStore<Omit<zustand3.StoreApi<ConnectionState & Actions$2>, "subscribe"> & {
   subscribe: {
     (listener: (selectedState: ConnectionState & Actions$2, previousSelectedState: ConnectionState & Actions$2) => void): () => void;
     <U>(selector: (state: ConnectionState & Actions$2) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
@@ -732,7 +732,7 @@ type Actions$1 = {
   getParticipantById: (pid: string) => HumanParticipant | undefined;
   reset: () => void;
 };
-declare const useParticipantStore: zustand0.UseBoundStore<Omit<zustand0.StoreApi<ParticipantsState & Actions$1>, "subscribe"> & {
+declare const useParticipantStore: zustand3.UseBoundStore<Omit<zustand3.StoreApi<ParticipantsState & Actions$1>, "subscribe"> & {
   subscribe: {
     (listener: (selectedState: ParticipantsState & Actions$1, previousSelectedState: ParticipantsState & Actions$1) => void): () => void;
     <U>(selector: (state: ParticipantsState & Actions$1) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
@@ -754,6 +754,38 @@ declare const getMainParticipantFromState: (state: {
   localParticipant: HumanParticipant;
 }) => Participant$2;
 //#endregion
+//#region calls-sdk-core/store/toast.d.ts
+interface ToastAction {
+  label: string;
+  onPress: () => void;
+}
+interface ToastItem {
+  id: string;
+  message: string;
+  type: NotificationType;
+  duration: number;
+  position: 'top' | 'bottom';
+  action?: ToastAction;
+  createdAt: number;
+}
+interface ToastState {
+  toasts: ToastItem[];
+}
+interface ToastActions {
+  addToast: (toast: Omit<ToastItem, 'id' | 'createdAt'>) => string;
+  removeToast: (id: string) => void;
+  clearAll: () => void;
+  reset: () => void;
+}
+declare const useToastStore: zustand3.UseBoundStore<zustand3.StoreApi<ToastState & ToastActions>>;
+declare function showToast(params: {
+  message: string;
+  type?: NotificationType;
+  duration?: number;
+  position?: 'top' | 'bottom';
+  action?: ToastAction;
+}): string;
+//#endregion
 //#region calls-sdk-core/store/tracks.d.ts
 type Track = {
   local: boolean;
@@ -778,7 +810,7 @@ type Actions = {
   updateTrack: (originalTrack: any, updatedTrack: Partial<Track>) => void;
   updateLocalTrack: (mediaType: MediaType, updatedTrack: Partial<Track>) => void;
 };
-declare const useTracksStore: zustand0.UseBoundStore<Omit<zustand0.StoreApi<TracksState & Actions>, "subscribe"> & {
+declare const useTracksStore: zustand3.UseBoundStore<Omit<zustand3.StoreApi<TracksState & Actions>, "subscribe"> & {
   subscribe: {
     (listener: (selectedState: TracksState & Actions, previousSelectedState: TracksState & Actions) => void): () => void;
     <U>(selector: (state: TracksState & Actions) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
@@ -1270,7 +1302,7 @@ interface TranslationState {
   translations: Record<string, typeof __json_default_export>;
   currentLocale: CometChatSupportedLocale | Omit<string, CometChatSupportedLocale>;
 }
-declare const useTranslationStore: zustand0.UseBoundStore<Omit<zustand0.StoreApi<Omit<TranslationState, "reset" | "setLocale"> & {
+declare const useTranslationStore: zustand3.UseBoundStore<Omit<zustand3.StoreApi<Omit<TranslationState, "reset" | "setLocale"> & {
   reset: () => void;
   setLocale: (locale: CometChatSupportedLocale) => void;
 }>, "subscribe"> & {
@@ -2660,7 +2692,7 @@ interface AppProps extends Partial<ConfigStateMobile & ConfigStateBoth> {
   /**
    * @deprecated Use `sessionSettings` instead.
    */
-  callSettings: CallSettings | Partial<ConfigStateMobile & ConfigStateBoth>;
+  callSettings?: CallSettings | Partial<ConfigStateMobile & ConfigStateBoth>;
   sessionSettings?: CallSettings | Partial<ConfigStateMobile & ConfigStateBoth>;
 }
 declare function AppReactNativeSDK(props: AppProps): React.JSX.Element;

package/dist/index.js

@@ -969,7 +969,7 @@ function sendParticipantListChangedEvent() {
 
 //#endregion
 //#region calls-sdk-core/store/config.ts
-const initialState$7 = {
+const initialState$8 = {
 	sessionType: "VIDEO",
 	autoStartRecording: false,
 	layout: LAYOUT.TILE,
@@ -1007,7 +1007,7 @@ const initialState$7 = {
 	enableCompanionMode: false,
 	isPeerCall: false
 };
-const useConfigStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$7, (set) => ({ reset: () => set(initialState$7) }))));
+const useConfigStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$8, (set) => ({ reset: () => set(initialState$8) }))));
 const setConfig = (config) => {
 	useConfigStore.setState(config);
 };
@@ -1025,13 +1025,13 @@ const initialLocalParticipant = {
 	type: "human",
 	uid: "unknown"
 };
-const initialState$6 = {
+const initialState$7 = {
 	dominantSpeakers: [],
 	localParticipant: initialLocalParticipant,
 	participants: [],
 	virtualParticipants: []
 };
-const useParticipantStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$6, (set, get$1) => ({
+const useParticipantStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$7, (set, get$1) => ({
 	addParticipant: (participant) => {
 		set((state) => ({ participants: state.participants.some((p) => p.pid === participant.pid) ? state.participants.map((p) => p.pid === participant.pid ? {
 			...p,
@@ -1112,7 +1112,7 @@ const useParticipantStore = (0, zustand.create)()((0, zustand_middleware.subscri
 		}
 		return get$1().participants.find((p) => p.pid === pid);
 	},
-	reset: () => set(initialState$6)
+	reset: () => set(initialState$7)
 }))));
 function useAllParticipants() {
 	const localParticipant = useParticipantStore((state) => state.localParticipant);
@@ -1246,7 +1246,7 @@ useParticipantStore.subscribe((state) => state.participants.filter((p) => p.uid)
 
 //#endregion
 //#region calls-sdk-core/store/conference.ts
-const initialState$5 = {
+const initialState$6 = {
 	conference: null,
 	conferenceJoined: false,
 	conferenceJoinedAt: null,
@@ -1261,7 +1261,7 @@ const initialState$5 = {
 	},
 	isRecording: false
 };
-const useConferenceStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$5, (set) => ({
+const useConferenceStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$6, (set) => ({
 	conferenceWillJoin: (conference) => {
 		if (typeof window?.APP !== "undefined") {
 			window.APP.conference._room = conference;
@@ -1272,7 +1272,7 @@ const useConferenceStore = (0, zustand.create)()((0, zustand_middleware.subscrib
 		});
 	},
 	reset: () => {
-		set(initialState$5);
+		set(initialState$6);
 	},
 	raiseHand: (participantId, timestamp) => {
 		set((state) => ({ raiseHandMap: new Map(state.raiseHandMap).set(participantId, timestamp) }));
@@ -1446,7 +1446,7 @@ useConferenceStore.subscribe((state) => state.conference, (conference) => {
 
 //#endregion
 //#region calls-sdk-core/store/tracks.ts
-const initialState$4 = {
+const initialState$5 = {
 	tracks: [],
 	permissions: {
 		audio: false,
@@ -1454,9 +1454,9 @@ const initialState$4 = {
 		initialized: false
 	}
 };
-const useTracksStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$4, (set, get$1) => ({
+const useTracksStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$5, (set, get$1) => ({
 	reset: () => set({
-		...initialState$4,
+		...initialState$5,
 		permissions: get$1().permissions
 	}),
 	addTrack: (originalTrack) => set((state) => {
@@ -1838,7 +1838,7 @@ function updateConfig(config) {
 
 //#endregion
 //#region calls-sdk-core/store/base.ts
-const initialState$3 = {
+const initialState$4 = {
 	audioModeMenuVisible: false,
 	audioModes: [],
 	audioInputDevices: [],
@@ -1885,12 +1885,12 @@ const initialState$3 = {
 		endIndex: 0
 	}
 };
-const useBaseStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.persist)((0, zustand_middleware.combine)(initialState$3, (set, get$1) => ({
+const useBaseStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.persist)((0, zustand_middleware.combine)(initialState$4, (set, get$1) => ({
 	addSubscriptions: (subscriptions) => {
 		useBaseStore.setState((state) => ({ subscriptions: [...state.subscriptions, ...subscriptions] }));
 	},
 	reset: () => set((state) => ({
-		...initialState$3,
+		...initialState$4,
 		audioInputDevice: state.audioInputDevice,
 		audioOutputDevice: state.audioOutputDevice,
 		videoInputDevice: state.videoInputDevice,
@@ -2125,13 +2125,13 @@ initBaseStoreSubscriptions();
 
 //#endregion
 //#region calls-sdk-core/store/connection.ts
-const initialState$2 = {
+const initialState$3 = {
 	connection: undefined,
 	connectionStatus: "initial",
 	error: undefined,
 	timeEstablished: undefined
 };
-const useConnectionStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$2, (set) => ({
+const useConnectionStore = (0, zustand.create)()((0, zustand_middleware.subscribeWithSelector)((0, zustand_middleware.combine)(initialState$3, (set) => ({
 	connectionEstablished: (connection) => set({
 		connection,
 		connectionStatus: "connected",
@@ -2164,10 +2164,10 @@ const useConnectionStore = (0, zustand.create)()((0, zustand_middleware.subscrib
 			eventBus.stopEmitting();
 			await tryCatch(connection.disconnect());
 			eventBus.publish({ type: EVENT_LISTENER_METHODS.SessionStatusListener.onConnectionClosed }, true);
-			set(initialState$2);
+			set(initialState$3);
 		}
 	},
-	reset: () => set(initialState$2)
+	reset: () => set(initialState$3)
 }))));
 function waitForConnection() {
 	const { connectionStatus } = useConnectionStore.getState();
@@ -2191,6 +2191,52 @@ function waitForConnection() {
 	});
 }
 
+//#endregion
+//#region calls-sdk-core/store/toast.ts
+const MAX_TOASTS = 3;
+const initialState$2 = { toasts: [] };
+let counter = 0;
+const useToastStore = (0, zustand.create)((set) => ({
+	...initialState$2,
+	addToast: (toast) => {
+		if (!getIsConferenceJoined()) {
+			return "";
+		}
+		const id = `toast-${++counter}-${Date.now()}`;
+		const newToast = {
+			...toast,
+			id,
+			createdAt: Date.now()
+		};
+		set((state) => {
+			const updated = [...state.toasts, newToast];
+			if (updated.length > MAX_TOASTS) {
+				return { toasts: updated.slice(-MAX_TOASTS) };
+			}
+			return { toasts: updated };
+		});
+		return id;
+	},
+	removeToast: (id) => {
+		set((state) => ({ toasts: state.toasts.filter((t) => t.id !== id) }));
+	},
+	clearAll: () => {
+		set(initialState$2);
+	},
+	reset: () => {
+		set(initialState$2);
+	}
+}));
+function showToast(params) {
+	return useToastStore.getState().addToast({
+		message: params.message,
+		type: params.type ?? "info",
+		duration: params.duration ?? 3e3,
+		position: params.position ?? "bottom",
+		action: params.action
+	});
+}
+
 //#endregion
 //#region calls-sdk-core/store/utils/hooks.ts
 const useHideMuteAudioButton = () => {
@@ -3009,6 +3055,7 @@ function resetAllStores() {
 	useConfigStore.getState().reset();
 	useConnectionStore.getState().reset();
 	useParticipantStore.getState().reset();
+	useToastStore.getState().reset();
 	useTracksStore.getState().reset();
 }
 
@@ -4000,6 +4047,13 @@ const commonStyles = react_native.StyleSheet.create({
 	borderDefault: { borderColor: colors.border.default },
 	borderDark: { borderColor: colors.border.dark },
 	borderHighlight: { borderColor: colors.border.highlight },
+	absoluteFill: {
+		position: "absolute",
+		top: 0,
+		bottom: 0,
+		left: 0,
+		right: 0
+	},
 	flex1: { flex: 1 },
 	flexRow: { flexDirection: "row" },
 	flexColumn: { flexDirection: "column" },
@@ -4521,7 +4575,11 @@ const VideoNative = ({ videoTrack, style, objectFit = "cover", mirror = false, m
 		return null;
 	}
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.Animated.View, {
-		style: [styles$25.videoContainer, { opacity: fadeAnim }],
+		style: [
+			commonStyles.absoluteFill,
+			styles$25.videoContainer,
+			{ opacity: fadeAnim }
+		],
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native_webrtc.RTCView, {
 			streamURL: streamURL.toURL(),
 			style: [styles$25.video, style],
@@ -4534,8 +4592,7 @@ const VideoNative = ({ videoTrack, style, objectFit = "cover", mirror = false, m
 const styles$25 = react_native.StyleSheet.create({
 	videoContainer: {
 		height: "100%",
-		width: "100%",
-		...react_native.StyleSheet.absoluteFillObject
+		width: "100%"
 	},
 	video: {
 		width: "100%",
@@ -5009,7 +5066,11 @@ function ProcessingOverlay({ message, visible = true, animated = false }) {
 		return null;
 	}
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_native.Animated.View, {
-		style: [styles$18.overlay, { opacity }],
+		style: [
+			commonStyles.absoluteFill,
+			styles$18.overlay,
+			{ opacity }
+		],
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.ActivityIndicator, {
 			size: "large",
 			color: "#fff"
@@ -5021,7 +5082,6 @@ function ProcessingOverlay({ message, visible = true, animated = false }) {
 }
 const styles$18 = react_native.StyleSheet.create({
 	overlay: {
-		...react_native.StyleSheet.absoluteFillObject,
 		justifyContent: "center",
 		alignItems: "center",
 		backgroundColor: "#1A1A1A",
@@ -5199,7 +5259,6 @@ function showConfirmationDialog(title, description, confirmText, cancelText, onC
 const { width } = react_native.Dimensions.get("window");
 const styles$15 = react_native.StyleSheet.create({
 	backdrop: {
-		...react_native.StyleSheet.absoluteFillObject,
 		backgroundColor: "rgba(0, 0, 0, 0.8)",
 		justifyContent: "center",
 		alignItems: "center",
@@ -5298,7 +5357,7 @@ function ConfirmationDialog() {
 		],
 		onRequestClose: handleBackdropPress,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.Pressable, {
-			style: styles$15.backdrop,
+			style: [commonStyles.absoluteFill, styles$15.backdrop],
 			onPress: handleBackdropPress,
 			testID: "cometchat-confirmation-dialog-backdrop",
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.View, {
@@ -5370,7 +5429,7 @@ const BottomSheet = ({ children, isVisible, onClose, maxHeight = SCREEN_HEIGHT *
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [isVisible && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.TouchableWithoutFeedback, {
 		onPress: onClose,
 		testID: "cometchat-bottom-sheet-backdrop",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.View, { style: styles$14.backdrop })
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.View, { style: [commonStyles.absoluteFill, styles$14.backdrop] })
 	}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_native.Animated.View, {
 		testID,
 		style: [
@@ -5386,7 +5445,6 @@ const BottomSheet = ({ children, isVisible, onClose, maxHeight = SCREEN_HEIGHT *
 };
 const styles$14 = react_native.StyleSheet.create({
 	backdrop: {
-		...react_native.StyleSheet.absoluteFillObject,
 		backgroundColor: "rgba(0,0,0,0.5)",
 		zIndex: 1
 	},
@@ -5779,14 +5837,15 @@ const FullScreenDialog = ({ children, visible = false }) => {
 		return null;
 	}
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_native.Animated.View, {
-		style: [styles$10.container, { opacity: fadeAnim }],
+		style: [
+			commonStyles.absoluteFill,
+			styles$10.container,
+			{ opacity: fadeAnim }
+		],
 		children
 	});
 };
-const styles$10 = react_native.StyleSheet.create({ container: {
-	...react_native.StyleSheet.absoluteFillObject,
-	zIndex: 1e3
-} });
+const styles$10 = react_native.StyleSheet.create({ container: { zIndex: 1e3 } });
 var FullScreenDialog_native_default = FullScreenDialog;
 
 //#endregion
@@ -6591,45 +6650,6 @@ const styles$2 = react_native.StyleSheet.create({
 	}
 });
 
-//#endregion
-//#region src/ui/toast/toast-state.ts
-const MAX_TOASTS = 3;
-let counter = 0;
-const useToastStore = (0, zustand.create)((set) => ({
-	toasts: [],
-	addToast: (toast) => {
-		const id = `toast-${++counter}-${Date.now()}`;
-		const newToast = {
-			...toast,
-			id,
-			createdAt: Date.now()
-		};
-		set((state) => {
-			const updated = [...state.toasts, newToast];
-			if (updated.length > MAX_TOASTS) {
-				return { toasts: updated.slice(-MAX_TOASTS) };
-			}
-			return { toasts: updated };
-		});
-		return id;
-	},
-	removeToast: (id) => {
-		set((state) => ({ toasts: state.toasts.filter((t) => t.id !== id) }));
-	},
-	clearAll: () => {
-		set({ toasts: [] });
-	}
-}));
-function showToast(params) {
-	return useToastStore.getState().addToast({
-		message: params.message,
-		type: params.type ?? "info",
-		duration: params.duration ?? 3e3,
-		position: params.position ?? "bottom",
-		action: params.action
-	});
-}
-
 //#endregion
 //#region src/ui/toast/Toast.native.tsx
 const SLIDE_IN_DURATION = 300;
@@ -6835,13 +6855,6 @@ const styles$1 = react_native.StyleSheet.create({
 		alignItems: "center",
 		gap: GRID_GAP,
 		paddingHorizontal: 20
-	},
-	loadingContainer: {
-		...react_native.StyleSheet.absoluteFillObject,
-		justifyContent: "center",
-		alignItems: "center",
-		backgroundColor: "#000",
-		zIndex: 1e3
 	}
 });
 var index_native_default = CallUI;

package/dist/index.mjs

@@ -937,7 +937,7 @@ function sendParticipantListChangedEvent() {
 
 //#endregion
 //#region calls-sdk-core/store/config.ts
-const initialState$7 = {
+const initialState$8 = {
 	sessionType: "VIDEO",
 	autoStartRecording: false,
 	layout: LAYOUT.TILE,
@@ -975,7 +975,7 @@ const initialState$7 = {
 	enableCompanionMode: false,
 	isPeerCall: false
 };
-const useConfigStore = create()(subscribeWithSelector(combine(initialState$7, (set) => ({ reset: () => set(initialState$7) }))));
+const useConfigStore = create()(subscribeWithSelector(combine(initialState$8, (set) => ({ reset: () => set(initialState$8) }))));
 const setConfig = (config) => {
 	useConfigStore.setState(config);
 };
@@ -993,13 +993,13 @@ const initialLocalParticipant = {
 	type: "human",
 	uid: "unknown"
 };
-const initialState$6 = {
+const initialState$7 = {
 	dominantSpeakers: [],
 	localParticipant: initialLocalParticipant,
 	participants: [],
 	virtualParticipants: []
 };
-const useParticipantStore = create()(subscribeWithSelector(combine(initialState$6, (set, get$1) => ({
+const useParticipantStore = create()(subscribeWithSelector(combine(initialState$7, (set, get$1) => ({
 	addParticipant: (participant) => {
 		set((state) => ({ participants: state.participants.some((p) => p.pid === participant.pid) ? state.participants.map((p) => p.pid === participant.pid ? {
 			...p,
@@ -1080,7 +1080,7 @@ const useParticipantStore = create()(subscribeWithSelector(combine(initialState$
 		}
 		return get$1().participants.find((p) => p.pid === pid);
 	},
-	reset: () => set(initialState$6)
+	reset: () => set(initialState$7)
 }))));
 function useAllParticipants() {
 	const localParticipant = useParticipantStore((state) => state.localParticipant);
@@ -1214,7 +1214,7 @@ useParticipantStore.subscribe((state) => state.participants.filter((p) => p.uid)
 
 //#endregion
 //#region calls-sdk-core/store/conference.ts
-const initialState$5 = {
+const initialState$6 = {
 	conference: null,
 	conferenceJoined: false,
 	conferenceJoinedAt: null,
@@ -1229,7 +1229,7 @@ const initialState$5 = {
 	},
 	isRecording: false
 };
-const useConferenceStore = create()(subscribeWithSelector(combine(initialState$5, (set) => ({
+const useConferenceStore = create()(subscribeWithSelector(combine(initialState$6, (set) => ({
 	conferenceWillJoin: (conference) => {
 		if (typeof window?.APP !== "undefined") {
 			window.APP.conference._room = conference;
@@ -1240,7 +1240,7 @@ const useConferenceStore = create()(subscribeWithSelector(combine(initialState$5
 		});
 	},
 	reset: () => {
-		set(initialState$5);
+		set(initialState$6);
 	},
 	raiseHand: (participantId, timestamp) => {
 		set((state) => ({ raiseHandMap: new Map(state.raiseHandMap).set(participantId, timestamp) }));
@@ -1414,7 +1414,7 @@ useConferenceStore.subscribe((state) => state.conference, (conference) => {
 
 //#endregion
 //#region calls-sdk-core/store/tracks.ts
-const initialState$4 = {
+const initialState$5 = {
 	tracks: [],
 	permissions: {
 		audio: false,
@@ -1422,9 +1422,9 @@ const initialState$4 = {
 		initialized: false
 	}
 };
-const useTracksStore = create()(subscribeWithSelector(combine(initialState$4, (set, get$1) => ({
+const useTracksStore = create()(subscribeWithSelector(combine(initialState$5, (set, get$1) => ({
 	reset: () => set({
-		...initialState$4,
+		...initialState$5,
 		permissions: get$1().permissions
 	}),
 	addTrack: (originalTrack) => set((state) => {
@@ -1806,7 +1806,7 @@ function updateConfig(config) {
 
 //#endregion
 //#region calls-sdk-core/store/base.ts
-const initialState$3 = {
+const initialState$4 = {
 	audioModeMenuVisible: false,
 	audioModes: [],
 	audioInputDevices: [],
@@ -1853,12 +1853,12 @@ const initialState$3 = {
 		endIndex: 0
 	}
 };
-const useBaseStore = create()(subscribeWithSelector(persist(combine(initialState$3, (set, get$1) => ({
+const useBaseStore = create()(subscribeWithSelector(persist(combine(initialState$4, (set, get$1) => ({
 	addSubscriptions: (subscriptions) => {
 		useBaseStore.setState((state) => ({ subscriptions: [...state.subscriptions, ...subscriptions] }));
 	},
 	reset: () => set((state) => ({
-		...initialState$3,
+		...initialState$4,
 		audioInputDevice: state.audioInputDevice,
 		audioOutputDevice: state.audioOutputDevice,
 		videoInputDevice: state.videoInputDevice,
@@ -2093,13 +2093,13 @@ initBaseStoreSubscriptions();
 
 //#endregion
 //#region calls-sdk-core/store/connection.ts
-const initialState$2 = {
+const initialState$3 = {
 	connection: undefined,
 	connectionStatus: "initial",
 	error: undefined,
 	timeEstablished: undefined
 };
-const useConnectionStore = create()(subscribeWithSelector(combine(initialState$2, (set) => ({
+const useConnectionStore = create()(subscribeWithSelector(combine(initialState$3, (set) => ({
 	connectionEstablished: (connection) => set({
 		connection,
 		connectionStatus: "connected",
@@ -2132,10 +2132,10 @@ const useConnectionStore = create()(subscribeWithSelector(combine(initialState$2
 			eventBus.stopEmitting();
 			await tryCatch(connection.disconnect());
 			eventBus.publish({ type: EVENT_LISTENER_METHODS.SessionStatusListener.onConnectionClosed }, true);
-			set(initialState$2);
+			set(initialState$3);
 		}
 	},
-	reset: () => set(initialState$2)
+	reset: () => set(initialState$3)
 }))));
 function waitForConnection() {
 	const { connectionStatus } = useConnectionStore.getState();
@@ -2159,6 +2159,52 @@ function waitForConnection() {
 	});
 }
 
+//#endregion
+//#region calls-sdk-core/store/toast.ts
+const MAX_TOASTS = 3;
+const initialState$2 = { toasts: [] };
+let counter = 0;
+const useToastStore = create((set) => ({
+	...initialState$2,
+	addToast: (toast) => {
+		if (!getIsConferenceJoined()) {
+			return "";
+		}
+		const id = `toast-${++counter}-${Date.now()}`;
+		const newToast = {
+			...toast,
+			id,
+			createdAt: Date.now()
+		};
+		set((state) => {
+			const updated = [...state.toasts, newToast];
+			if (updated.length > MAX_TOASTS) {
+				return { toasts: updated.slice(-MAX_TOASTS) };
+			}
+			return { toasts: updated };
+		});
+		return id;
+	},
+	removeToast: (id) => {
+		set((state) => ({ toasts: state.toasts.filter((t) => t.id !== id) }));
+	},
+	clearAll: () => {
+		set(initialState$2);
+	},
+	reset: () => {
+		set(initialState$2);
+	}
+}));
+function showToast(params) {
+	return useToastStore.getState().addToast({
+		message: params.message,
+		type: params.type ?? "info",
+		duration: params.duration ?? 3e3,
+		position: params.position ?? "bottom",
+		action: params.action
+	});
+}
+
 //#endregion
 //#region calls-sdk-core/store/utils/hooks.ts
 const useHideMuteAudioButton = () => {
@@ -2977,6 +3023,7 @@ function resetAllStores() {
 	useConfigStore.getState().reset();
 	useConnectionStore.getState().reset();
 	useParticipantStore.getState().reset();
+	useToastStore.getState().reset();
 	useTracksStore.getState().reset();
 }
 
@@ -3968,6 +4015,13 @@ const commonStyles = StyleSheet.create({
 	borderDefault: { borderColor: colors.border.default },
 	borderDark: { borderColor: colors.border.dark },
 	borderHighlight: { borderColor: colors.border.highlight },
+	absoluteFill: {
+		position: "absolute",
+		top: 0,
+		bottom: 0,
+		left: 0,
+		right: 0
+	},
 	flex1: { flex: 1 },
 	flexRow: { flexDirection: "row" },
 	flexColumn: { flexDirection: "column" },
@@ -4489,7 +4543,11 @@ const VideoNative = ({ videoTrack, style, objectFit = "cover", mirror = false, m
 		return null;
 	}
 	return /* @__PURE__ */ jsx(Animated.View, {
-		style: [styles$25.videoContainer, { opacity: fadeAnim }],
+		style: [
+			commonStyles.absoluteFill,
+			styles$25.videoContainer,
+			{ opacity: fadeAnim }
+		],
 		children: /* @__PURE__ */ jsx(RTCView, {
 			streamURL: streamURL.toURL(),
 			style: [styles$25.video, style],
@@ -4502,8 +4560,7 @@ const VideoNative = ({ videoTrack, style, objectFit = "cover", mirror = false, m
 const styles$25 = StyleSheet.create({
 	videoContainer: {
 		height: "100%",
-		width: "100%",
-		...StyleSheet.absoluteFillObject
+		width: "100%"
 	},
 	video: {
 		width: "100%",
@@ -4977,7 +5034,11 @@ function ProcessingOverlay({ message, visible = true, animated = false }) {
 		return null;
 	}
 	return /* @__PURE__ */ jsxs(Animated.View, {
-		style: [styles$18.overlay, { opacity }],
+		style: [
+			commonStyles.absoluteFill,
+			styles$18.overlay,
+			{ opacity }
+		],
 		children: [/* @__PURE__ */ jsx(ActivityIndicator, {
 			size: "large",
 			color: "#fff"
@@ -4989,7 +5050,6 @@ function ProcessingOverlay({ message, visible = true, animated = false }) {
 }
 const styles$18 = StyleSheet.create({
 	overlay: {
-		...StyleSheet.absoluteFillObject,
 		justifyContent: "center",
 		alignItems: "center",
 		backgroundColor: "#1A1A1A",
@@ -5167,7 +5227,6 @@ function showConfirmationDialog(title, description, confirmText, cancelText, onC
 const { width } = Dimensions.get("window");
 const styles$15 = StyleSheet.create({
 	backdrop: {
-		...StyleSheet.absoluteFillObject,
 		backgroundColor: "rgba(0, 0, 0, 0.8)",
 		justifyContent: "center",
 		alignItems: "center",
@@ -5266,7 +5325,7 @@ function ConfirmationDialog() {
 		],
 		onRequestClose: handleBackdropPress,
 		children: /* @__PURE__ */ jsx(Pressable, {
-			style: styles$15.backdrop,
+			style: [commonStyles.absoluteFill, styles$15.backdrop],
 			onPress: handleBackdropPress,
 			testID: "cometchat-confirmation-dialog-backdrop",
 			children: /* @__PURE__ */ jsx(View, {
@@ -5338,7 +5397,7 @@ const BottomSheet = ({ children, isVisible, onClose, maxHeight = SCREEN_HEIGHT *
 	return /* @__PURE__ */ jsxs(Fragment, { children: [isVisible && /* @__PURE__ */ jsx(TouchableWithoutFeedback, {
 		onPress: onClose,
 		testID: "cometchat-bottom-sheet-backdrop",
-		children: /* @__PURE__ */ jsx(View, { style: styles$14.backdrop })
+		children: /* @__PURE__ */ jsx(View, { style: [commonStyles.absoluteFill, styles$14.backdrop] })
 	}), /* @__PURE__ */ jsxs(Animated.View, {
 		testID,
 		style: [
@@ -5354,7 +5413,6 @@ const BottomSheet = ({ children, isVisible, onClose, maxHeight = SCREEN_HEIGHT *
 };
 const styles$14 = StyleSheet.create({
 	backdrop: {
-		...StyleSheet.absoluteFillObject,
 		backgroundColor: "rgba(0,0,0,0.5)",
 		zIndex: 1
 	},
@@ -5747,14 +5805,15 @@ const FullScreenDialog = ({ children, visible = false }) => {
 		return null;
 	}
 	return /* @__PURE__ */ jsx(Animated.View, {
-		style: [styles$10.container, { opacity: fadeAnim }],
+		style: [
+			commonStyles.absoluteFill,
+			styles$10.container,
+			{ opacity: fadeAnim }
+		],
 		children
 	});
 };
-const styles$10 = StyleSheet.create({ container: {
-	...StyleSheet.absoluteFillObject,
-	zIndex: 1e3
-} });
+const styles$10 = StyleSheet.create({ container: { zIndex: 1e3 } });
 var FullScreenDialog_native_default = FullScreenDialog;
 
 //#endregion
@@ -6559,45 +6618,6 @@ const styles$2 = StyleSheet.create({
 	}
 });
 
-//#endregion
-//#region src/ui/toast/toast-state.ts
-const MAX_TOASTS = 3;
-let counter = 0;
-const useToastStore = create((set) => ({
-	toasts: [],
-	addToast: (toast) => {
-		const id = `toast-${++counter}-${Date.now()}`;
-		const newToast = {
-			...toast,
-			id,
-			createdAt: Date.now()
-		};
-		set((state) => {
-			const updated = [...state.toasts, newToast];
-			if (updated.length > MAX_TOASTS) {
-				return { toasts: updated.slice(-MAX_TOASTS) };
-			}
-			return { toasts: updated };
-		});
-		return id;
-	},
-	removeToast: (id) => {
-		set((state) => ({ toasts: state.toasts.filter((t) => t.id !== id) }));
-	},
-	clearAll: () => {
-		set({ toasts: [] });
-	}
-}));
-function showToast(params) {
-	return useToastStore.getState().addToast({
-		message: params.message,
-		type: params.type ?? "info",
-		duration: params.duration ?? 3e3,
-		position: params.position ?? "bottom",
-		action: params.action
-	});
-}
-
 //#endregion
 //#region src/ui/toast/Toast.native.tsx
 const SLIDE_IN_DURATION = 300;
@@ -6803,13 +6823,6 @@ const styles$1 = StyleSheet.create({
 		alignItems: "center",
 		gap: GRID_GAP,
 		paddingHorizontal: 20
-	},
-	loadingContainer: {
-		...StyleSheet.absoluteFillObject,
-		justifyContent: "center",
-		alignItems: "center",
-		backgroundColor: "#000",
-		zIndex: 1e3
 	}
 });
 var index_native_default = CallUI;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cometchat/calls-sdk-react-native",
-  "version": "5.0.0-beta.7",
+  "version": "5.0.0-beta.8",
   "description": "CometChat Calls SDK for React Native provides voice and video calling capabilities for React Native applications.",
   "private": false,
   "main": "dist/index.js",