mediasfu-angular 2.1.6 → 2.2.1

package/dist/lib/components/mediasfu-components/mediasfu-webinar.component.d.ts

@@ -182,6 +182,10 @@ export type MediasfuWebinarOptions = {
  * @input {CreateMediaSFURoomOptions | JoinMediaSFURoomOptions} noUIPreJoinOptions - Options for the prejoin page without UI.
  * @input {JoinRoomOnMediaSFUType} joinMediaSFURoom - Function to join a room on MediaSFU.
  * @input {CreateRoomOnMediaSFUType} createMediaSFURoom - Function to create a room on MediaSFU.
+ * @input {any} customVideoCard - Custom component to replace the default VideoCard component.
+ * @input {any} customAudioCard - Custom component to replace the default AudioCard component.
+ * @input {any} customMiniCard - Custom component to replace the default MiniCard component.
+ * @input {any} customMainComponent - Custom component that provides complete control over the main UI, bypassing default MediaSFU styling.
  *
  * @property {string} title - The title of the component, defaults to "MediaSFU-Webinar".
  *
@@ -206,13 +210,17 @@ export type MediasfuWebinarOptions = {
  *   [useLocalUIMode]="true"
  *   [seedData]="seedDataObject"
  *   [useSeed]="true"
- *   [imgSrc]="https://example.com/logo.png">
+ *   [imgSrc]="'https://example.com/logo.png'"
  *   [sourceParameters]="{ source: 'camera', width: 640, height: 480 }"
  *   [updateSourceParameters]="updateSourceParameters"
  *   [returnUI]="true"
  *   [noUIPreJoinOptions]="{ roomName: 'room1', userName: 'user1' }"
  *   [joinMediaSFURoom]="joinMediaSFURoom"
- *   [createMediaSFURoom]="createMediaSFURoom">
+ *   [createMediaSFURoom]="createMediaSFURoom"
+ *   [customVideoCard]="CustomVideoCardComponent"
+ *   [customAudioCard]="CustomAudioCardComponent"
+ *   [customMiniCard]="CustomMiniCardComponent"
+ *   [customMainComponent]="CustomMainComponent">
  * </app-mediasfu-webinar>
  * ```
  */
@@ -357,6 +365,10 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
     noUIPreJoinOptions?: CreateMediaSFURoomOptions | JoinMediaSFURoomOptions;
     joinMediaSFURoom?: JoinRoomOnMediaSFUType;
     createMediaSFURoom?: CreateRoomOnMediaSFUType;
+    customVideoCard: any;
+    customAudioCard: any;
+    customMiniCard: any;
+    customMainComponent: any;
     title: string;
     private mainHeightWidthSubscription;
     private validatedSubscription;
@@ -367,6 +379,22 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
     private recordingSubscription;
     constructor(cdr: ChangeDetectorRef, injector: Injector, updateMiniCardsGrid: UpdateMiniCardsGrid, mixStreams: MixStreams, dispStreams: DispStreams, stopShareScreen: StopShareScreen, checkScreenShare: CheckScreenShare, startShareScreen: StartShareScreen, requestScreenShare: RequestScreenShare, reorderStreams: ReorderStreams, prepopulateUserMedia: PrepopulateUserMedia, getVideos: GetVideos, rePort: RePort, trigger: Trigger, consumerResume: ConsumerResume, connectSendTransport: ConnectSendTransport, connectSendTransportAudio: ConnectSendTransportAudio, connectSendTransportVideo: ConnectSendTransportVideo, connectSendTransportScreen: ConnectSendTransportScreen, processConsumerTransports: ProcessConsumerTransports, resumePauseStreams: ResumePauseStreams, readjust: Readjust, checkGrid: CheckGrid, getEstimate: GetEstimate, calculateRowsAndColumns: CalculateRowsAndColumns, addVideosGrid: AddVideosGrid, onScreenChanges: OnScreenChanges, changeVids: ChangeVids, compareActiveNames: CompareActiveNames, compareScreenStates: CompareScreenStates, createSendTransport: CreateSendTransport, resumeSendTransportAudio: ResumeSendTransportAudio, receiveAllPipedTransports: ReceiveAllPipedTransports, disconnectSendTransportVideo: DisconnectSendTransportVideo, disconnectSendTransportAudio: DisconnectSendTransportAudio, disconnectSendTransportScreen: DisconnectSendTransportScreen, getPipedProducersAlt: GetPipedProducersAlt, signalNewConsumerTransport: SignalNewConsumerTransport, connectRecvTransport: ConnectRecvTransport, reUpdateInter: ReUpdateInter, updateParticipantAudioDecibels: UpdateParticipantAudioDecibels, closeAndResize: CloseAndResize, autoAdjust: AutoAdjust, switchUserVideoAlt: SwitchUserVideoAlt, switchUserVideo: SwitchUserVideo, switchUserAudio: SwitchUserAudio, getDomains: GetDomains, formatNumber: FormatNumber, connectIps: ConnectIps, connectLocalIps: ConnectLocalIps, createDeviceClient: CreateDeviceClient, handleCreatePoll: HandleCreatePoll, handleEndPoll: HandleEndPoll, handleVotePoll: HandleVotePoll, captureCanvasStream: CaptureCanvasStream, resumePauseAudioStreams: ResumePauseAudioStreams, processConsumerTransportsAudio: ProcessConsumerTransportsAudio, launchMenuModal: LaunchMenuModal, launchRecording: LaunchRecording, startRecording: StartRecording, confirmRecording: ConfirmRecording, launchWaiting: LaunchWaiting, launchCoHost: launchCoHost, launchMediaSettings: LaunchMediaSettings, launchDisplaySettings: LaunchDisplaySettings, launchSettings: LaunchSettings, launchRequests: LaunchRequests, launchParticipants: LaunchParticipants, launchMessages: LaunchMessages, launchConfirmExit: LaunchConfirmExit, launchPoll: LaunchPoll, launchBreakoutRooms: LaunchBreakoutRooms, launchConfigureWhiteboard: LaunchConfigureWhiteboard, startMeetingProgressTimer: StartMeetingProgressTimer, updateRecording: UpdateRecording, stopRecording: StopRecording, userWaiting: UserWaiting, personJoined: PersonJoined, allWaitingRoomMembers: AllWaitingRoomMembers, roomRecordParams: RoomRecordParams, banParticipant: BanParticipant, updatedCoHost: UpdatedCoHost, participantRequested: ParticipantRequested, screenProducerId: ScreenProducerId, updateMediaSettings: UpdateMediaSettings, producerMediaPaused: ProducerMediaPaused, producerMediaResumed: ProducerMediaResumed, producerMediaClosed: ProducerMediaClosed, controlMediaHost: ControlMediaHost, meetingEnded: MeetingEnded, disconnectUserSelf: DisconnectUserSelf, receiveMessage: ReceiveMessage, meetingTimeRemaining: MeetingTimeRemaining, meetingStillThere: MeetingStillThere, startRecords: StartRecords, reInitiateRecording: ReInitiateRecording, recordingNotice: RecordingNotice, timeLeftRecording: TimeLeftRecording, stoppedRecording: StoppedRecording, hostRequestResponse: HostRequestResponse, allMembers: AllMembers, allMembersRest: AllMembersRest, disconnect: Disconnect, pollUpdated: PollUpdated, breakoutRoomUpdated: BreakoutRoomUpdated, socketManager: SocketManager, joinRoomClient: JoinRoomClient, joinLocalRoom: JoinLocalRoom, updateRoomParametersClient: UpdateRoomParametersClient, clickVideo: ClickVideo, clickAudio: ClickAudio, clickScreenShare: ClickScreenShare, streamSuccessVideo: StreamSuccessVideo, streamSuccessAudio: StreamSuccessAudio, streamSuccessScreen: StreamSuccessScreen, streamSuccessAudioSwitch: StreamSuccessAudioSwitch, checkPermission: CheckPermission, updateConsumingDomains: UpdateConsumingDomains, receiveRoomMessages: ReceiveRoomMessages);
     createInjector(inputs: any): Injector;
+    /**
+     * Gets a list of media devices filtered by the specified kind.
+     * @param kind - The kind of media device to filter by ('videoinput' or 'audioinput')
+     * @returns A promise that resolves to an array of MediaDeviceInfo objects
+     */
+    getMediaDevicesList: (kind: "videoinput" | "audioinput") => Promise<MediaDeviceInfo[]>;
+    /**
+     * Gets the media stream for a participant by their ID or name.
+     * @param options - Object containing id, name, and kind parameters
+     * @returns A promise that resolves to the participant's MediaStream or null if not found
+     */
+    getParticipantMedia: (options: {
+        id?: string;
+        name?: string;
+        kind: "video" | "audio";
+    }) => Promise<MediaStream | null>;
     mediaSFUFunctions: () => {
         updateMiniCardsGrid: ({ rows, cols, defal, actualRows, parameters, }: import("../../consumers/update-mini-cards-grid.service").UpdateMiniCardsGridOptions) => Promise<void>;
         mixStreams: ({ alVideoStreams, non_alVideoStreams, ref_participants, }: import("../../consumers/mix-streams.service").MixStreamsOptions) => Promise<(Stream | Participant)[]>;
@@ -441,6 +469,12 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
         clickScreenShare: ({ parameters }: import("../../@types/types").ClickScreenShareOptions) => Promise<void>;
         requestPermissionCamera: () => Promise<string>;
         requestPermissionAudio: () => Promise<string>;
+        getMediaDevicesList: (kind: "videoinput" | "audioinput") => Promise<MediaDeviceInfo[]>;
+        getParticipantMedia: (options: {
+            id?: string;
+            name?: string;
+            kind: "video" | "audio";
+        }) => Promise<MediaStream | null>;
     };
     validated: BehaviorSubject<boolean>;
     localUIMode: BehaviorSubject<boolean>;
@@ -891,7 +925,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
     recordingVideoOptions: BehaviorSubject<string>;
     recordingVideoType: BehaviorSubject<string>;
     recordingVideoOptimized: BehaviorSubject<boolean>;
-    recordingDisplayType: BehaviorSubject<"video" | "all" | "media">;
+    recordingDisplayType: BehaviorSubject<"video" | "media" | "all">;
     recordingAddHLS: BehaviorSubject<boolean>;
     recordingNameTags: BehaviorSubject<boolean>;
     recordingBackgroundColor: BehaviorSubject<string>;
@@ -1119,7 +1153,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
     updateAnnotateScreenStream: (value: boolean) => void;
     updateMainScreenCanvas: (value: HTMLCanvasElement | null) => void;
     updateIsScreenboardModalVisible: (value: boolean) => void;
-    checkOrientation: () => "landscape" | "portrait";
+    checkOrientation: () => "portrait" | "landscape";
     showAlert: ({ message, type, duration, }: {
         message: string;
         type: "success" | "danger";
@@ -1362,7 +1396,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
         recordingVideoOptions: string;
         recordingVideoType: string;
         recordingVideoOptimized: boolean;
-        recordingDisplayType: "video" | "all" | "media";
+        recordingDisplayType: "video" | "media" | "all";
         recordingAddHLS: boolean;
         recordingAddText: boolean;
         recordingCustomText: string;
@@ -1763,11 +1797,14 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
         updateAnnotateScreenStream: (value: boolean) => void;
         updateMainScreenCanvas: (value: HTMLCanvasElement | null) => void;
         updateIsScreenboardModalVisible: (value: boolean) => void;
-        checkOrientation: () => "landscape" | "portrait";
+        checkOrientation: () => "portrait" | "landscape";
         updateDevice: (value: Device | null) => void;
         updateSocket: (value: Socket) => void;
         updateLocalSocket: (value: Socket | null) => void;
         updateValidated: (value: boolean) => void;
+        customVideoCard: any;
+        customAudioCard: any;
+        customMiniCard: any;
         showAlert: ({ message, type, duration, }: {
             message: string;
             type: "success" | "danger";
@@ -1847,6 +1884,12 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
             clickScreenShare: ({ parameters }: import("../../@types/types").ClickScreenShareOptions) => Promise<void>;
             requestPermissionCamera: () => Promise<string>;
             requestPermissionAudio: () => Promise<string>;
+            getMediaDevicesList: (kind: "videoinput" | "audioinput") => Promise<MediaDeviceInfo[]>;
+            getParticipantMedia: (options: {
+                id?: string;
+                name?: string;
+                kind: "video" | "audio";
+            }) => Promise<MediaStream | null>;
             localUIMode: boolean;
             roomName: string;
             member: string;
@@ -2083,7 +2126,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
             recordingVideoOptions: string;
             recordingVideoType: string;
             recordingVideoOptimized: boolean;
-            recordingDisplayType: "video" | "all" | "media";
+            recordingDisplayType: "video" | "media" | "all";
             recordingAddHLS: boolean;
             recordingAddText: boolean;
             recordingCustomText: string;
@@ -2484,11 +2527,14 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
             updateAnnotateScreenStream: (value: boolean) => void;
             updateMainScreenCanvas: (value: HTMLCanvasElement | null) => void;
             updateIsScreenboardModalVisible: (value: boolean) => void;
-            checkOrientation: () => "landscape" | "portrait";
+            checkOrientation: () => "portrait" | "landscape";
             updateDevice: (value: Device | null) => void;
             updateSocket: (value: Socket) => void;
             updateLocalSocket: (value: Socket | null) => void;
             updateValidated: (value: boolean) => void;
+            customVideoCard: any;
+            customAudioCard: any;
+            customMiniCard: any;
             showAlert: ({ message, type, duration, }: {
                 message: string;
                 type: "success" | "danger";
@@ -2571,6 +2617,12 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
         clickScreenShare: ({ parameters }: import("../../@types/types").ClickScreenShareOptions) => Promise<void>;
         requestPermissionCamera: () => Promise<string>;
         requestPermissionAudio: () => Promise<string>;
+        getMediaDevicesList: (kind: "videoinput" | "audioinput") => Promise<MediaDeviceInfo[]>;
+        getParticipantMedia: (options: {
+            id?: string;
+            name?: string;
+            kind: "video" | "audio";
+        }) => Promise<MediaStream | null>;
         localUIMode: boolean;
         roomName: string;
         member: string;
@@ -2807,7 +2859,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
         recordingVideoOptions: string;
         recordingVideoType: string;
         recordingVideoOptimized: boolean;
-        recordingDisplayType: "video" | "all" | "media";
+        recordingDisplayType: "video" | "media" | "all";
         recordingAddHLS: boolean;
         recordingAddText: boolean;
         recordingCustomText: string;
@@ -3208,11 +3260,14 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
         updateAnnotateScreenStream: (value: boolean) => void;
         updateMainScreenCanvas: (value: HTMLCanvasElement | null) => void;
         updateIsScreenboardModalVisible: (value: boolean) => void;
-        checkOrientation: () => "landscape" | "portrait";
+        checkOrientation: () => "portrait" | "landscape";
         updateDevice: (value: Device | null) => void;
         updateSocket: (value: Socket) => void;
         updateLocalSocket: (value: Socket | null) => void;
         updateValidated: (value: boolean) => void;
+        customVideoCard: any;
+        customAudioCard: any;
+        customMiniCard: any;
         showAlert: ({ message, type, duration, }: {
             message: string;
             type: "success" | "danger";
@@ -3292,6 +3347,12 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
             clickScreenShare: ({ parameters }: import("../../@types/types").ClickScreenShareOptions) => Promise<void>;
             requestPermissionCamera: () => Promise<string>;
             requestPermissionAudio: () => Promise<string>;
+            getMediaDevicesList: (kind: "videoinput" | "audioinput") => Promise<MediaDeviceInfo[]>;
+            getParticipantMedia: (options: {
+                id?: string;
+                name?: string;
+                kind: "video" | "audio";
+            }) => Promise<MediaStream | null>;
             localUIMode: boolean;
             roomName: string;
             member: string;
@@ -3528,7 +3589,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
             recordingVideoOptions: string;
             recordingVideoType: string;
             recordingVideoOptimized: boolean;
-            recordingDisplayType: "video" | "all" | "media";
+            recordingDisplayType: "video" | "media" | "all";
             recordingAddHLS: boolean;
             recordingAddText: boolean;
             recordingCustomText: string;
@@ -3929,11 +3990,14 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
             updateAnnotateScreenStream: (value: boolean) => void;
             updateMainScreenCanvas: (value: HTMLCanvasElement | null) => void;
             updateIsScreenboardModalVisible: (value: boolean) => void;
-            checkOrientation: () => "landscape" | "portrait";
+            checkOrientation: () => "portrait" | "landscape";
             updateDevice: (value: Device | null) => void;
             updateSocket: (value: Socket) => void;
             updateLocalSocket: (value: Socket | null) => void;
             updateValidated: (value: boolean) => void;
+            customVideoCard: any;
+            customAudioCard: any;
+            customMiniCard: any;
             showAlert: ({ message, type, duration, }: {
                 message: string;
                 type: "success" | "danger";
@@ -4016,6 +4080,12 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
         clickScreenShare: ({ parameters }: import("../../@types/types").ClickScreenShareOptions) => Promise<void>;
         requestPermissionCamera: () => Promise<string>;
         requestPermissionAudio: () => Promise<string>;
+        getMediaDevicesList: (kind: "videoinput" | "audioinput") => Promise<MediaDeviceInfo[]>;
+        getParticipantMedia: (options: {
+            id?: string;
+            name?: string;
+            kind: "video" | "audio";
+        }) => Promise<MediaStream | null>;
         localUIMode: boolean;
         roomName: string;
         member: string;
@@ -4252,7 +4322,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
         recordingVideoOptions: string;
         recordingVideoType: string;
         recordingVideoOptimized: boolean;
-        recordingDisplayType: "video" | "all" | "media";
+        recordingDisplayType: "video" | "media" | "all";
         recordingAddHLS: boolean;
         recordingAddText: boolean;
         recordingCustomText: string;
@@ -4653,11 +4723,14 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
         updateAnnotateScreenStream: (value: boolean) => void;
         updateMainScreenCanvas: (value: HTMLCanvasElement | null) => void;
         updateIsScreenboardModalVisible: (value: boolean) => void;
-        checkOrientation: () => "landscape" | "portrait";
+        checkOrientation: () => "portrait" | "landscape";
         updateDevice: (value: Device | null) => void;
         updateSocket: (value: Socket) => void;
         updateLocalSocket: (value: Socket | null) => void;
         updateValidated: (value: boolean) => void;
+        customVideoCard: any;
+        customAudioCard: any;
+        customMiniCard: any;
         showAlert: ({ message, type, duration, }: {
             message: string;
             type: "success" | "danger";
@@ -4737,6 +4810,12 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
             clickScreenShare: ({ parameters }: import("../../@types/types").ClickScreenShareOptions) => Promise<void>;
             requestPermissionCamera: () => Promise<string>;
             requestPermissionAudio: () => Promise<string>;
+            getMediaDevicesList: (kind: "videoinput" | "audioinput") => Promise<MediaDeviceInfo[]>;
+            getParticipantMedia: (options: {
+                id?: string;
+                name?: string;
+                kind: "video" | "audio";
+            }) => Promise<MediaStream | null>;
             localUIMode: boolean;
             roomName: string;
             member: string;
@@ -4973,7 +5052,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
             recordingVideoOptions: string;
             recordingVideoType: string;
             recordingVideoOptimized: boolean;
-            recordingDisplayType: "video" | "all" | "media";
+            recordingDisplayType: "video" | "media" | "all";
             recordingAddHLS: boolean;
             recordingAddText: boolean;
             recordingCustomText: string;
@@ -5374,11 +5453,14 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
             updateAnnotateScreenStream: (value: boolean) => void;
             updateMainScreenCanvas: (value: HTMLCanvasElement | null) => void;
             updateIsScreenboardModalVisible: (value: boolean) => void;
-            checkOrientation: () => "landscape" | "portrait";
+            checkOrientation: () => "portrait" | "landscape";
             updateDevice: (value: Device | null) => void;
             updateSocket: (value: Socket) => void;
             updateLocalSocket: (value: Socket | null) => void;
             updateValidated: (value: boolean) => void;
+            customVideoCard: any;
+            customAudioCard: any;
+            customMiniCard: any;
             showAlert: ({ message, type, duration, }: {
                 message: string;
                 type: "success" | "danger";
@@ -5552,6 +5634,12 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
                 clickScreenShare: ({ parameters }: import("../../@types/types").ClickScreenShareOptions) => Promise<void>;
                 requestPermissionCamera: () => Promise<string>;
                 requestPermissionAudio: () => Promise<string>;
+                getMediaDevicesList: (kind: "videoinput" | "audioinput") => Promise<MediaDeviceInfo[]>;
+                getParticipantMedia: (options: {
+                    id?: string;
+                    name?: string;
+                    kind: "video" | "audio";
+                }) => Promise<MediaStream | null>;
                 localUIMode: boolean;
                 roomName: string;
                 member: string;
@@ -5788,7 +5876,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
                 recordingVideoOptions: string;
                 recordingVideoType: string;
                 recordingVideoOptimized: boolean;
-                recordingDisplayType: "video" | "all" | "media";
+                recordingDisplayType: "video" | "media" | "all";
                 recordingAddHLS: boolean;
                 recordingAddText: boolean;
                 recordingCustomText: string;
@@ -6189,11 +6277,14 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
                 updateAnnotateScreenStream: (value: boolean) => void;
                 updateMainScreenCanvas: (value: HTMLCanvasElement | null) => void;
                 updateIsScreenboardModalVisible: (value: boolean) => void;
-                checkOrientation: () => "landscape" | "portrait";
+                checkOrientation: () => "portrait" | "landscape";
                 updateDevice: (value: Device | null) => void;
                 updateSocket: (value: Socket) => void;
                 updateLocalSocket: (value: Socket | null) => void;
                 updateValidated: (value: boolean) => void;
+                customVideoCard: any;
+                customAudioCard: any;
+                customMiniCard: any;
                 showAlert: ({ message, type, duration, }: {
                     message: string;
                     type: "success" | "danger";
@@ -6273,6 +6364,12 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
                     clickScreenShare: ({ parameters }: import("../../@types/types").ClickScreenShareOptions) => Promise<void>;
                     requestPermissionCamera: () => Promise<string>;
                     requestPermissionAudio: () => Promise<string>;
+                    getMediaDevicesList: (kind: "videoinput" | "audioinput") => Promise<MediaDeviceInfo[]>;
+                    getParticipantMedia: (options: {
+                        id?: string;
+                        name?: string;
+                        kind: "video" | "audio";
+                    }) => Promise<MediaStream | null>;
                     localUIMode: boolean;
                     roomName: string;
                     member: string;
@@ -6509,7 +6606,7 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
                     recordingVideoOptions: string;
                     recordingVideoType: string;
                     recordingVideoOptimized: boolean;
-                    recordingDisplayType: "video" | "all" | "media";
+                    recordingDisplayType: "video" | "media" | "all";
                     recordingAddHLS: boolean;
                     recordingAddText: boolean;
                     recordingCustomText: string;
@@ -6910,11 +7007,14 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
                     updateAnnotateScreenStream: (value: boolean) => void;
                     updateMainScreenCanvas: (value: HTMLCanvasElement | null) => void;
                     updateIsScreenboardModalVisible: (value: boolean) => void;
-                    checkOrientation: () => "landscape" | "portrait";
+                    checkOrientation: () => "portrait" | "landscape";
                     updateDevice: (value: Device | null) => void;
                     updateSocket: (value: Socket) => void;
                     updateLocalSocket: (value: Socket | null) => void;
                     updateValidated: (value: boolean) => void;
+                    customVideoCard: any;
+                    customAudioCard: any;
+                    customMiniCard: any;
                     showAlert: ({ message, type, duration, }: {
                         message: string;
                         type: "success" | "danger";
@@ -7019,5 +7119,5 @@ export declare class MediasfuWebinar implements OnInit, OnDestroy {
     })[];
     connect_Socket(apiUserName: string, token: string, skipSockets?: boolean): Promise<Socket | null>;
     static ɵfac: i0.ɵɵFactoryDeclaration<MediasfuWebinar, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MediasfuWebinar, "app-mediasfu-webinar", never, { "PrejoinPage": { "alias": "PrejoinPage"; "required": false; }; "localLink": { "alias": "localLink"; "required": false; }; "connectMediaSFU": { "alias": "connectMediaSFU"; "required": false; }; "credentials": { "alias": "credentials"; "required": false; }; "useLocalUIMode": { "alias": "useLocalUIMode"; "required": false; }; "seedData": { "alias": "seedData"; "required": false; }; "useSeed": { "alias": "useSeed"; "required": false; }; "imgSrc": { "alias": "imgSrc"; "required": false; }; "sourceParameters": { "alias": "sourceParameters"; "required": false; }; "updateSourceParameters": { "alias": "updateSourceParameters"; "required": false; }; "returnUI": { "alias": "returnUI"; "required": false; }; "noUIPreJoinOptions": { "alias": "noUIPreJoinOptions"; "required": false; }; "joinMediaSFURoom": { "alias": "joinMediaSFURoom"; "required": false; }; "createMediaSFURoom": { "alias": "createMediaSFURoom"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MediasfuWebinar, "app-mediasfu-webinar", never, { "PrejoinPage": { "alias": "PrejoinPage"; "required": false; }; "localLink": { "alias": "localLink"; "required": false; }; "connectMediaSFU": { "alias": "connectMediaSFU"; "required": false; }; "credentials": { "alias": "credentials"; "required": false; }; "useLocalUIMode": { "alias": "useLocalUIMode"; "required": false; }; "seedData": { "alias": "seedData"; "required": false; }; "useSeed": { "alias": "useSeed"; "required": false; }; "imgSrc": { "alias": "imgSrc"; "required": false; }; "sourceParameters": { "alias": "sourceParameters"; "required": false; }; "updateSourceParameters": { "alias": "updateSourceParameters"; "required": false; }; "returnUI": { "alias": "returnUI"; "required": false; }; "noUIPreJoinOptions": { "alias": "noUIPreJoinOptions"; "required": false; }; "joinMediaSFURoom": { "alias": "joinMediaSFURoom"; "required": false; }; "createMediaSFURoom": { "alias": "createMediaSFURoom"; "required": false; }; "customVideoCard": { "alias": "customVideoCard"; "required": false; }; "customAudioCard": { "alias": "customAudioCard"; "required": false; }; "customMiniCard": { "alias": "customMiniCard"; "required": false; }; "customMainComponent": { "alias": "customMainComponent"; "required": false; }; }, {}, never, never, true, never>;
 }

package/dist/lib/consumers/add-videos-grid.service.d.ts

@@ -12,6 +12,9 @@ export interface AddVideosGridParameters extends UpdateMiniCardsGridParameters,
     forceFullDisplay: boolean;
     otherGridStreams: CustomMediaComponent[][];
     updateOtherGridStreams: (otherGridStreams: CustomMediaComponent[][]) => void;
+    customVideoCard?: any;
+    customAudioCard?: any;
+    customMiniCard?: any;
     updateMiniCardsGrid: UpdateMiniCardsGridType;
     getUpdatedAllParams: () => AddVideosGridParameters;
     [key: string]: any;

package/dist/lib/consumers/prepopulate-user-media.service.d.ts

@@ -37,6 +37,9 @@ export interface PrepopulateUserMediaParameters extends AudioCardParameters {
     updateScreenForceFullDisplay: (force: boolean) => void;
     updateUpdateMainWindow: (update: boolean) => void;
     updateMainGridStream: (components: CustomMediaComponent[]) => void;
+    customVideoCard?: any;
+    customAudioCard?: any;
+    customMiniCard?: any;
     getUpdatedAllParams: () => PrepopulateUserMediaParameters;
     [key: string]: any;
 }

package/dist/lib/methods/utils/create-room-on-media-sfu.service.d.ts

@@ -5,7 +5,8 @@ import * as i0 from "@angular/core";
  *
  * This method sends a POST request to the MediaSFU API to create a new room.
  * It validates the provided credentials and dynamically constructs the API endpoint,
- * supporting the Community Edition via a custom `localLink`.
+ * supporting the Community Edition via a custom `localLink`. The method includes
+ * a 30-second protection mechanism to prevent duplicate room creation requests.
  *
  * @param {object} options - Configuration options for creating the room.
  * @param {CreateMediaSFURoomOptions | JoinMediaSFURoomOptions} options.payload -
@@ -28,12 +29,12 @@ import * as i0 from "@angular/core";
 * const response = await createRoomOnMediaSFU.createRoomOnMediaSFU({
 *   payload: {
 *     action: 'create',
-*     duration: 120, // Duration in minutes
-*     capacity: 20, // Max participants
+*     duration: 60, // Duration in minutes
+*     capacity: 10, // Max participants
 *     userName: 'hostUser',
 *     scheduledDate: Date.now() + 3600000, // One hour from now
 *     secureCode: 'secure123', // Optional
-*     eventType: 'webinar', // Optional
+*     eventType: 'conference', // Optional
 *   },
 *   apiUserName: 'yourAPIUSERNAME',
 *   apiKey: 'yourAPIKEY',
@@ -53,7 +54,8 @@ export declare class CreateRoomOnMediaSFU {
    *
    * This method sends a POST request to the MediaSFU API to create a new room.
    * It validates the provided credentials and dynamically constructs the API endpoint,
-   * supporting the Community Edition via a custom `localLink`.
+   * supporting the Community Edition via a custom `localLink`. The method includes
+   * a 30-second protection mechanism to prevent duplicate room creation requests.
    *
    * @param {object} options - Configuration options for creating the room.
    * @param {CreateMediaSFURoomOptions | JoinMediaSFURoomOptions} options.payload -
@@ -76,12 +78,12 @@ export declare class CreateRoomOnMediaSFU {
     * const response = await createRoomOnMediaSFU.createRoomOnMediaSFU({
     *   payload: {
     *     action: 'create',
-    *     duration: 120, // Duration in minutes
-    *     capacity: 20, // Max participants
+    *     duration: 60, // Duration in minutes
+    *     capacity: 10, // Max participants
     *     userName: 'hostUser',
     *     scheduledDate: Date.now() + 3600000, // One hour from now
     *     secureCode: 'secure123', // Optional
-    *     eventType: 'webinar', // Optional
+    *     eventType: 'conference', // Optional
     *   },
     *   apiUserName: 'yourAPIUSERNAME',
     *   apiKey: 'yourAPIKEY',

package/dist/lib/services/custom-component-injection.service.d.ts

@@ -0,0 +1,86 @@
+/**
+ * Custom Component Injection Service
+ * Manages custom component injection and rendering for MediaSFU Angular components
+ */
+import { Injector, ComponentRef, ViewContainerRef, Type } from '@angular/core';
+import { CustomComponent, CustomComponentType, CustomComponentFunction, CustomComponentParameters, CustomComponentContext } from '../@types/custom-component.types';
+import * as i0 from "@angular/core";
+export declare class CustomComponentInjectionService {
+    private defaultConfig;
+    constructor();
+    /**
+     * Creates an injector with custom parameters for component injection
+     * @param parameters Custom parameters to inject
+     * @param parentInjector Parent injector to inherit from
+     * @returns New injector with custom parameters
+     */
+    createCustomInjector(parameters: CustomComponentParameters, parentInjector?: Injector): Injector;
+    /**
+     * Checks if a component is a custom Angular component
+     */
+    isCustomComponent<T>(comp: CustomComponentType<T>): comp is CustomComponent<T>;
+    /**
+     * Checks if a component is a function-based component
+     */
+    isFunctionComponent(comp: CustomComponentType): comp is CustomComponentFunction;
+    /**
+     * Checks if a component is an HTML element
+     */
+    isHTMLElement(comp: CustomComponentType): comp is HTMLElement;
+    /**
+     * Safely gets the outerHTML of an HTMLElement component
+     * @param comp Component that could be HTMLElement or CustomComponent
+     * @returns outerHTML string or empty string if not HTMLElement
+     */
+    getHtmlElementOuterHTML<T>(comp: CustomComponentType<T>): string;
+    /**
+     * Renders a custom component in the specified container
+     * @param customComponent The custom component to render
+     * @param container ViewContainerRef where the component should be rendered
+     * @param context Component context with parameters and configuration
+     * @returns ComponentRef or HTMLElement reference
+     */
+    renderCustomComponent<T>(customComponent: CustomComponentType<T>, container: ViewContainerRef, context: CustomComponentContext): ComponentRef<T> | HTMLElement | null;
+    /**
+     * Creates a component object with injector for dynamic component rendering
+     * @param componentType Component type
+     * @param parameters Parameters to inject
+     * @param parentInjector Parent injector
+     * @returns Component object with injector
+     */
+    createComponentWithInjector<T>(componentType: Type<T>, parameters?: CustomComponentParameters, parentInjector?: Injector): CustomComponent<T>;
+    /**
+     * Validates if a custom component can be rendered
+     * @param customComponent Component to validate
+     * @returns boolean indicating if component is valid
+     */
+    validateCustomComponent<T>(customComponent: CustomComponentType<T>): boolean;
+    /**
+     * Merges custom component options with defaults
+     * @param customOptions Custom component options
+     * @param defaultOptions Default component options
+     * @returns Merged options
+     */
+    mergeComponentOptions<T>(customOptions: Partial<T>, defaultOptions: T): T;
+    /**
+     * Destroys a custom component and cleans up resources
+     * @param componentRef Component reference to destroy
+     */
+    destroyCustomComponent<T>(componentRef: ComponentRef<T> | HTMLElement | null): void;
+    /**
+     * Helper method to resolve component from custom or default
+     * This is useful for the pattern: customComponent || defaultComponent
+     * @param customComponent Custom component (can be undefined)
+     * @param defaultComponent Default fallback component
+     * @returns The resolved component
+     */
+    resolveComponent<T>(customComponent: CustomComponentType<T> | undefined, defaultComponent: CustomComponentType<T>): CustomComponentType<T>;
+    /**
+     * Checks if we should use custom main component (for template restructuring)
+     * @param customMainComponent Custom main component
+     * @returns boolean indicating if custom main component should be used
+     */
+    shouldUseCustomMainComponent<T>(customMainComponent: CustomComponentType<T> | undefined): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CustomComponentInjectionService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CustomComponentInjectionService>;
+}

package/dist/public-api.d.ts

@@ -51,6 +51,7 @@ export * from './lib/methods/polls-methods/launch-poll.service';
 export * from './lib/methods/background-methods/launch-background.service';
 export * from './lib/methods/breakout-room-methods/launch-breakout-rooms.service';
 export * from './lib/methods/whiteboard-methods/launch-configure-whiteboard.service';
+export * from './lib/services/custom-component-injection.service';
 export * from './lib/sockets/socket-manager.service';
 export * from './lib/producer-client/producer-client-emits/join-room-client.service';
 export * from './lib/producer-client/producer-client-emits/update-room-parameters-client.service';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mediasfu-angular",
-  "version": "2.1.6",
+  "version": "2.2.1",
   "author": "MediaSFU",
   "license": "MIT",
   "description": "MediaSFU Prebuilt Angular SDK",
@@ -14,26 +14,26 @@
     "email": "info@mediasfu.com"
   },
   "peerDependencies": {
-    "@angular/animations": "^19.0.1",
-    "@angular/common": "^19.0.1",
-    "@angular/compiler": "^19.0.1",
-    "@angular/core": "^19.0.1",
-    "@angular/forms": "^19.0.1",
-    "@angular/platform-browser": "^19.0.1",
-    "@angular/platform-browser-dynamic": "^19.0.1",
-    "@angular/router": "^19.0.1",
+    "@angular/animations": "^19.2.15",
+    "@angular/common": "^19.2.15",
+    "@angular/compiler": "^19.2.15",
+    "@angular/core": "^19.2.15",
+    "@angular/forms": "^19.2.15",
+    "@angular/platform-browser": "^19.2.15",
+    "@angular/platform-browser-dynamic": "^19.2.15",
+    "@angular/router": "^19.2.15",
     "@fortawesome/angular-fontawesome": "^1.0.0",
-    "@fortawesome/fontawesome-svg-core": "^6.7.1",
-    "@fortawesome/free-brands-svg-icons": "^6.7.1",
-    "@fortawesome/free-solid-svg-icons": "^6.7.1",
+    "@fortawesome/fontawesome-svg-core": "^6.7.2",
+    "@fortawesome/free-brands-svg-icons": "^6.7.2",
+    "@fortawesome/free-solid-svg-icons": "^6.7.2",
     "@mediapipe/selfie_segmentation": "^0.1.1675465747",
     "@zxing/ngx-scanner": "^19.0.0",
-    "bootstrap": "^5.3.3",
-    "ngx-cookie-service": "^19.0.0",
+    "bootstrap": "^5.3.8",
+    "ngx-cookie-service": "^19.1.2",
     "rxjs": "~7.8.0",
     "zone.js": "~0.15.0",
     "mediasoup-client": "3.7.17",
-    "socket.io-client": "^4.3.2"
+    "socket.io-client": "^4.8.1"
   },
   "dependencies": {
     "tslib": "^2.3.0"