mediasfu-angular 1.0.0

package/dist/lib/components/background-components/background-modal/background-modal.component.d.ts

@@ -0,0 +1,146 @@
+import { OnChanges, SimpleChanges, ElementRef, OnInit } from '@angular/core';
+import { SelfieSegmentation } from '@mediapipe/selfie_segmentation';
+import { ConnectSendTransportVideoParameters, ConnectSendTransportVideoType, CreateSendTransportParameters, CreateSendTransportType, DisconnectSendTransportVideoParameters, DisconnectSendTransportVideoType, OnScreenChangesParameters, OnScreenChangesType, ShowAlert, SleepType, VidCons } from '../../../@types/types';
+import { Producer, ProducerOptions } from 'mediasoup-client/lib/types';
+import * as i0 from "@angular/core";
+export interface BackgroundModalParameters extends CreateSendTransportParameters, ConnectSendTransportVideoParameters, DisconnectSendTransportVideoParameters, OnScreenChangesParameters {
+    customImage: string;
+    selectedImage: string;
+    segmentVideo: MediaStream | null;
+    selfieSegmentation: SelfieSegmentation | null;
+    pauseSegmentation: boolean;
+    processedStream: MediaStream | null;
+    keepBackground: boolean;
+    backgroundHasChanged: boolean;
+    virtualStream: MediaStream | null;
+    mainCanvas: HTMLCanvasElement | null;
+    prevKeepBackground: boolean;
+    appliedBackground: boolean;
+    videoAlreadyOn: boolean;
+    audioOnlyRoom: boolean;
+    islevel: string;
+    recordStarted: boolean;
+    recordResumed: boolean;
+    recordPaused: boolean;
+    recordStopped: boolean;
+    recordingMediaOptions: string;
+    showAlert?: ShowAlert;
+    localStreamVideo: MediaStream | null;
+    vidCons: VidCons;
+    frameRate: number;
+    targetResolution: string;
+    updateCustomImage: (image: string) => void;
+    updateSelectedImage: (image: string) => void;
+    updateSegmentVideo: (stream: MediaStream | null) => void;
+    updateSelfieSegmentation: (segmentation: SelfieSegmentation | null) => void;
+    updatePauseSegmentation: (pause: boolean) => void;
+    updateProcessedStream: (stream: MediaStream | null) => void;
+    updateKeepBackground: (keep: boolean) => void;
+    updateBackgroundHasChanged: (changed: boolean) => void;
+    updateVirtualStream: (stream: MediaStream | null) => void;
+    updatePrevKeepBackground: (prev: boolean) => void;
+    updateAppliedBackground: (applied: boolean) => void;
+    videoProducer: Producer | null;
+    transportCreated: boolean;
+    videoParams: ProducerOptions;
+    updateVideoParams: (params: ProducerOptions) => void;
+    autoClickBackground: boolean;
+    updateAutoClickBackground: (autoClick: boolean) => void;
+    updateMainCanvas: (canvas: HTMLCanvasElement) => void;
+    createSendTransport: CreateSendTransportType;
+    connectSendTransportVideo: ConnectSendTransportVideoType;
+    disconnectSendTransportVideo: DisconnectSendTransportVideoType;
+    onScreenChanges: OnScreenChangesType;
+    sleep: SleepType;
+    getUpdatedAllParams: () => BackgroundModalParameters;
+    [key: string]: any;
+}
+export interface BackgroundModalOptions {
+    isVisible: boolean;
+    parameters: BackgroundModalParameters;
+    position: string;
+    backgroundColor: string;
+    onClose: () => void;
+}
+export type BackgroundModalType = (options: BackgroundModalOptions) => HTMLElement;
+export declare class BackgroundModal implements OnChanges, OnInit {
+    isVisible: boolean;
+    parameters: BackgroundModalParameters;
+    position: string;
+    backgroundColor: string;
+    onClose: () => void;
+    defaultImagesContainerRef: ElementRef;
+    uploadImageInputRef: ElementRef;
+    backgroundCanvasRef: ElementRef;
+    videoPreviewRef: ElementRef;
+    captureVideoRef: ElementRef;
+    loadingOverlayRef: ElementRef;
+    applyBackgroundButtonRef: ElementRef;
+    saveBackgroundButtonRef: ElementRef;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    customImage: string;
+    selectedImage: string;
+    segmentVideo: MediaStream | null;
+    selfieSegmentation: SelfieSegmentation | null;
+    pauseSegmentation: boolean;
+    processedStream: MediaStream | null;
+    keepBackground: boolean;
+    backgroundHasChanged: boolean;
+    virtualStream: MediaStream | null;
+    mainCanvas: HTMLCanvasElement;
+    prevKeepBackground: boolean;
+    appliedBackground: boolean;
+    videoAlreadyOn: boolean;
+    audioOnlyRoom: boolean;
+    islevel: string;
+    recordStarted: boolean;
+    recordResumed: boolean;
+    recordPaused: boolean;
+    recordStopped: boolean;
+    recordingMediaOptions: string;
+    vidCons: any;
+    frameRate: number;
+    targetResolution: string;
+    videoParams: ProducerOptions;
+    autoClickBackground: boolean;
+    localStreamVideo: MediaStream | null;
+    clonedStream: MediaStream | null;
+    clonedTrack: MediaStreamTrack | null;
+    updateCustomImage: (value: string) => void;
+    updateSelectedImage: (value: string) => void;
+    updateSegmentVideo: (value: MediaStream | null) => void;
+    updateSelfieSegmentation: (value: SelfieSegmentation | null) => void;
+    updatePauseSegmentation: (value: boolean) => void;
+    updateProcessedStream: (value: MediaStream | null) => void;
+    updateKeepBackground: (value: boolean) => void;
+    updateBackgroundHasChanged: (value: boolean) => void;
+    updateVirtualStream: (value: MediaStream | null) => void;
+    updateMainCanvas: (value: HTMLCanvasElement) => void;
+    updatePrevKeepBackground: (value: boolean) => void;
+    updateAppliedBackground: (value: boolean) => void;
+    updateVideoParams: (value: ProducerOptions) => void;
+    updateAutoClickBackground: (value: boolean) => void;
+    createSendTransport: CreateSendTransportType;
+    connectSendTransportVideo: ConnectSendTransportVideoType;
+    disconnectSendTransportVideo: DisconnectSendTransportVideoType;
+    onScreenChanges: OnScreenChangesType;
+    sleep: SleepType;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    updateVariables(): void;
+    onVisibilityChange: () => Promise<void>;
+    preloadModel(): Promise<void>;
+    renderDefaultImages(): void;
+    handleImageUpload(event: Event): Promise<void>;
+    clearCanvas(): void;
+    loadImageToCanvas(src: string, fullSrc: string): Promise<void>;
+    removeBackground(img: HTMLImageElement): void;
+    applyBackground(): Promise<void>;
+    selfieSegmentationPreview(doSegmentation: boolean): Promise<void>;
+    saveBackground: () => Promise<void>;
+    handleModalClose: () => void;
+    showLoading(): void;
+    hideLoading(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<BackgroundModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BackgroundModal, "app-background-modal", never, { "isVisible": { "alias": "isVisible"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; "position": { "alias": "position"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "onClose": { "alias": "onClose"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/breakout-components/breakout-rooms-modal.component.d.ts

@@ -0,0 +1,112 @@
+import { OnChanges, SimpleChanges, ElementRef, OnInit } from '@angular/core';
+import { Socket } from 'socket.io-client';
+import { Participant, ShowAlert, BreakoutParticipant } from '../../@types/types';
+import * as i0 from "@angular/core";
+export interface BreakoutRoomsModalParameters {
+    participants: Participant[];
+    showAlert?: ShowAlert;
+    socket: Socket;
+    itemPageLimit: number;
+    meetingDisplayType: string;
+    prevMeetingDisplayType: string;
+    roomName: string;
+    shareScreenStarted: boolean;
+    shared: boolean;
+    breakOutRoomStarted: boolean;
+    breakOutRoomEnded: boolean;
+    isBreakoutRoomsModalVisible: boolean;
+    currentRoomIndex: number | null;
+    canStartBreakout: boolean;
+    breakoutRooms: BreakoutParticipant[][];
+    updateBreakOutRoomStarted: (started: boolean) => void;
+    updateBreakOutRoomEnded: (ended: boolean) => void;
+    updateCurrentRoomIndex: (roomIndex: number) => void;
+    updateCanStartBreakout: (canStart: boolean) => void;
+    updateBreakoutRooms: (breakoutRooms: BreakoutParticipant[][]) => void;
+    updateMeetingDisplayType: (displayType: string) => void;
+    getUpdatedAllParams: () => BreakoutRoomsModalParameters;
+    [key: string]: any;
+}
+export type BreakoutRoomsModalType = (options: BreakoutRoomsModalOptions) => HTMLElement;
+export interface BreakoutRoomsModalOptions {
+    isVisible: boolean;
+    parameters: BreakoutRoomsModalParameters;
+    position?: 'topRight' | 'topLeft' | 'bottomRight' | 'bottomLeft';
+    backgroundColor?: string;
+    onBreakoutRoomsClose: () => void;
+}
+export declare class BreakoutRoomsModal implements OnChanges, OnInit {
+    isVisible: boolean;
+    parameters: BreakoutRoomsModalParameters;
+    position: string;
+    backgroundColor: string;
+    onBreakoutRoomsClose: () => void;
+    roomsContainerRef: ElementRef;
+    faDoorOpen: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faRandom: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faHandPointer: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faPlus: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faSave: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faPlay: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faSyncAlt: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faStop: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faUsers: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    participantsRef: Participant[];
+    breakoutRoomsRef: BreakoutParticipant[][];
+    numRooms: string;
+    newParticipantAction: string;
+    currentRoom: BreakoutParticipant[] | null;
+    editRoomModalVisible: boolean;
+    startBreakoutButtonVisible: boolean;
+    stopBreakoutButtonVisible: boolean;
+    modalWidth: number;
+    calculateModalWidth(): void;
+    modalContainerStyle(): {
+        display: string;
+        position: string;
+        top: string;
+        left: string;
+        width: string;
+        height: string;
+        backgroundColor: string;
+        zIndex: string;
+    };
+    modalContentStyle(): {
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        width: string;
+        maxHeight: string;
+        overflowX: string;
+        overflowY: string;
+        position: string;
+        top: string;
+        bottom: string;
+        left: string;
+        right: string;
+    };
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnInit(): void;
+    initializeBreakoutRooms: () => void;
+    handleRandomAssign(): void;
+    handleManualAssign(): void;
+    handleAddRoom(): void;
+    handleSaveRooms(): void;
+    validateRooms(): boolean;
+    checkCanStartBreakout: () => void;
+    handleStartBreakout: () => void;
+    handleStopBreakout(): void;
+    handleEditRoom(roomIndex: number): void;
+    handleDeleteRoom(roomIndex: number): void;
+    handleAddParticipant(event: {
+        roomIndex: number;
+        participant: BreakoutParticipant;
+    }): void;
+    handleRemoveParticipant(event: {
+        roomIndex: number;
+        participant: BreakoutParticipant;
+    }): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<BreakoutRoomsModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BreakoutRoomsModal, "app-breakout-rooms-modal", never, { "isVisible": { "alias": "isVisible"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; "position": { "alias": "position"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "onBreakoutRoomsClose": { "alias": "onBreakoutRoomsClose"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/breakout-components/edit-room-modal/edit-room-modal.component.d.ts

@@ -0,0 +1,54 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import { BreakoutParticipant, Participant } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export declare class EditRoomModalComponent implements OnInit {
+    editRoomModalVisible: boolean;
+    currentRoom: BreakoutParticipant[];
+    participantsRef: Participant[];
+    currentRoomIndex: number;
+    position: string;
+    backgroundColor: string;
+    setEditRoomModalVisible: EventEmitter<boolean>;
+    addParticipant: EventEmitter<{
+        roomIndex: number;
+        participant: Participant | BreakoutParticipant;
+    }>;
+    removeParticipant: EventEmitter<{
+        roomIndex: number;
+        participant: Participant | BreakoutParticipant;
+    }>;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faPlus: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faUsers: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faPen: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    modalWidth: number;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    calculateModalWidth(): void;
+    modalContainerStyle(): {
+        position: string;
+        top: number;
+        left: number;
+        width: string;
+        height: string;
+        backgroundColor: string;
+        zIndex: number;
+        display: string;
+        justifyContent: string;
+        alignItems: string;
+    };
+    modalContentStyle(): {
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        width: string;
+        maxHeight: string;
+        overflowY: string;
+    };
+    handleAddParticipant(roomIndex: number, participant: BreakoutParticipant): void;
+    handleRemoveParticipant(roomIndex: number, participant: BreakoutParticipant): void;
+    closeModal(): void;
+    unassignedParticipants(): Participant[];
+    static ɵfac: i0.ɵɵFactoryDeclaration<EditRoomModalComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EditRoomModalComponent, "app-edit-room-modal", never, { "editRoomModalVisible": { "alias": "editRoomModalVisible"; "required": false; }; "currentRoom": { "alias": "currentRoom"; "required": false; }; "participantsRef": { "alias": "participantsRef"; "required": false; }; "currentRoomIndex": { "alias": "currentRoomIndex"; "required": false; }; "position": { "alias": "position"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; }, { "setEditRoomModalVisible": "setEditRoomModalVisible"; "addParticipant": "addParticipant"; "removeParticipant": "removeParticipant"; }, never, never, true, never>;
+}

package/dist/lib/components/breakout-components/room-list/room-list.component.d.ts

@@ -0,0 +1,20 @@
+import { EventEmitter } from '@angular/core';
+import { BreakoutParticipant, Participant } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export declare class RoomListComponent {
+    rooms: BreakoutParticipant[][];
+    editRoom: EventEmitter<number>;
+    deleteRoom: EventEmitter<number>;
+    removeParticipant: EventEmitter<{
+        roomIndex: number;
+        participant: BreakoutParticipant | Participant;
+    }>;
+    faPen: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faUsers: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    handleEditRoom(roomIndex: number): void;
+    handleDeleteRoom(roomIndex: number): void;
+    handleRemoveParticipant(roomIndex: number, participant: BreakoutParticipant | Participant): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RoomListComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RoomListComponent, "app-room-list", never, { "rooms": { "alias": "rooms"; "required": false; }; }, { "editRoom": "editRoom"; "deleteRoom": "deleteRoom"; "removeParticipant": "removeParticipant"; }, never, never, true, never>;
+}

package/dist/lib/components/co-host-components/co-host-modal/co-host-modal.component.d.ts

@@ -0,0 +1,86 @@
+import { OnChanges, SimpleChanges, OnInit } from '@angular/core';
+import { ModifyCoHostSettings } from '../../../methods/co-host-methods/modify-co-host-settings.service';
+import { Participant, CoHostResponsibility, ModifyCoHostSettingsOptions, ShowAlert } from '../../../@types/types';
+import { Socket } from 'socket.io-client';
+import * as i0 from "@angular/core";
+export interface CoHostModalOptions {
+    isCoHostModalVisible: boolean;
+    currentCohost?: string;
+    participants: Participant[];
+    coHostResponsibility: CoHostResponsibility[];
+    position?: string;
+    backgroundColor?: string;
+    roomName: string;
+    showAlert?: ShowAlert;
+    updateCoHostResponsibility: (coHostResponsibility: CoHostResponsibility[]) => void;
+    updateCoHost: (coHost: string) => void;
+    updateIsCoHostModalVisible: (isCoHostModalVisible: boolean) => void;
+    socket: Socket;
+    onCoHostClose: () => void;
+    onModifyEventSettings?: (settings: ModifyCoHostSettingsOptions) => void;
+}
+export type CoHostModalType = (options: CoHostModalOptions) => HTMLElement;
+export declare class CoHostModal implements OnChanges, OnInit {
+    private modifyCoHostSettingsService;
+    isCoHostModalVisible: boolean;
+    currentCohost: string;
+    participants: Participant[];
+    coHostResponsibility: CoHostResponsibility[];
+    position: string;
+    backgroundColor: string;
+    roomName: string;
+    showAlert: ShowAlert;
+    updateCoHostResponsibility: (coHostResponsibility: CoHostResponsibility[]) => void;
+    updateCoHost: (coHost: string) => void;
+    updateIsCoHostModalVisible: (isCoHostModalVisible: boolean) => void;
+    socket: Socket;
+    onCoHostClose: () => void;
+    onModifyCoHost: (settings: ModifyCoHostSettingsOptions) => void;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    selectedCohost: string;
+    CoHostResponsibilityCopy: any[];
+    CoHostResponsibilityCopyAlt: any[];
+    responsibilities: {
+        [key: string]: boolean;
+    };
+    responsibilityKeys: {
+        manageKey: string;
+        dedicateKey: string;
+    }[];
+    modalWidth: number;
+    constructor(modifyCoHostSettingsService: ModifyCoHostSettings);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    initializeResponsibilities(): void;
+    get filteredParticipants(): Participant[];
+    handleToggleSwitch(key: string): void;
+    handleSave(): void;
+    handleClose(): void;
+    calculateModalWidth(): void;
+    modalContainerStyle(): {
+        display: string;
+        position: string;
+        top: string;
+        left: string;
+        width: string;
+        height: string;
+        backgroundColor: string;
+        zIndex: string;
+    };
+    modalContentStyle(): {
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        width: string;
+        maxHeight: string;
+        overflowX: string;
+        overflowY: string;
+        position: string;
+        top: string;
+        bottom: string;
+        left: string;
+        right: string;
+    };
+    static ɵfac: i0.ɵɵFactoryDeclaration<CoHostModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CoHostModal, "app-co-host-modal", never, { "isCoHostModalVisible": { "alias": "isCoHostModalVisible"; "required": false; }; "currentCohost": { "alias": "currentCohost"; "required": false; }; "participants": { "alias": "participants"; "required": false; }; "coHostResponsibility": { "alias": "coHostResponsibility"; "required": false; }; "position": { "alias": "position"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "roomName": { "alias": "roomName"; "required": false; }; "showAlert": { "alias": "showAlert"; "required": false; }; "updateCoHostResponsibility": { "alias": "updateCoHostResponsibility"; "required": false; }; "updateCoHost": { "alias": "updateCoHost"; "required": false; }; "updateIsCoHostModalVisible": { "alias": "updateIsCoHostModalVisible"; "required": false; }; "socket": { "alias": "socket"; "required": false; }; "onCoHostClose": { "alias": "onCoHostClose"; "required": false; }; "onModifyCoHost": { "alias": "onModifyCoHost"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/display-components/alert-component/alert.component.component.d.ts

@@ -0,0 +1,50 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import * as i0 from "@angular/core";
+export interface AlertComponentOptions {
+    visible: boolean;
+    message: string;
+    type: 'success' | 'danger';
+    duration?: number;
+    onHide?: () => void;
+    textColor?: string;
+}
+export type AlertComponentType = (options: AlertComponentOptions) => HTMLElement;
+/**
+ * AlertComponent is a standalone Angular component that displays an alert message.
+ * It supports different types of alerts such as 'success' and 'danger', and can be configured
+ * to automatically hide after a specified duration.
+ *
+ * @selector app-alert-component
+ * @standalone true
+ * @imports CommonModule
+ * @templateUrl ./alert.component.html
+ * @styleUrls ./alert.component.css
+ *
+ * @class AlertComponent
+ * @implements OnChanges
+ *
+ * @property {boolean} visible - Determines if the alert is visible.
+ * @property {string} message - The message to be displayed in the alert.
+ * @property {'success' | 'danger'} type - The type of alert, either 'success' or 'danger'.
+ * @property {number} duration - The duration (in milliseconds) for which the alert is visible before hiding.
+ * @property {string} textColor - The color of the text in the alert.
+ * @property {() => void} onHide - A callback function that is called when the alert is hidden.
+ *
+ * @method ngOnChanges - Lifecycle hook that is called when any data-bound property of a directive changes.
+ * @param {SimpleChanges} changes - An object of changes to the data-bound properties.
+ *
+ * @method handlePress - Manually hides the alert by calling the onHide callback.
+ */
+export declare class AlertComponent implements OnChanges {
+    visible: boolean;
+    message: string;
+    type: 'success' | 'danger';
+    duration: number;
+    textColor: string;
+    onHide: () => void;
+    alertType: 'success' | 'danger';
+    ngOnChanges(changes: SimpleChanges): void;
+    handlePress(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AlertComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AlertComponent, "app-alert-component", never, { "visible": { "alias": "visible"; "required": false; }; "message": { "alias": "message"; "required": false; }; "type": { "alias": "type"; "required": false; }; "duration": { "alias": "duration"; "required": false; }; "textColor": { "alias": "textColor"; "required": false; }; "onHide": { "alias": "onHide"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/display-components/audio-card/audio-card.component.d.ts

@@ -0,0 +1,84 @@
+import { OnInit, OnDestroy, NgZone } from '@angular/core';
+import { ControlMedia } from '../../../consumers/control-media.service';
+import { Participant, ControlsPosition, InfoPosition, AudioDecibels, ControlMediaOptions, ShowAlert, CoHostResponsibility, CustomComponent } from '../../../@types/types';
+import { Socket } from 'socket.io-client';
+import * as i0 from "@angular/core";
+export interface AudioCardParameters {
+    audioDecibels: AudioDecibels[];
+    participants: Participant[];
+    socket: Socket;
+    coHostResponsibility: CoHostResponsibility[];
+    roomName: string;
+    showAlert?: ShowAlert;
+    coHost: string;
+    islevel: string;
+    member: string;
+    eventType: string;
+    getUpdatedAllParams(): AudioCardParameters;
+}
+export interface AudioCardOptions {
+    controlUserMedia?: (options: ControlMediaOptions) => Promise<void>;
+    customStyle?: Partial<CSSStyleDeclaration>;
+    name: string;
+    barColor?: string;
+    textColor?: string;
+    imageSource?: string;
+    roundedImage?: boolean;
+    imageStyle?: Partial<CSSStyleDeclaration>;
+    showControls?: boolean;
+    showInfo?: boolean;
+    videoInfoComponent?: HTMLElement | CustomComponent;
+    videoControlsComponent?: HTMLElement | CustomComponent;
+    controlsPosition?: ControlsPosition;
+    infoPosition?: InfoPosition;
+    participant: Participant;
+    backgroundColor?: string;
+    audioDecibels?: AudioDecibels;
+    parameters: AudioCardParameters;
+}
+export type AudioCardType = (options: AudioCardOptions) => HTMLElement;
+export declare class AudioCard implements OnInit, OnDestroy {
+    private ngZone;
+    private controlMediaService;
+    controlUserMedia?: (options: ControlMediaOptions) => Promise<void>;
+    customStyle: Partial<CSSStyleDeclaration>;
+    name: string;
+    barColor: string;
+    textColor: string;
+    imageSource: string;
+    roundedImage: boolean;
+    imageStyle: Partial<CSSStyleDeclaration>;
+    showControls: boolean;
+    showInfo: boolean;
+    videoInfoComponent?: HTMLElement | CustomComponent;
+    videoControlsComponent?: HTMLElement | CustomComponent;
+    controlsPosition: string;
+    infoPosition: string;
+    participant: Participant | null;
+    backgroundColor: string;
+    audioDecibels: any;
+    parameters: AudioCardParameters;
+    faVideo: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faVideoSlash: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faMicrophone: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faMicrophoneSlash: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    waveformAnimations: number[];
+    showWaveform: boolean;
+    interval: any;
+    constructor(ngZone: NgZone, controlMediaService: ControlMedia, injectedControlUserMedia: (options: ControlMediaOptions) => Promise<void>, injectedCustomStyle: Partial<CSSStyleDeclaration>, injectedName: string, injectedBarColor: string, injectedTextColor: string, injectedImageSource: string, injectedRoundedImage: boolean, injectedImageStyle: Partial<CSSStyleDeclaration>, injectedShowControls: boolean, injectedShowInfo: boolean, injectedVideoInfoComponent: HTMLElement | CustomComponent, injectedVideoControlsComponent: HTMLElement | CustomComponent, injectedControlsPosition: ControlsPosition, injectedInfoPosition: InfoPosition, injectedParticipant: Participant | null, injectedBackgroundColor: string, injectedAudioDecibels: AudioDecibels, injectedParameters: AudioCardParameters);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    animateBar(index: number): void;
+    animateWaveform(): void;
+    resetWaveform(): void;
+    getAnimationDuration(index: number): number;
+    toggleAudio(): Promise<void>;
+    toggleVideo(): Promise<void>;
+    renderControls(): boolean;
+    combineStyles(baseStyle: any, additionalStyles: any): any;
+    getOverlayPosition(position: string): import("../../../@types/types").OverlayPositionStyle;
+    isCustomComponent(comp: HTMLElement | CustomComponent | (() => HTMLElement | CustomComponent)): comp is CustomComponent;
+    isFunctionComponent(comp: HTMLElement | CustomComponent | (() => HTMLElement | CustomComponent)): comp is () => HTMLElement | CustomComponent;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AudioCard, [null, null, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AudioCard, "app-audio-card", never, { "controlUserMedia": { "alias": "controlUserMedia"; "required": false; }; "customStyle": { "alias": "customStyle"; "required": false; }; "name": { "alias": "name"; "required": false; }; "barColor": { "alias": "barColor"; "required": false; }; "textColor": { "alias": "textColor"; "required": false; }; "imageSource": { "alias": "imageSource"; "required": false; }; "roundedImage": { "alias": "roundedImage"; "required": false; }; "imageStyle": { "alias": "imageStyle"; "required": false; }; "showControls": { "alias": "showControls"; "required": false; }; "showInfo": { "alias": "showInfo"; "required": false; }; "videoInfoComponent": { "alias": "videoInfoComponent"; "required": false; }; "videoControlsComponent": { "alias": "videoControlsComponent"; "required": false; }; "controlsPosition": { "alias": "controlsPosition"; "required": false; }; "infoPosition": { "alias": "infoPosition"; "required": false; }; "participant": { "alias": "participant"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "audioDecibels": { "alias": "audioDecibels"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/display-components/audio-grid/audio-grid.component.d.ts

@@ -0,0 +1,23 @@
+import { Injector, OnChanges, SimpleChanges } from '@angular/core';
+import * as i0 from "@angular/core";
+export interface AudioGridOptions {
+    componentsToRender: {
+        component: any;
+        inputs?: any;
+    }[];
+}
+export type AudioGridType = (options: AudioGridOptions) => HTMLElement;
+export declare class AudioGrid implements OnChanges {
+    private injector;
+    componentsToRender: {
+        component: any;
+        inputs?: any;
+    }[];
+    private injectorCache;
+    constructor(injector: Injector);
+    ngOnChanges(changes: SimpleChanges): void;
+    createInjector(inputs: any): Injector;
+    private clearInjectorCache;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AudioGrid, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AudioGrid, "app-audio-grid", never, { "componentsToRender": { "alias": "componentsToRender"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/display-components/card-video-display/card-video-display.component.d.ts

@@ -0,0 +1,37 @@
+import { OnInit, OnChanges, SimpleChanges, ElementRef } from '@angular/core';
+import { EventType } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export interface CardVideoDisplayOptions {
+    remoteProducerId: string;
+    eventType: string;
+    forceFullDisplay: boolean;
+    videoStream: MediaStream | null;
+    backgroundColor: string;
+    doMirror?: boolean;
+}
+export type CardVideoDisplayType = (options: CardVideoDisplayOptions) => HTMLElement;
+export declare class CardVideoDisplay implements OnInit, OnChanges {
+    remoteProducerId: string;
+    eventType: EventType;
+    forceFullDisplay: boolean;
+    videoStream: MediaStream | null;
+    backgroundColor: string;
+    doMirror: boolean;
+    videoElement: ElementRef<HTMLVideoElement>;
+    videoContainerStyle: any;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    updateVideoStream(): void;
+    setVideoContainerStyle(): void;
+    getBaseVideoContainerStyle(): {
+        display: string;
+        justifyContent: string;
+        alignItems: string;
+        width: string;
+        height: string;
+        backgroundColor: string;
+    };
+    getVideoStyle(): any;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CardVideoDisplay, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CardVideoDisplay, "app-card-video-display", never, { "remoteProducerId": { "alias": "remoteProducerId"; "required": false; }; "eventType": { "alias": "eventType"; "required": false; }; "forceFullDisplay": { "alias": "forceFullDisplay"; "required": false; }; "videoStream": { "alias": "videoStream"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "doMirror": { "alias": "doMirror"; "required": false; }; }, {}, never, never, true, never>;
+}