mediasfu-angular 2.2.1 → 2.2.3

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

@@ -1,56 +1,126 @@
-import { OnChanges, SimpleChanges } from '@angular/core';
+import { OnChanges, OnDestroy, SimpleChanges, TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
+export type AlertTone = 'success' | 'danger' | 'info' | 'warning';
+export type AlertPosition = 'top' | 'bottom' | 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'center';
 export interface AlertComponentOptions {
     visible: boolean;
     message: string;
-    type: 'success' | 'danger';
+    type: AlertTone;
     duration?: number;
     onHide?: () => void;
     textColor?: string;
+    position?: AlertPosition;
+    isDarkMode?: boolean;
+    alertStyle?: Partial<CSSStyleDeclaration>;
+    customTemplate?: TemplateRef<any>;
 }
 export type AlertComponentType = (options: AlertComponentOptions) => HTMLElement;
 /**
- * AlertComponent displays an alert message of type 'success' or 'danger' with customizable options.
- * It can automatically hide after a set duration and includes a manual dismiss option.
+ * AlertComponent - Toast-style notification component for success and error messages
  *
- * @selector app-alert-component
- * @standalone true
- * @imports CommonModule
+ * @component
+ * @description
+ * Displays toast-style alert messages with automatic dismiss timer and manual close option.
+ * Supports three levels of customization:
+ * 1. **Basic Usage**: Use default alert styles with custom message and type
+ * 2. **Style Customization**: Override alert appearance with alertStyle prop
+ * 3. **Full Override**: Provide a custom template via customTemplate for complete control
  *
- * @inputs
- * - `visible` (boolean): Determines if the alert is visible. Default is false.
- * - `message` (string): The message displayed in the alert.
- * - `type` ('success' | 'danger'): Type of alert, either 'success' or 'danger'. Default is 'success'.
- * - `duration` (number): Duration in milliseconds for the alert to remain visible before hiding. Default is 4000 ms.
- * - `textColor` (string): Optional color for alert text. Default is 'black'.
- * - `onHide` (function): Optional callback invoked when the alert is hidden.
+ * Key Features:
+ * - Auto-dismiss with configurable duration
+ * - Success/danger type indicators
+ * - Manual dismiss capability
+ * - Customizable text color and styling
+ * - Full template override support
  *
- * @methods
- * - `ngOnChanges(changes: SimpleChanges)`: Lifecycle hook invoked on input changes; initiates auto-hide based on duration if `visible` is true.
- * - `handlePress()`: Manually hides the alert by invoking the `onHide` callback.
+ * @example
+ * Basic Usage:
+ * ```html
+ * <app-alert-component
+ *   [visible]="showAlert"
+ *   [message]="'Operation completed successfully!'"
+ *   [type]="'success'"
+ *   [duration]="5000"
+ *   [onHide]="handleAlertClose">
+ * </app-alert-component>
+ * ```
  *
  * @example
+ * Style Customization:
  * ```html
  * <app-alert-component
- *  [visible]="showAlert"
- * [message]="alertMessage"
- * [type]="alertType"
- * [duration]="5000"
- * [textColor]="alertTextColor"
- * [onHide]="onAlertHide">
+ *   [visible]="showError"
+ *   [message]="'An error occurred'"
+ *   [type]="'danger'"
+ *   [textColor]="'white'"
+ *   [alertStyle]="{
+ *     backgroundColor: '#dc3545',
+ *     border: '2px solid #c82333',
+ *     borderRadius: '8px',
+ *     padding: '15px 20px'
+ *   }"
+ *   [onHide]="handleErrorClose">
  * </app-alert-component>
  * ```
- **/
-export declare class AlertComponent implements OnChanges {
+ *
+ * @example
+ * Custom Template Override:
+ * ```html
+ * <app-alert-component
+ *   [visible]="showAlert"
+ *   [message]="alertMessage"
+ *   [type]="alertType"
+ *   [customTemplate]="customAlertTemplate"
+ *   [onHide]="handleAlertClose">
+ * </app-alert-component>
+ *
+ * <ng-template #customAlertTemplate let-visible="visible" let-message="message" let-type="type">
+ *   <div class="custom-alert" [class.success]="type === 'success'" [class.danger]="type === 'danger'">
+ *     <i [class]="type === 'success' ? 'fa fa-check-circle' : 'fa fa-exclamation-triangle'"></i>
+ *     <span>{{ message }}</span>
+ *     <button (click)="handleAlertClose()">×</button>
+ *   </div>
+ * </ng-template>
+ * ```
+ *
+ * @selector app-alert-component
+ * @standalone true
+ * @imports CommonModule
+ *
+ * @input visible - Whether the alert is currently visible. Default: `false`
+ * @input message - The message text to display in the alert. Default: `''`
+ * @input type - Alert type ('success' or 'danger') affecting color scheme. Default: `'success'`
+ * @input duration - Auto-dismiss duration in milliseconds. Default: `4000`
+ * @input textColor - Color of the message text. Default: `'black'`
+ * @input onHide - Callback function invoked when alert is dismissed (auto or manual). Default: `undefined`
+ * @input alertStyle - Custom CSS styles to apply to the alert container. Default: `undefined`
+ * @input customTemplate - Custom TemplateRef to completely replace default alert template. Default: `undefined`
+ *
+ * @method ngOnChanges - Handles input changes and triggers auto-dismiss timer when visible
+ * @method handlePress - Manually dismisses the alert by invoking onHide callback
+ */
+export declare class AlertComponent implements OnChanges, OnDestroy {
     visible: boolean;
     message: string;
-    type: 'success' | 'danger';
+    type: AlertTone;
     duration: number;
     textColor: string;
+    position: AlertPosition;
+    isDarkMode?: boolean;
     onHide: () => void;
-    alertType: 'success' | 'danger';
+    alertStyle?: Partial<CSSStyleDeclaration>;
+    customTemplate?: TemplateRef<any>;
+    alertType: AlertTone;
+    private hideTimeout?;
     ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
     handlePress(): void;
+    get alertLabel(): string;
+    get alertMeta(): string;
+    get alertIcon(): string;
+    get alertRole(): 'alert' | 'status';
+    get shellStyle(): Record<string, string>;
+    get resolvedIsDarkMode(): boolean;
     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>;
+    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; }; "position": { "alias": "position"; "required": false; }; "isDarkMode": { "alias": "isDarkMode"; "required": false; }; "onHide": { "alias": "onHide"; "required": false; }; "alertStyle": { "alias": "alertStyle"; "required": false; }; "customTemplate": { "alias": "customTemplate"; "required": false; }; }, {}, never, never, true, never>;
 }

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

@@ -1,7 +1,8 @@
-import { OnInit, OnDestroy, NgZone } from '@angular/core';
+import { OnInit, OnDestroy, OnChanges, SimpleChanges } 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 { LiveSubtitleService } from '../../../services/live-subtitle.service';
 import * as i0 from "@angular/core";
 export interface AudioCardParameters {
     audioDecibels: AudioDecibels[];
@@ -96,9 +97,9 @@ export type AudioCardType = (options: AudioCardOptions) => HTMLElement;
  * ```
  *
  **/
-export declare class AudioCard implements OnInit, OnDestroy {
-    private ngZone;
+export declare class AudioCard implements OnInit, OnDestroy, OnChanges {
     private controlMediaService;
+    private liveSubtitleService;
     controlUserMedia?: (options: ControlMediaOptions) => Promise<void>;
     customStyle: Partial<CSSStyleDeclaration>;
     name: string;
@@ -122,15 +123,24 @@ export declare class AudioCard implements OnInit, OnDestroy {
     faMicrophone: import("@fortawesome/fontawesome-common-types").IconDefinition;
     faMicrophoneSlash: import("@fortawesome/fontawesome-common-types").IconDefinition;
     waveformAnimations: number[];
+    ringBarIndices: 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);
+    audioLevelInterval: any;
+    waveformInterval: any;
+    isDarkModeEnabled: boolean;
+    imageLoadFailed: boolean;
+    constructor(controlMediaService: ControlMedia, liveSubtitleService: LiveSubtitleService, 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);
+    get liveSubtitleText(): string | null;
     ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
     ngOnDestroy(): void;
-    animateBar(index: number): void;
+    get hasRenderableImage(): boolean;
+    get isSpeaking(): boolean;
+    getWaveformRingHeight(index: number): number;
+    handleImageError(): void;
     animateWaveform(): void;
     resetWaveform(): void;
-    getAnimationDuration(index: number): number;
+    syncThemeMode(params?: any): void;
     toggleAudio(): Promise<void>;
     toggleVideo(): Promise<void>;
     renderControls(): boolean;