mediasfu-angular 1.0.0

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

@@ -0,0 +1,117 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import { EventType, ConfirmRecordingParameters, StartRecordingParameters, ConfirmRecordingOptions, StartRecordingOptions } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export interface RecordingModalParameters extends ConfirmRecordingParameters, StartRecordingParameters {
+    recordPaused: boolean;
+    recordingVideoType: string;
+    recordingDisplayType: 'video' | 'media' | 'all';
+    recordingBackgroundColor: string;
+    recordingNameTagsColor: string;
+    recordingOrientationVideo: string;
+    recordingNameTags: boolean;
+    recordingAddText: boolean;
+    recordingCustomText: string;
+    recordingCustomTextPosition: string;
+    recordingCustomTextColor: string;
+    recordingMediaOptions: string;
+    recordingAudioOptions: string;
+    recordingVideoOptions: string;
+    recordingAddHLS: boolean;
+    eventType: EventType;
+    updateRecordingVideoType: (value: string) => void;
+    updateRecordingDisplayType: (value: 'video' | 'media' | 'all') => void;
+    updateRecordingBackgroundColor: (value: string) => void;
+    updateRecordingNameTagsColor: (value: string) => void;
+    updateRecordingOrientationVideo: (value: string) => void;
+    updateRecordingNameTags: (value: boolean) => void;
+    updateRecordingAddText: (value: boolean) => void;
+    updateRecordingCustomText: (value: string) => void;
+    updateRecordingCustomTextPosition: (value: string) => void;
+    updateRecordingCustomTextColor: (value: string) => void;
+    updateRecordingMediaOptions: (value: string) => void;
+    updateRecordingAudioOptions: (value: string) => void;
+    updateRecordingVideoOptions: (value: string) => void;
+    updateRecordingAddHLS: (value: boolean) => void;
+    getUpdatedAllParams: () => RecordingModalParameters;
+    [key: string]: any;
+}
+export interface RecordingModalOptions {
+    isRecordingModalVisible: boolean;
+    onClose: () => void;
+    backgroundColor: string;
+    position: string;
+    confirmRecording: (options: ConfirmRecordingOptions) => void;
+    startRecording: (options: StartRecordingOptions) => void;
+    parameters: RecordingModalParameters;
+}
+export type RecordingModalType = (options: RecordingModalOptions) => HTMLElement;
+/**
+ * Component representing a recording modal.
+ *
+ * @selector app-recording-modal
+ * @standalone true
+ * @imports CommonModule, FontAwesomeModule, StandardPanelComponent, AdvancedPanelComponent
+ * @templateUrl ./recording-modal.component.html
+ * @styleUrls ./recording-modal.component.css
+ *
+ * @class RecordingModal
+ * @implements OnChanges
+ *
+ * @property {boolean} isRecordingModalVisible - Determines if the recording modal is visible.
+ * @property {() => void} onClose - Callback function to close the modal.
+ * @property {string} backgroundColor - Background color of the modal.
+ * @property {string} position - Position of the modal on the screen.
+ * @property {(options: ConfirmRecordingOptions) => void} confirmRecording - Callback function to confirm recording.
+ * @property {(options: StartRecordingOptions) => void} startRecording - Callback function to start recording.
+ * @property {RecordingModalParameters} parameters - Parameters for the recording modal.
+ *
+ * @property {IconDefinition} faTimes - FontAwesome icon for times (close).
+ * @property {IconDefinition} faCheck - FontAwesome icon for check (confirm).
+ * @property {IconDefinition} faPlay - FontAwesome icon for play (start).
+ *
+ * @method modalContainerStyle - Returns the style object for the modal container.
+ * @method modalContentStyle - Returns the style object for the modal content.
+ * @method ngOnChanges - Lifecycle hook that is called when any data-bound property of a directive changes.
+ * @method confirm - Calls the confirmRecording callback with the current parameters.
+ * @method start - Calls the startRecording callback with the current parameters.
+ */
+export declare class RecordingModal implements OnChanges {
+    isRecordingModalVisible: boolean;
+    onClose: () => void;
+    backgroundColor: string;
+    position: string;
+    confirmRecording: (options: ConfirmRecordingOptions) => void;
+    startRecording: (options: StartRecordingOptions) => void;
+    parameters: RecordingModalParameters;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faCheck: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faPlay: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    get modalContainerStyle(): {
+        position: string;
+        top: number;
+        left: number;
+        width: string;
+        height: string;
+        backgroundColor: string;
+        display: string;
+        zIndex: number;
+    };
+    get modalContentStyle(): {
+        position: string;
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        width: string;
+        maxHeight: string;
+        overflowY: string;
+        top: string;
+        bottom: string;
+        left: string;
+        right: string;
+    };
+    ngOnChanges(changes: SimpleChanges): void;
+    confirm(): void;
+    start(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RecordingModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RecordingModal, "app-recording-modal", never, { "isRecordingModalVisible": { "alias": "isRecordingModalVisible"; "required": false; }; "onClose": { "alias": "onClose"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "position": { "alias": "position"; "required": false; }; "confirmRecording": { "alias": "confirmRecording"; "required": false; }; "startRecording": { "alias": "startRecording"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/recording-components/standard-panel-component/standard-panel-component.component.d.ts

@@ -0,0 +1,58 @@
+import { OnInit, OnChanges, SimpleChanges } from '@angular/core';
+import { EventType } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export interface StandardPanelParameters {
+    recordingMediaOptions: string;
+    recordingAudioOptions: string;
+    recordingVideoOptions: string;
+    recordingAddHLS: boolean;
+    updateRecordingMediaOptions: (mediaOptions: string) => void;
+    updateRecordingAudioOptions: (audioOptions: string) => void;
+    updateRecordingVideoOptions: (videoOptions: string) => void;
+    updateRecordingAddHLS: (addHLS: boolean) => void;
+    eventType: EventType;
+}
+export type StandardPanelType = (options: StandardPanelParameters) => HTMLElement;
+/**
+ * @component StandardPanelComponent
+ * @description This component represents a standard panel for recording options.
+ * It allows users to select media, audio, and video options, as well as toggle HLS recording.
+ *
+ * @selector app-standard-panel-component
+ * @standalone true
+ * @templateUrl ./standard-panel-component.component.html
+ * @styleUrls ./standard-panel-component.component.css
+ * @imports [CommonModule, FormsModule]
+ *
+ * @input {StandardPanelParameters} parameters - The parameters for the standard panel component.
+ *
+ * @property {string} selectedRecordingMediaOptions - The selected media options for recording.
+ * @property {string} selectedRecordingAudioOptions - The selected audio options for recording.
+ * @property {string} selectedRecordingVideoOptions - The selected video options for recording.
+ * @property {boolean} selectedRecordingAddHLS - The flag indicating whether HLS recording is enabled.
+ *
+ * @method ngOnInit - Initializes the component and sets the initial values for recording options.
+ * @method ngOnChanges - Handles changes to the input parameters and updates the recording options accordingly.
+ * @method handleMediaOptionsChange - Handles changes to the media options and updates the parameters.
+ * @method handleAudioOptionsChange - Handles changes to the audio options and updates the parameters.
+ * @method handleVideoOptionsChange - Handles changes to the video options and updates the parameters.
+ * @method handleAddHLSChange - Handles changes to the HLS recording option and updates the parameters.
+ *
+ * @param {SimpleChanges} changes - The changes to the input properties.
+ * @param {any} event - The event object from the change event.
+ */
+export declare class StandardPanelComponent implements OnInit, OnChanges {
+    parameters: StandardPanelParameters;
+    selectedRecordingMediaOptions: string;
+    selectedRecordingAudioOptions: string;
+    selectedRecordingVideoOptions: string;
+    selectedRecordingAddHLS: boolean;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    handleMediaOptionsChange(event: any): void;
+    handleAudioOptionsChange(event: any): void;
+    handleVideoOptionsChange(event: any): void;
+    handleAddHLSChange(event: any): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<StandardPanelComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<StandardPanelComponent, "app-standard-panel-component", never, { "parameters": { "alias": "parameters"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/requests-components/render-request-component/render-request-component.component.d.ts

@@ -0,0 +1,34 @@
+import { IconDefinition } from '@fortawesome/free-solid-svg-icons';
+import { RespondToRequestsType, RespondToRequestsOptions, Request } from '../../../@types/types';
+import { Socket } from 'socket.io-client';
+import * as i0 from "@angular/core";
+export interface RenderRequestComponentOptions {
+    request: Request;
+    onRequestItemPress: RespondToRequestsType;
+    requestList: Request[];
+    updateRequestList: (newRequestList: Request[]) => void;
+    roomName: string;
+    socket: Socket;
+}
+export type RenderRequestComponentType = (options: RenderRequestComponentOptions) => HTMLElement;
+export declare class RenderRequestComponent {
+    request: Request;
+    requestList: Request[];
+    roomName: string;
+    socket: Socket;
+    onRequestItemPress: (options: RespondToRequestsOptions) => void;
+    updateRequestList: (newRequestList: Request[]) => void;
+    faMicrophone: IconDefinition;
+    faDesktop: IconDefinition;
+    faVideo: IconDefinition;
+    faComments: IconDefinition;
+    faCheck: IconDefinition;
+    faTimes: IconDefinition;
+    keyMap: {
+        [key: string]: IconDefinition;
+    };
+    getIcon(iconName: string): IconDefinition;
+    handleRequestAction: (action: string) => void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RenderRequestComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RenderRequestComponent, "app-render-request-component", never, { "request": { "alias": "request"; "required": false; }; "requestList": { "alias": "requestList"; "required": false; }; "roomName": { "alias": "roomName"; "required": false; }; "socket": { "alias": "socket"; "required": false; }; "onRequestItemPress": { "alias": "onRequestItemPress"; "required": false; }; "updateRequestList": { "alias": "updateRequestList"; "required": false; }; }, {}, never, never, true, never>;
+}

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

@@ -0,0 +1,94 @@
+import { OnChanges, SimpleChanges, OnInit } from '@angular/core';
+import { RenderRequestComponentOptions } from '../render-request-component/render-request-component.component';
+import { RespondToRequests, RespondToRequestsType } from '../../../methods/requests-methods/respond-to-requests.service';
+import { Socket } from 'socket.io-client';
+import { Request } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export interface RequestsModalParameters {
+    getUpdatedAllParams: () => {
+        filteredRequestList: Request[];
+    };
+    [key: string]: any;
+}
+export interface RequestsModalOptions {
+    isRequestsModalVisible: boolean;
+    requestCounter: number;
+    requestList: Request[];
+    roomName: string;
+    socket: Socket;
+    backgroundColor: string;
+    position: string;
+    parameters: RequestsModalParameters;
+    onRequestClose: () => void;
+    onRequestFilterChange: (filter: string) => void;
+    onRequestItemPress?: RespondToRequestsType;
+    updateRequestList: (newRequestList: any[]) => void;
+}
+export type RequestsModalType = (options: RenderRequestComponentOptions) => HTMLElement;
+/**
+ * @component RequestsModal
+ * @description A modal component to display and manage requests.
+ *
+ * @selector app-requests-modal
+ * @standalone true
+ * @imports [CommonModule, FontAwesomeModule, RenderRequestComponent]
+ * @templateUrl ./requests-modal.component.html
+ * @styleUrls ./requests-modal.component.css
+ *
+ * @property {boolean} isRequestsModalVisible - Determines if the requests modal is visible.
+ * @property {number} requestCounter - Counter for the number of requests.
+ * @property {Request[]} requestList - List of requests.
+ * @property {string} roomName - Name of the room.
+ * @property {Socket} socket - Socket instance for communication.
+ * @property {string} backgroundColor - Background color of the modal.
+ * @property {string} position - Position of the modal.
+ * @property {any} parameters - Additional parameters for the modal.
+ * @property {Function} onRequestClose - Callback function when the modal is closed.
+ * @property {Function} onRequestFilterChange - Callback function when the request filter changes.
+ * @property {Function} onRequestItemPress - Callback function when a request item is pressed.
+ * @property {Function} updateRequestList - Function to update the request list.
+ *
+ * @property {IconDefinition} faTimes - FontAwesome icon for closing the modal.
+ * @property {any[]} requestList_s - Filtered list of requests.
+ * @property {number} requestCounter_s - Counter for the filtered list of requests.
+ * @property {boolean} reRender - Flag to trigger re-rendering.
+ *
+ * @constructor
+ * @param {RespondToRequests} respondToRequestsService - Service to handle request responses.
+ *
+ * @method ngOnInit - Lifecycle hook that is called after data-bound properties are initialized.
+ * @method ngOnChanges - Lifecycle hook that is called when any data-bound property changes.
+ * @param {SimpleChanges} changes - Object of current and previous property values.
+ *
+ * @method updateRequests - Updates the request list and counter based on the current parameters.
+ * @method handleModalClose - Handles the modal close action.
+ * @method handleFilterChange - Handles the filter change event.
+ * @param {Event} event - The filter change event.
+ */
+export declare class RequestsModal implements OnInit, OnChanges {
+    private respondToRequestsService;
+    isRequestsModalVisible: boolean;
+    requestCounter: number;
+    requestList: Request[];
+    roomName: string;
+    socket: Socket;
+    backgroundColor: string;
+    position: string;
+    parameters: any;
+    onRequestClose: () => void;
+    onRequestFilterChange: (filter: string) => void;
+    onRequestItemPress: (params: any) => void;
+    updateRequestList: (newRequestList: any[]) => void;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    requestList_s: any[];
+    requestCounter_s: number;
+    reRender: boolean;
+    constructor(respondToRequestsService: RespondToRequests);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    updateRequests(): void;
+    handleModalClose(): void;
+    handleFilterChange(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RequestsModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RequestsModal, "app-requests-modal", never, { "isRequestsModalVisible": { "alias": "isRequestsModalVisible"; "required": false; }; "requestCounter": { "alias": "requestCounter"; "required": false; }; "requestList": { "alias": "requestList"; "required": false; }; "roomName": { "alias": "roomName"; "required": false; }; "socket": { "alias": "socket"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "position": { "alias": "position"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; "onRequestClose": { "alias": "onRequestClose"; "required": false; }; "onRequestFilterChange": { "alias": "onRequestFilterChange"; "required": false; }; "onRequestItemPress": { "alias": "onRequestItemPress"; "required": false; }; "updateRequestList": { "alias": "updateRequestList"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/screenboard-components/screenboard/screenboard.component.d.ts

@@ -0,0 +1,210 @@
+import { OnInit, ElementRef, AfterViewInit, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
+import { SleepType, ShowAlert } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export interface ScreenboardParameters {
+    updateCanvasScreenboard: (canvas: HTMLCanvasElement) => void;
+    annotateScreenStream: boolean;
+    updateAnnotateScreenStream: (annotateScreenStream: boolean) => void;
+    updateIsScreenboardModalVisible: (isVisible: boolean) => void;
+    sleep: SleepType;
+    showAlert?: ShowAlert;
+    getUpdatedAllParams: () => ScreenboardParameters;
+    [key: string]: any;
+}
+export interface ScreenboardOptions {
+    customWidth: number;
+    customHeight: number;
+    parameters: ScreenboardParameters;
+    showAspect: boolean;
+}
+export type ScreenboardType = (options: ScreenboardOptions) => void;
+/**
+ * @fileoverview Screenboard component for MediaSFU-Angular application.
+ *
+ * This component provides a screenboard with drawing, freehand, shape, and erase modes.
+ * It supports mouse and touch events for drawing on a canvas.
+ *
+ * @component
+ * @selector app-screenboard
+ * @templateUrl ./screenboard.component.html
+ * @styleUrls ./screenboard.component.css
+ * @imports CommonModule, FontAwesomeModule, FormsModule
+ *
+ * @class Screenboard
+ * @implements OnInit, AfterViewInit, OnDestroy, OnChanges
+ *
+ * @property {number} customWidth - Custom width for the screenboard.
+ * @property {number} customHeight - Custom height for the screenboard.
+ * @property {any} parameters - Parameters for the screenboard.
+ * @property {boolean} showAspect - Flag to show aspect ratio.
+ *
+ * @property {ElementRef<HTMLCanvasElement>} canvasRef - Reference to the canvas element.
+ * @property {ElementRef<HTMLDivElement>} screenboardRef - Reference to the screenboard div element.
+ * @property {ElementRef<HTMLDivElement>} screenboardContentRef - Reference to the screenboard content div element.
+ *
+ * @property {IconDefinition} faChevronRight - FontAwesome icon for chevron right.
+ * @property {IconDefinition} faChevronLeft - FontAwesome icon for chevron left.
+ * @property {IconDefinition} faPencilAlt - FontAwesome icon for pencil.
+ * @property {IconDefinition} faPaintBrush - FontAwesome icon for paint brush.
+ * @property {IconDefinition} faShapes - FontAwesome icon for shapes.
+ * @property {IconDefinition} faEraser - FontAwesome icon for eraser.
+ * @property {IconDefinition} faSearch - FontAwesome icon for search.
+ * @property {IconDefinition} faSearchPlus - FontAwesome icon for search plus.
+ * @property {IconDefinition} faSearchMinus - FontAwesome icon for search minus.
+ * @property {IconDefinition} faFont - FontAwesome icon for font.
+ * @property {IconDefinition} faTextHeight - FontAwesome icon for text height.
+ * @property {IconDefinition} faUndo - FontAwesome icon for undo.
+ * @property {IconDefinition} faRedo - FontAwesome icon for redo.
+ * @property {IconDefinition} faSave - FontAwesome icon for save.
+ * @property {IconDefinition} faTrash - FontAwesome icon for trash.
+ * @property {IconDefinition} faTimes - FontAwesome icon for times.
+ * @property {IconDefinition} faMousePointer - FontAwesome icon for mouse pointer.
+ *
+ * @property {'draw' | 'freehand' | 'shape' | 'erase'} mode - Current drawing mode.
+ * @property {boolean} isDrawing - Flag to indicate if drawing is in progress.
+ * @property {number} startX - Starting X coordinate for drawing.
+ * @property {number} startY - Starting Y coordinate for drawing.
+ * @property {number} currentX - Current X coordinate for drawing.
+ * @property {number} currentY - Current Y coordinate for drawing.
+ * @property {Array<{ x: number; y: number; color: string; thickness: number }>} freehandDrawing - Array of points for freehand drawing.
+ * @property {any[]} shapes - Array of shapes drawn on the canvas.
+ * @property {number} eraserThickness - Thickness of the eraser.
+ * @property {number} brushThickness - Thickness of the brush.
+ * @property {number} lineThickness - Thickness of the line.
+ * @property {string} lineType - Type of the line (solid, dashed, dotted, dashDot).
+ * @property {string} color - Color for drawing.
+ * @property {string} font - Font for text.
+ * @property {number} fontSize - Font size for text.
+ * @property {string | null} shape - Current shape being drawn.
+ * @property {boolean} toolbarVisible - Flag to indicate if the toolbar is visible.
+ * @property {string | null} dropdownOpen - ID of the currently open dropdown.
+ * @property {HTMLCanvasElement} canvas - Canvas element.
+ * @property {CanvasRenderingContext2D} ctx - Canvas rendering context.
+ *
+ * @constructor
+ * @param {number} [injectedCustomWidth] - Injected custom width.
+ * @param {number} [injectedCustomHeight] - Injected custom height.
+ * @param {any} [injectedParameters] - Injected parameters.
+ * @param {boolean} [injectedShowAspect] - Injected show aspect flag.
+ *
+ * @method ngOnInit - Lifecycle hook that is called after data-bound properties are initialized.
+ * @method ngOnChanges - Lifecycle hook that is called when any data-bound property changes.
+ * @method ngAfterViewInit - Lifecycle hook that is called after the component's view has been fully initialized.
+ * @method ngOnDestroy - Lifecycle hook that is called just before the component is destroyed.
+ *
+ * @method addListeners - Adds event listeners to the canvas.
+ * @method handleMouseDown - Handles mouse down events.
+ * @method handleMouseMove - Handles mouse move events.
+ * @method handleMouseUp - Handles mouse up events.
+ * @method handleTouchStart - Handles touch start events.
+ * @method handleTouchMove - Handles touch move events.
+ * @method handleTouchEnd - Handles touch end events.
+ * @method handleClickOutside - Handles click events outside the component.
+ * @method handleDropdownClick - Handles dropdown click events.
+ * @method setDrawMode - Sets the drawing mode.
+ * @method setFreehandMode - Sets the freehand mode.
+ * @method setShapeMode - Sets the shape mode.
+ * @method setEraseMode - Sets the erase mode.
+ * @method startDrawing - Starts the drawing process.
+ * @method draw - Draws on the canvas.
+ * @method stopDrawing - Stops the drawing process.
+ * @method drawLine - Draws a line on the canvas.
+ * @method drawShapes - Draws all shapes on the canvas.
+ * @method drawFreehand - Draws freehand on the canvas.
+ * @method drawShape - Draws a shape on the canvas.
+ * @method drawPolygon - Draws a polygon on the canvas.
+ * @method removeShape - Removes the first shape from the shapes array.
+ * @method erase - Erases part of the drawing.
+ * @method isPointNearLine - Checks if a point is near a line.
+ * @method toggleToolbar - Toggles the visibility of the toolbar.
+ * @method toggleAnnotate - Toggles the annotation mode.
+ */
+export declare class Screenboard implements OnInit, AfterViewInit, OnDestroy, OnChanges {
+    customWidth: number;
+    customHeight: number;
+    parameters: ScreenboardParameters;
+    showAspect: boolean;
+    canvasRef: ElementRef<HTMLCanvasElement>;
+    screenboardRef: ElementRef<HTMLDivElement>;
+    screenboardContentRef: ElementRef<HTMLDivElement>;
+    faChevronRight: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faChevronLeft: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faPencilAlt: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faPaintBrush: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faShapes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faEraser: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faSearch: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faSearchPlus: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faSearchMinus: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faFont: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faTextHeight: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faUndo: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faRedo: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faSave: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faTrash: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faMousePointer: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    mode: 'draw' | 'freehand' | 'shape' | 'erase';
+    isDrawing: boolean;
+    startX: number;
+    startY: number;
+    currentX: number;
+    currentY: number;
+    freehandDrawing: {
+        x: number;
+        y: number;
+        color: string;
+        thickness: number;
+    }[];
+    shapes: any[];
+    eraserThickness: number;
+    brushThickness: number;
+    lineThickness: number;
+    lineType: string;
+    color: string;
+    font: string;
+    fontSize: number;
+    shape: string | null;
+    toolbarVisible: boolean;
+    dropdownOpen: string | null;
+    canvas: HTMLCanvasElement;
+    ctx: CanvasRenderingContext2D;
+    constructor(injectedCustomWidth: number, injectedCustomHeight: number, injectedParameters: any, injectedShowAspect: boolean);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    addListeners: () => void;
+    handleMouseDown(event: MouseEvent): void;
+    handleMouseMove(event: MouseEvent): void;
+    handleMouseUp(): void;
+    handleTouchStart(e: TouchEvent): void;
+    handleTouchMove(e: TouchEvent): void;
+    handleTouchEnd(e: TouchEvent): void;
+    handleClickOutside(event: MouseEvent): void;
+    handleDropdownClick(id: string): void;
+    setDrawMode(thickness: number): void;
+    setFreehandMode(thickness: number): void;
+    setShapeMode(shape: string): void;
+    setEraseMode(thickness: number): void;
+    startDrawing(event: MouseEvent): void;
+    draw(event: MouseEvent): void;
+    stopDrawing(): void;
+    drawLine: (x1: number, y1: number, x2: number, y2: number) => void;
+    drawShapes: () => void;
+    drawFreehand: (points: {
+        x: number;
+        y: number;
+        color: string;
+        thickness: number;
+    }[]) => void;
+    drawShape: (type: string, x1: number, y1: number, x2: number, y2: number) => void;
+    drawPolygon: (sides: number, x1: number, y1: number, x2: number, y2: number) => void;
+    removeShape: () => void;
+    erase: (x: number, y: number) => void;
+    isPointNearLine(px: number, py: number, x1: number, y1: number, x2: number, y2: number, threshold: number): boolean;
+    toggleToolbar: () => void;
+    toggleAnnotate: () => Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Screenboard, [{ optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Screenboard, "app-screenboard", never, { "customWidth": { "alias": "customWidth"; "required": false; }; "customHeight": { "alias": "customHeight"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; "showAspect": { "alias": "showAspect"; "required": false; }; }, {}, never, never, true, never>;
+}

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

@@ -0,0 +1,103 @@
+import { OnInit, OnDestroy, ElementRef, OnChanges, SimpleChanges, AfterViewInit } from '@angular/core';
+import { Producer } from 'mediasoup-client/lib/types';
+import { ConnectSendTransportScreenType, CreateSendTransportType, DisconnectSendTransportScreenType, PrepopulateUserMediaType, StopShareScreenType, SleepType, ConnectSendTransportScreenParameters, CreateSendTransportParameters, DisconnectSendTransportScreenParameters, PrepopulateUserMediaParameters, StopShareScreenParameters } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export interface ScreenboardModalParameters extends ConnectSendTransportScreenParameters, CreateSendTransportParameters, DisconnectSendTransportScreenParameters, PrepopulateUserMediaParameters, StopShareScreenParameters {
+    localStreamScreen: MediaStream | null;
+    shared: boolean;
+    hostLabel: string;
+    annotateScreenStream: boolean;
+    processedScreenStream: MediaStream | null;
+    mainScreenCanvas: HTMLCanvasElement | null;
+    canvasScreenboard: HTMLCanvasElement | null;
+    transportCreated: boolean;
+    screenProducer: Producer | null;
+    updateLocalStreamScreen: (stream: MediaStream | null) => void;
+    updateProcessedScreenStream: (stream: MediaStream | null) => void;
+    updateMainScreenCanvas: (canvas: HTMLCanvasElement | null) => void;
+    sleep: SleepType;
+    createSendTransport: CreateSendTransportType;
+    disconnectSendTransportScreen: DisconnectSendTransportScreenType;
+    connectSendTransportScreen: ConnectSendTransportScreenType;
+    stopShareScreen: StopShareScreenType;
+    prepopulateUserMedia: PrepopulateUserMediaType;
+    getUpdatedAllParams: () => ScreenboardModalParameters;
+}
+export interface ScreenboardModalOptions {
+    parameters: ScreenboardModalParameters;
+    isVisible: boolean;
+    onClose: () => void;
+    position: string;
+    backgroundColor: string;
+}
+export type ScreenboardModalType = (options: ScreenboardModalOptions) => HTMLElement;
+/**
+ * @fileoverview ScreenboardModal component for handling screen annotation and modal visibility.
+ *
+ * @component
+ * @selector app-screenboard-modal
+ * @standalone true
+ * @templateUrl ./screenboard-modal.component.html
+ * @styleUrls ./screenboard-modal.component.css
+ * @imports CommonModule, FormsModule, FontAwesomeModule
+ *
+ * @class ScreenboardModal
+ * @implements OnInit, OnDestroy, OnChanges, AfterViewInit
+ *
+ * @description
+ * This component is responsible for managing the screen annotation modal, including showing and hiding the modal,
+ * handling screen annotations, and managing media streams.
+ *
+ * @property {ScreenboardModalParameters} parameters - Input parameter for screen annotation modal.
+ * @property {boolean} isVisible - Input flag to control the visibility of the modal.
+ * @property {() => void} onClose - Input callback function to be called when the modal is closed.
+ * @property {string} position - Input string to set the position of the modal.
+ * @property {string} backgroundColor - Input string to set the background color of the modal.
+ *
+ * @property {ElementRef<HTMLVideoElement>} screenVideoRef - ViewChild reference to the screen video element.
+ * @property {ElementRef<HTMLCanvasElement>} screenCanvasRef - ViewChild reference to the screen canvas element.
+ *
+ * @property {IconDefinition} faTimes - FontAwesome icon for the close button.
+ *
+ * @property {any} annotationInterval - Interval for annotation updates.
+ * @property {any} annotationCheckInterval - Interval for checking annotation updates.
+ * @property {MediaStream | null} clonedStreamScreen - Cloned media stream for screen sharing.
+ * @property {CanvasRenderingContext2D | null} ctx - Canvas rendering context.
+ *
+ * @method ngOnInit - Initialization logic that does not depend on the view.
+ * @method ngOnDestroy - Cleanup logic when the component is destroyed.
+ * @method ngOnChanges - Logic to handle changes in input properties.
+ * @method ngAfterViewInit - Logic that requires view access.
+ * @method showModal - Method to show the modal and handle screen annotation setup.
+ * @method hideModal - Method to hide the modal and cleanup screen annotation.
+ * @method annotatationPreview - Method to handle the preview of screen annotations.
+ * @method handleScreenTransport - Method to handle screen transport logic.
+ * @method stopAnnotation - Method to stop the screen annotation.
+ * @method stopAllTracks - Method to stop all media tracks.
+ */
+export declare class ScreenboardModal implements OnInit, OnDestroy, OnChanges, AfterViewInit {
+    parameters: ScreenboardModalParameters;
+    isVisible: boolean;
+    onClose: () => void;
+    position: string;
+    backgroundColor: string;
+    screenVideoRef: ElementRef<HTMLVideoElement>;
+    screenCanvasRef: ElementRef<HTMLCanvasElement>;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    private annotationInterval;
+    private annotationCheckInterval;
+    private clonedStreamScreen;
+    private ctx;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    showModal: () => Promise<void>;
+    hideModal: () => Promise<void>;
+    annotatationPreview: () => Promise<void>;
+    handleScreenTransport: () => Promise<void>;
+    stopAnnotation: () => Promise<void>;
+    stopAllTracks: () => Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScreenboardModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScreenboardModal, "app-screenboard-modal", never, { "parameters": { "alias": "parameters"; "required": false; }; "isVisible": { "alias": "isVisible"; "required": false; }; "onClose": { "alias": "onClose"; "required": false; }; "position": { "alias": "position"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; }, {}, never, never, true, never>;
+}