mediasfu-angular 2.2.1 → 2.2.3

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

@@ -20,67 +20,125 @@ export interface WaitingRoomModalOptions {
     position?: string;
     backgroundColor?: string;
     parameters: WaitingRoomModalParameters;
+    overlayStyle?: Partial<CSSStyleDeclaration>;
+    contentStyle?: Partial<CSSStyleDeclaration>;
+    customTemplate?: any;
     onWaitingRoomItemPress?: RespondToWaitingType;
 }
 export type WaitingRoomModalType = (options: WaitingRoomModalOptions) => HTMLElement;
 /**
- * Component representing a modal for managing participants in a waiting room.
+ * WaitingRoomModal - Modal for managing participants waiting to join the session
  *
  * @component
- * @selector app-waiting-room-modal
- * @standalone true
- * @imports CommonModule, FontAwesomeModule, FormsModule
- * @templateUrl ./waiting-room-modal.component.html
- * @styleUrls ['./waiting-room-modal.component.css']
+ * @description
+ * Displays participants in the waiting room and allows host to admit or reject them.
+ * Provides filtering and batch admission capabilities.
  *
- * @property {boolean} isWaitingModalVisible - Visibility state of the modal.
- * @property {number} waitingRoomCounter - Counter for the number of participants in the waiting room.
- * @property {WaitingRoomParticipant[]} waitingRoomList - List of participants in the waiting room.
- * @property {string} roomName - Name of the room.
- * @property {Socket} socket - Socket instance for communication.
- * @property {string} position - Position of the modal on the screen.
- * @property {string} backgroundColor - Background color of the modal.
- * @property {WaitingRoomModalParameters} parameters - Parameters for the waiting room modal.
- * @property {function} onWaitingRoomClose - Function to call when the modal is closed.
- * @property {function} onWaitingRoomFilterChange - Function to call when the filter value changes.
- * @property {function} updateWaitingList - Function to update the waiting list.
- * @property {function} onWaitingRoomItemPress - Function to call when an item in the waiting room is pressed.
+ * Supports three levels of customization:
+ * 1. **Basic Usage**: Use default modal UI with waiting participant list and admit/reject actions
+ * 2. **Style Customization**: Override modal appearance with overlayStyle and contentStyle
+ * 3. **Full Override**: Provide a custom template via customTemplate for complete control
  *
- * @property {IconDefinition} faTimes - FontAwesome icon for the close button.
- * @property {IconDefinition} faCheck - FontAwesome icon for the check button.
- * @property {WaitingRoomParticipant[]} waitingRoomList_s - Filtered list of participants in the waiting room.
- * @property {number} waitingRoomCounter_s - Counter for the filtered list of participants in the waiting room.
- * @property {boolean} reRender - Flag to trigger re-rendering of the component.
+ * Key Features:
+ * - Waiting participant list with names
+ * - Admit/reject individual participants
+ * - Participant filtering by name
+ * - Real-time counter badge
+ * - Socket-based admission handling
  *
- * @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 of a directive changes.
- * @method updateParameters - Updates the parameters for the waiting room modal.
- * @method handleModalClose - Handles the closing of the modal.
- * @method handleFilterChange - Handles the change in the filter input.
- * @method handleItemPress - Handles the pressing of an item in the waiting room.
+ * @example
+ * Basic Usage:
+ * ```html
+ * <app-waiting-room-modal
+ *   [isWaitingModalVisible]="showWaitingRoom"
+ *   [waitingRoomCounter]="waitingCount"
+ *   [waitingRoomList]="waitingParticipants"
+ *   [roomName]="currentRoom"
+ *   [socket]="socketInstance"
+ *   [parameters]="waitingRoomParams"
+ *   [onWaitingRoomClose]="closeWaitingRoom"
+ *   [onWaitingRoomFilterChange]="filterWaiting"
+ *   [updateWaitingList]="updateWaiting">
+ * </app-waiting-room-modal>
+ * ```
  *
- * @getter modalContainerStyle - Returns the style object for the modal container.
- * @getter modalContentStyle - Returns the style object for the modal content.
- * @getter inputStyle - Returns the style object for the input field.
+ * @example
+ * Style Customization:
+ * ```html
+ * <app-waiting-room-modal
+ *   [isWaitingModalVisible]="showWaitingRoom"
+ *   [waitingRoomCounter]="waitingCount"
+ *   [waitingRoomList]="waitingParticipants"
+ *   [roomName]="currentRoom"
+ *   [socket]="socketInstance"
+ *   [overlayStyle]="{
+ *     backgroundColor: 'rgba(0, 0, 0, 0.9)'
+ *   }"
+ *   [contentStyle]="{
+ *     backgroundColor: '#1e1e1e',
+ *     borderRadius: '10px',
+ *     border: '1px solid #4a90e2'
+ *   }"
+ *   [backgroundColor]="'#2c3e50'"
+ *   [position]="'center'"
+ *   [onWaitingRoomClose]="closeWaitingRoom"
+ *   [updateWaitingList]="updateWaiting">
+ * </app-waiting-room-modal>
+ * ```
  *
  * @example
+ * Custom Template Override:
  * ```html
  * <app-waiting-room-modal
- *  [isWaitingModalVisible]="true"
- * [waitingRoomCounter]="waitingRoomCounter"
- * [waitingRoomList]="waitingRoomList"
- * [roomName]="roomName"
- * [socket]="socket"
- * [position]="'topRight'"
- * [backgroundColor]="'#83c0e9'"
- * [parameters]="waitingRoomModalParams"
- * [onWaitingRoomClose]="closeWaitingRoomModal"
- * [onWaitingRoomFilterChange]="filterWaitingRoom"
- * [updateWaitingList]="updateWaitingList"
- * [onWaitingRoomItemPress]="handleWaitingRoomItemPress"
- * ></app-waiting-room-modal>
+ *   [isWaitingModalVisible]="showWaitingRoom"
+ *   [customTemplate]="customWaitingTemplate"
+ *   [onWaitingRoomClose]="closeWaitingRoom">
+ * </app-waiting-room-modal>
+ *
+ * <ng-template #customWaitingTemplate let-waitingList="waitingRoomList" let-onAdmit="onAdmit" let-onReject="onReject">
+ *   <div class="custom-waiting-room">
+ *     <h3>Waiting to Join ({{ waitingList.length }})</h3>
+ *     <div *ngFor="let participant of waitingList" class="waiting-participant">
+ *       <img [src]="participant.avatar" alt="avatar">
+ *       <span>{{ participant.name }}</span>
+ *       <button (click)="onAdmit(participant)" class="admit">Admit</button>
+ *       <button (click)="onReject(participant)" class="reject">Reject</button>
+ *     </div>
+ *   </div>
+ * </ng-template>
  * ```
  *
+ * @selector app-waiting-room-modal
+ * @standalone true
+ * @imports CommonModule, FontAwesomeModule, FormsModule
+ *
+ * @input isWaitingModalVisible - Whether the modal is currently visible. Default: `false`
+ * @input onWaitingRoomClose - Callback function to close the modal. Default: `() => {}`
+ * @input waitingRoomCounter - Number of participants in waiting room (for badge). Default: `0`
+ * @input onWaitingRoomFilterChange - Callback when filter input changes. Default: `() => {}`
+ * @input waitingRoomList - Array of waiting participant objects. Default: `[]`
+ * @input updateWaitingList - Function to update the waiting list state. Default: `() => {}`
+ * @input roomName - Name of the room/session. Default: `''`
+ * @input socket - Socket.io client instance for real-time communication. Default: `undefined`
+ * @input position - Modal position on screen ('topRight', 'center', etc.). Default: `'topRight'`
+ * @input backgroundColor - Background color of the modal content. Default: `'#83c0e9'`
+ * @input parameters - Additional parameters including filtered waiting list. Default: `{}`
+ * @input onWaitingRoomItemPress - Callback when admit/reject action is pressed. Default: `respondToWaitingService.respondToWaiting`
+ * @input overlayStyle - Custom CSS styles for the modal overlay backdrop. Default: `undefined`
+ * @input contentStyle - Custom CSS styles for the modal content container. Default: `undefined`
+ * @input customTemplate - Custom TemplateRef to completely replace default modal template. Default: `undefined`
+ *
+ * @method ngOnInit - Initializes component and default styles
+ * @method ngOnChanges - Updates waiting list when inputs change
+ * @method updateParameters - Refreshes filtered waiting list from parameters
+ * @method handleModalClose - Closes modal via onWaitingRoomClose callback
+ * @method handleFilterChange - Filters waiting list based on search input
+ * @method handleItemPress - Handles admit/reject actions for waiting participants
+ * @method getCombinedOverlayStyle - Merges default and custom overlay styles
+ * @method getCombinedContentStyle - Merges default and custom content styles
+ * @getter modalContainerStyle - Returns computed overlay styles
+ * @getter modalContentStyle - Returns computed content styles
+ * @getter inputStyle - Returns filter input field styles
  */
 export declare class WaitingRoomModal implements OnChanges, OnInit {
     private respondToWaitingService;
@@ -96,6 +154,9 @@ export declare class WaitingRoomModal implements OnChanges, OnInit {
     onWaitingRoomClose: () => void;
     onWaitingRoomFilterChange: (value: string) => void;
     updateWaitingList: (data: WaitingRoomParticipant[]) => void;
+    overlayStyle?: Partial<CSSStyleDeclaration>;
+    contentStyle?: Partial<CSSStyleDeclaration>;
+    customTemplate?: any;
     onWaitingRoomItemPress: (data: RespondToWaitingOptions) => void;
     faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
     faCheck: import("@fortawesome/fontawesome-common-types").IconDefinition;
@@ -139,6 +200,1018 @@ export declare class WaitingRoomModal implements OnChanges, OnInit {
         fontSize: string;
         marginBottom: string;
     };
+    getCombinedOverlayStyle(): {
+        accentColor?: string;
+        alignContent?: string;
+        alignItems?: string;
+        alignSelf?: string;
+        alignmentBaseline?: string;
+        all?: string;
+        animation?: string;
+        animationComposition?: string;
+        animationDelay?: string;
+        animationDirection?: string;
+        animationDuration?: string;
+        animationFillMode?: string;
+        animationIterationCount?: string;
+        animationName?: string;
+        animationPlayState?: string;
+        animationTimingFunction?: string;
+        appearance?: string;
+        aspectRatio?: string;
+        backdropFilter?: string;
+        backfaceVisibility?: string;
+        background?: string;
+        backgroundAttachment?: string;
+        backgroundBlendMode?: string;
+        backgroundClip?: string;
+        backgroundColor: string;
+        backgroundImage?: string;
+        backgroundOrigin?: string;
+        backgroundPosition?: string;
+        backgroundPositionX?: string;
+        backgroundPositionY?: string;
+        backgroundRepeat?: string;
+        backgroundSize?: string;
+        baselineShift?: string;
+        baselineSource?: string;
+        blockSize?: string;
+        border?: string;
+        borderBlock?: string;
+        borderBlockColor?: string;
+        borderBlockEnd?: string;
+        borderBlockEndColor?: string;
+        borderBlockEndStyle?: string;
+        borderBlockEndWidth?: string;
+        borderBlockStart?: string;
+        borderBlockStartColor?: string;
+        borderBlockStartStyle?: string;
+        borderBlockStartWidth?: string;
+        borderBlockStyle?: string;
+        borderBlockWidth?: string;
+        borderBottom?: string;
+        borderBottomColor?: string;
+        borderBottomLeftRadius?: string;
+        borderBottomRightRadius?: string;
+        borderBottomStyle?: string;
+        borderBottomWidth?: string;
+        borderCollapse?: string;
+        borderColor?: string;
+        borderEndEndRadius?: string;
+        borderEndStartRadius?: string;
+        borderImage?: string;
+        borderImageOutset?: string;
+        borderImageRepeat?: string;
+        borderImageSlice?: string;
+        borderImageSource?: string;
+        borderImageWidth?: string;
+        borderInline?: string;
+        borderInlineColor?: string;
+        borderInlineEnd?: string;
+        borderInlineEndColor?: string;
+        borderInlineEndStyle?: string;
+        borderInlineEndWidth?: string;
+        borderInlineStart?: string;
+        borderInlineStartColor?: string;
+        borderInlineStartStyle?: string;
+        borderInlineStartWidth?: string;
+        borderInlineStyle?: string;
+        borderInlineWidth?: string;
+        borderLeft?: string;
+        borderLeftColor?: string;
+        borderLeftStyle?: string;
+        borderLeftWidth?: string;
+        borderRadius?: string;
+        borderRight?: string;
+        borderRightColor?: string;
+        borderRightStyle?: string;
+        borderRightWidth?: string;
+        borderSpacing?: string;
+        borderStartEndRadius?: string;
+        borderStartStartRadius?: string;
+        borderStyle?: string;
+        borderTop?: string;
+        borderTopColor?: string;
+        borderTopLeftRadius?: string;
+        borderTopRightRadius?: string;
+        borderTopStyle?: string;
+        borderTopWidth?: string;
+        borderWidth?: string;
+        bottom?: string;
+        boxShadow?: string;
+        boxSizing?: string;
+        breakAfter?: string;
+        breakBefore?: string;
+        breakInside?: string;
+        captionSide?: string;
+        caretColor?: string;
+        clear?: string;
+        clip?: string;
+        clipPath?: string;
+        clipRule?: string;
+        color?: string;
+        colorInterpolation?: string;
+        colorInterpolationFilters?: string;
+        colorScheme?: string;
+        columnCount?: string;
+        columnFill?: string;
+        columnGap?: string;
+        columnRule?: string;
+        columnRuleColor?: string;
+        columnRuleStyle?: string;
+        columnRuleWidth?: string;
+        columnSpan?: string;
+        columnWidth?: string;
+        columns?: string;
+        contain?: string;
+        containIntrinsicBlockSize?: string;
+        containIntrinsicHeight?: string;
+        containIntrinsicInlineSize?: string;
+        containIntrinsicSize?: string;
+        containIntrinsicWidth?: string;
+        container?: string;
+        containerName?: string;
+        containerType?: string;
+        content?: string;
+        contentVisibility?: string;
+        counterIncrement?: string;
+        counterReset?: string;
+        counterSet?: string;
+        cssFloat?: string;
+        cssText?: string;
+        cursor?: string;
+        cx?: string;
+        cy?: string;
+        d?: string;
+        direction?: string;
+        display: string;
+        dominantBaseline?: string;
+        emptyCells?: string;
+        fill?: string;
+        fillOpacity?: string;
+        fillRule?: string;
+        filter?: string;
+        flex?: string;
+        flexBasis?: string;
+        flexDirection?: string;
+        flexFlow?: string;
+        flexGrow?: string;
+        flexShrink?: string;
+        flexWrap?: string;
+        float?: string;
+        floodColor?: string;
+        floodOpacity?: string;
+        font?: string;
+        fontFamily?: string;
+        fontFeatureSettings?: string;
+        fontKerning?: string;
+        fontOpticalSizing?: string;
+        fontPalette?: string;
+        fontSize?: string;
+        fontSizeAdjust?: string;
+        fontStretch?: string;
+        fontStyle?: string;
+        fontSynthesis?: string;
+        fontSynthesisSmallCaps?: string;
+        fontSynthesisStyle?: string;
+        fontSynthesisWeight?: string;
+        fontVariant?: string;
+        fontVariantAlternates?: string;
+        fontVariantCaps?: string;
+        fontVariantEastAsian?: string;
+        fontVariantLigatures?: string;
+        fontVariantNumeric?: string;
+        fontVariantPosition?: string;
+        fontVariationSettings?: string;
+        fontWeight?: string;
+        forcedColorAdjust?: string;
+        gap?: string;
+        grid?: string;
+        gridArea?: string;
+        gridAutoColumns?: string;
+        gridAutoFlow?: string;
+        gridAutoRows?: string;
+        gridColumn?: string;
+        gridColumnEnd?: string;
+        gridColumnGap?: string;
+        gridColumnStart?: string;
+        gridGap?: string;
+        gridRow?: string;
+        gridRowEnd?: string;
+        gridRowGap?: string;
+        gridRowStart?: string;
+        gridTemplate?: string;
+        gridTemplateAreas?: string;
+        gridTemplateColumns?: string;
+        gridTemplateRows?: string;
+        height: string;
+        hyphenateCharacter?: string;
+        hyphens?: string;
+        imageOrientation?: string;
+        imageRendering?: string;
+        inlineSize?: string;
+        inset?: string;
+        insetBlock?: string;
+        insetBlockEnd?: string;
+        insetBlockStart?: string;
+        insetInline?: string;
+        insetInlineEnd?: string;
+        insetInlineStart?: string;
+        isolation?: string;
+        justifyContent?: string;
+        justifyItems?: string;
+        justifySelf?: string;
+        left: string;
+        length?: number;
+        letterSpacing?: string;
+        lightingColor?: string;
+        lineBreak?: string;
+        lineHeight?: string;
+        listStyle?: string;
+        listStyleImage?: string;
+        listStylePosition?: string;
+        listStyleType?: string;
+        margin?: string;
+        marginBlock?: string;
+        marginBlockEnd?: string;
+        marginBlockStart?: string;
+        marginBottom?: string;
+        marginInline?: string;
+        marginInlineEnd?: string;
+        marginInlineStart?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        marginTop?: string;
+        marker?: string;
+        markerEnd?: string;
+        markerMid?: string;
+        markerStart?: string;
+        mask?: string;
+        maskClip?: string;
+        maskComposite?: string;
+        maskImage?: string;
+        maskMode?: string;
+        maskOrigin?: string;
+        maskPosition?: string;
+        maskRepeat?: string;
+        maskSize?: string;
+        maskType?: string;
+        mathDepth?: string;
+        mathStyle?: string;
+        maxBlockSize?: string;
+        maxHeight?: string;
+        maxInlineSize?: string;
+        maxWidth?: string;
+        minBlockSize?: string;
+        minHeight?: string;
+        minInlineSize?: string;
+        minWidth?: string;
+        mixBlendMode?: string;
+        objectFit?: string;
+        objectPosition?: string;
+        offset?: string;
+        offsetAnchor?: string;
+        offsetDistance?: string;
+        offsetPath?: string;
+        offsetPosition?: string;
+        offsetRotate?: string;
+        opacity?: string;
+        order?: string;
+        orphans?: string;
+        outline?: string;
+        outlineColor?: string;
+        outlineOffset?: string;
+        outlineStyle?: string;
+        outlineWidth?: string;
+        overflow?: string;
+        overflowAnchor?: string;
+        overflowClipMargin?: string;
+        overflowWrap?: string;
+        overflowX?: string;
+        overflowY?: string;
+        overscrollBehavior?: string;
+        overscrollBehaviorBlock?: string;
+        overscrollBehaviorInline?: string;
+        overscrollBehaviorX?: string;
+        overscrollBehaviorY?: string;
+        padding?: string;
+        paddingBlock?: string;
+        paddingBlockEnd?: string;
+        paddingBlockStart?: string;
+        paddingBottom?: string;
+        paddingInline?: string;
+        paddingInlineEnd?: string;
+        paddingInlineStart?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        paddingTop?: string;
+        page?: string;
+        pageBreakAfter?: string;
+        pageBreakBefore?: string;
+        pageBreakInside?: string;
+        paintOrder?: string;
+        parentRule?: CSSRule | null;
+        perspective?: string;
+        perspectiveOrigin?: string;
+        placeContent?: string;
+        placeItems?: string;
+        placeSelf?: string;
+        pointerEvents?: string;
+        position: string;
+        printColorAdjust?: string;
+        quotes?: string;
+        r?: string;
+        resize?: string;
+        right?: string;
+        rotate?: string;
+        rowGap?: string;
+        rubyPosition?: string;
+        rx?: string;
+        ry?: string;
+        scale?: string;
+        scrollBehavior?: string;
+        scrollMargin?: string;
+        scrollMarginBlock?: string;
+        scrollMarginBlockEnd?: string;
+        scrollMarginBlockStart?: string;
+        scrollMarginBottom?: string;
+        scrollMarginInline?: string;
+        scrollMarginInlineEnd?: string;
+        scrollMarginInlineStart?: string;
+        scrollMarginLeft?: string;
+        scrollMarginRight?: string;
+        scrollMarginTop?: string;
+        scrollPadding?: string;
+        scrollPaddingBlock?: string;
+        scrollPaddingBlockEnd?: string;
+        scrollPaddingBlockStart?: string;
+        scrollPaddingBottom?: string;
+        scrollPaddingInline?: string;
+        scrollPaddingInlineEnd?: string;
+        scrollPaddingInlineStart?: string;
+        scrollPaddingLeft?: string;
+        scrollPaddingRight?: string;
+        scrollPaddingTop?: string;
+        scrollSnapAlign?: string;
+        scrollSnapStop?: string;
+        scrollSnapType?: string;
+        scrollbarColor?: string;
+        scrollbarGutter?: string;
+        scrollbarWidth?: string;
+        shapeImageThreshold?: string;
+        shapeMargin?: string;
+        shapeOutside?: string;
+        shapeRendering?: string;
+        stopColor?: string;
+        stopOpacity?: string;
+        stroke?: string;
+        strokeDasharray?: string;
+        strokeDashoffset?: string;
+        strokeLinecap?: string;
+        strokeLinejoin?: string;
+        strokeMiterlimit?: string;
+        strokeOpacity?: string;
+        strokeWidth?: string;
+        tabSize?: string;
+        tableLayout?: string;
+        textAlign?: string;
+        textAlignLast?: string;
+        textAnchor?: string;
+        textCombineUpright?: string;
+        textDecoration?: string;
+        textDecorationColor?: string;
+        textDecorationLine?: string;
+        textDecorationSkipInk?: string;
+        textDecorationStyle?: string;
+        textDecorationThickness?: string;
+        textEmphasis?: string;
+        textEmphasisColor?: string;
+        textEmphasisPosition?: string;
+        textEmphasisStyle?: string;
+        textIndent?: string;
+        textOrientation?: string;
+        textOverflow?: string;
+        textRendering?: string;
+        textShadow?: string;
+        textTransform?: string;
+        textUnderlineOffset?: string;
+        textUnderlinePosition?: string;
+        textWrap?: string;
+        textWrapMode?: string;
+        textWrapStyle?: string;
+        top: string;
+        touchAction?: string;
+        transform?: string;
+        transformBox?: string;
+        transformOrigin?: string;
+        transformStyle?: string;
+        transition?: string;
+        transitionBehavior?: string;
+        transitionDelay?: string;
+        transitionDuration?: string;
+        transitionProperty?: string;
+        transitionTimingFunction?: string;
+        translate?: string;
+        unicodeBidi?: string;
+        userSelect?: string;
+        vectorEffect?: string;
+        verticalAlign?: string;
+        visibility?: string;
+        webkitAlignContent?: string;
+        webkitAlignItems?: string;
+        webkitAlignSelf?: string;
+        webkitAnimation?: string;
+        webkitAnimationDelay?: string;
+        webkitAnimationDirection?: string;
+        webkitAnimationDuration?: string;
+        webkitAnimationFillMode?: string;
+        webkitAnimationIterationCount?: string;
+        webkitAnimationName?: string;
+        webkitAnimationPlayState?: string;
+        webkitAnimationTimingFunction?: string;
+        webkitAppearance?: string;
+        webkitBackfaceVisibility?: string;
+        webkitBackgroundClip?: string;
+        webkitBackgroundOrigin?: string;
+        webkitBackgroundSize?: string;
+        webkitBorderBottomLeftRadius?: string;
+        webkitBorderBottomRightRadius?: string;
+        webkitBorderRadius?: string;
+        webkitBorderTopLeftRadius?: string;
+        webkitBorderTopRightRadius?: string;
+        webkitBoxAlign?: string;
+        webkitBoxFlex?: string;
+        webkitBoxOrdinalGroup?: string;
+        webkitBoxOrient?: string;
+        webkitBoxPack?: string;
+        webkitBoxShadow?: string;
+        webkitBoxSizing?: string;
+        webkitFilter?: string;
+        webkitFlex?: string;
+        webkitFlexBasis?: string;
+        webkitFlexDirection?: string;
+        webkitFlexFlow?: string;
+        webkitFlexGrow?: string;
+        webkitFlexShrink?: string;
+        webkitFlexWrap?: string;
+        webkitJustifyContent?: string;
+        webkitLineClamp?: string;
+        webkitMask?: string;
+        webkitMaskBoxImage?: string;
+        webkitMaskBoxImageOutset?: string;
+        webkitMaskBoxImageRepeat?: string;
+        webkitMaskBoxImageSlice?: string;
+        webkitMaskBoxImageSource?: string;
+        webkitMaskBoxImageWidth?: string;
+        webkitMaskClip?: string;
+        webkitMaskComposite?: string;
+        webkitMaskImage?: string;
+        webkitMaskOrigin?: string;
+        webkitMaskPosition?: string;
+        webkitMaskRepeat?: string;
+        webkitMaskSize?: string;
+        webkitOrder?: string;
+        webkitPerspective?: string;
+        webkitPerspectiveOrigin?: string;
+        webkitTextFillColor?: string;
+        webkitTextSizeAdjust?: string;
+        webkitTextStroke?: string;
+        webkitTextStrokeColor?: string;
+        webkitTextStrokeWidth?: string;
+        webkitTransform?: string;
+        webkitTransformOrigin?: string;
+        webkitTransformStyle?: string;
+        webkitTransition?: string;
+        webkitTransitionDelay?: string;
+        webkitTransitionDuration?: string;
+        webkitTransitionProperty?: string;
+        webkitTransitionTimingFunction?: string;
+        webkitUserSelect?: string;
+        whiteSpace?: string;
+        whiteSpaceCollapse?: string;
+        widows?: string;
+        width: string;
+        willChange?: string;
+        wordBreak?: string;
+        wordSpacing?: string;
+        wordWrap?: string;
+        writingMode?: string;
+        x?: string;
+        y?: string;
+        zIndex: string;
+        zoom?: string;
+        getPropertyPriority?: (property: string) => string;
+        getPropertyValue?: (property: string) => string;
+        item?: (index: number) => string;
+        removeProperty?: (property: string) => string;
+        setProperty?: (property: string, value: string | null, priority?: string) => void;
+    };
+    getCombinedContentStyle(): {
+        accentColor?: string;
+        alignContent?: string;
+        alignItems?: string;
+        alignSelf?: string;
+        alignmentBaseline?: string;
+        all?: string;
+        animation?: string;
+        animationComposition?: string;
+        animationDelay?: string;
+        animationDirection?: string;
+        animationDuration?: string;
+        animationFillMode?: string;
+        animationIterationCount?: string;
+        animationName?: string;
+        animationPlayState?: string;
+        animationTimingFunction?: string;
+        appearance?: string;
+        aspectRatio?: string;
+        backdropFilter?: string;
+        backfaceVisibility?: string;
+        background?: string;
+        backgroundAttachment?: string;
+        backgroundBlendMode?: string;
+        backgroundClip?: string;
+        backgroundColor: string;
+        backgroundImage?: string;
+        backgroundOrigin?: string;
+        backgroundPosition?: string;
+        backgroundPositionX?: string;
+        backgroundPositionY?: string;
+        backgroundRepeat?: string;
+        backgroundSize?: string;
+        baselineShift?: string;
+        baselineSource?: string;
+        blockSize?: string;
+        border?: string;
+        borderBlock?: string;
+        borderBlockColor?: string;
+        borderBlockEnd?: string;
+        borderBlockEndColor?: string;
+        borderBlockEndStyle?: string;
+        borderBlockEndWidth?: string;
+        borderBlockStart?: string;
+        borderBlockStartColor?: string;
+        borderBlockStartStyle?: string;
+        borderBlockStartWidth?: string;
+        borderBlockStyle?: string;
+        borderBlockWidth?: string;
+        borderBottom?: string;
+        borderBottomColor?: string;
+        borderBottomLeftRadius?: string;
+        borderBottomRightRadius?: string;
+        borderBottomStyle?: string;
+        borderBottomWidth?: string;
+        borderCollapse?: string;
+        borderColor?: string;
+        borderEndEndRadius?: string;
+        borderEndStartRadius?: string;
+        borderImage?: string;
+        borderImageOutset?: string;
+        borderImageRepeat?: string;
+        borderImageSlice?: string;
+        borderImageSource?: string;
+        borderImageWidth?: string;
+        borderInline?: string;
+        borderInlineColor?: string;
+        borderInlineEnd?: string;
+        borderInlineEndColor?: string;
+        borderInlineEndStyle?: string;
+        borderInlineEndWidth?: string;
+        borderInlineStart?: string;
+        borderInlineStartColor?: string;
+        borderInlineStartStyle?: string;
+        borderInlineStartWidth?: string;
+        borderInlineStyle?: string;
+        borderInlineWidth?: string;
+        borderLeft?: string;
+        borderLeftColor?: string;
+        borderLeftStyle?: string;
+        borderLeftWidth?: string;
+        borderRadius: string;
+        borderRight?: string;
+        borderRightColor?: string;
+        borderRightStyle?: string;
+        borderRightWidth?: string;
+        borderSpacing?: string;
+        borderStartEndRadius?: string;
+        borderStartStartRadius?: string;
+        borderStyle?: string;
+        borderTop?: string;
+        borderTopColor?: string;
+        borderTopLeftRadius?: string;
+        borderTopRightRadius?: string;
+        borderTopStyle?: string;
+        borderTopWidth?: string;
+        borderWidth?: string;
+        bottom: string;
+        boxShadow?: string;
+        boxSizing?: string;
+        breakAfter?: string;
+        breakBefore?: string;
+        breakInside?: string;
+        captionSide?: string;
+        caretColor?: string;
+        clear?: string;
+        clip?: string;
+        clipPath?: string;
+        clipRule?: string;
+        color?: string;
+        colorInterpolation?: string;
+        colorInterpolationFilters?: string;
+        colorScheme?: string;
+        columnCount?: string;
+        columnFill?: string;
+        columnGap?: string;
+        columnRule?: string;
+        columnRuleColor?: string;
+        columnRuleStyle?: string;
+        columnRuleWidth?: string;
+        columnSpan?: string;
+        columnWidth?: string;
+        columns?: string;
+        contain?: string;
+        containIntrinsicBlockSize?: string;
+        containIntrinsicHeight?: string;
+        containIntrinsicInlineSize?: string;
+        containIntrinsicSize?: string;
+        containIntrinsicWidth?: string;
+        container?: string;
+        containerName?: string;
+        containerType?: string;
+        content?: string;
+        contentVisibility?: string;
+        counterIncrement?: string;
+        counterReset?: string;
+        counterSet?: string;
+        cssFloat?: string;
+        cssText?: string;
+        cursor?: string;
+        cx?: string;
+        cy?: string;
+        d?: string;
+        direction?: string;
+        display?: string;
+        dominantBaseline?: string;
+        emptyCells?: string;
+        fill?: string;
+        fillOpacity?: string;
+        fillRule?: string;
+        filter?: string;
+        flex?: string;
+        flexBasis?: string;
+        flexDirection?: string;
+        flexFlow?: string;
+        flexGrow?: string;
+        flexShrink?: string;
+        flexWrap?: string;
+        float?: string;
+        floodColor?: string;
+        floodOpacity?: string;
+        font?: string;
+        fontFamily?: string;
+        fontFeatureSettings?: string;
+        fontKerning?: string;
+        fontOpticalSizing?: string;
+        fontPalette?: string;
+        fontSize?: string;
+        fontSizeAdjust?: string;
+        fontStretch?: string;
+        fontStyle?: string;
+        fontSynthesis?: string;
+        fontSynthesisSmallCaps?: string;
+        fontSynthesisStyle?: string;
+        fontSynthesisWeight?: string;
+        fontVariant?: string;
+        fontVariantAlternates?: string;
+        fontVariantCaps?: string;
+        fontVariantEastAsian?: string;
+        fontVariantLigatures?: string;
+        fontVariantNumeric?: string;
+        fontVariantPosition?: string;
+        fontVariationSettings?: string;
+        fontWeight?: string;
+        forcedColorAdjust?: string;
+        gap?: string;
+        grid?: string;
+        gridArea?: string;
+        gridAutoColumns?: string;
+        gridAutoFlow?: string;
+        gridAutoRows?: string;
+        gridColumn?: string;
+        gridColumnEnd?: string;
+        gridColumnGap?: string;
+        gridColumnStart?: string;
+        gridGap?: string;
+        gridRow?: string;
+        gridRowEnd?: string;
+        gridRowGap?: string;
+        gridRowStart?: string;
+        gridTemplate?: string;
+        gridTemplateAreas?: string;
+        gridTemplateColumns?: string;
+        gridTemplateRows?: string;
+        height?: string;
+        hyphenateCharacter?: string;
+        hyphens?: string;
+        imageOrientation?: string;
+        imageRendering?: string;
+        inlineSize?: string;
+        inset?: string;
+        insetBlock?: string;
+        insetBlockEnd?: string;
+        insetBlockStart?: string;
+        insetInline?: string;
+        insetInlineEnd?: string;
+        insetInlineStart?: string;
+        isolation?: string;
+        justifyContent?: string;
+        justifyItems?: string;
+        justifySelf?: string;
+        left: string;
+        length?: number;
+        letterSpacing?: string;
+        lightingColor?: string;
+        lineBreak?: string;
+        lineHeight?: string;
+        listStyle?: string;
+        listStyleImage?: string;
+        listStylePosition?: string;
+        listStyleType?: string;
+        margin?: string;
+        marginBlock?: string;
+        marginBlockEnd?: string;
+        marginBlockStart?: string;
+        marginBottom?: string;
+        marginInline?: string;
+        marginInlineEnd?: string;
+        marginInlineStart?: string;
+        marginLeft?: string;
+        marginRight?: string;
+        marginTop?: string;
+        marker?: string;
+        markerEnd?: string;
+        markerMid?: string;
+        markerStart?: string;
+        mask?: string;
+        maskClip?: string;
+        maskComposite?: string;
+        maskImage?: string;
+        maskMode?: string;
+        maskOrigin?: string;
+        maskPosition?: string;
+        maskRepeat?: string;
+        maskSize?: string;
+        maskType?: string;
+        mathDepth?: string;
+        mathStyle?: string;
+        maxBlockSize?: string;
+        maxHeight: string;
+        maxInlineSize?: string;
+        maxWidth?: string;
+        minBlockSize?: string;
+        minHeight?: string;
+        minInlineSize?: string;
+        minWidth?: string;
+        mixBlendMode?: string;
+        objectFit?: string;
+        objectPosition?: string;
+        offset?: string;
+        offsetAnchor?: string;
+        offsetDistance?: string;
+        offsetPath?: string;
+        offsetPosition?: string;
+        offsetRotate?: string;
+        opacity?: string;
+        order?: string;
+        orphans?: string;
+        outline?: string;
+        outlineColor?: string;
+        outlineOffset?: string;
+        outlineStyle?: string;
+        outlineWidth?: string;
+        overflow?: string;
+        overflowAnchor?: string;
+        overflowClipMargin?: string;
+        overflowWrap?: string;
+        overflowX?: string;
+        overflowY: string;
+        overscrollBehavior?: string;
+        overscrollBehaviorBlock?: string;
+        overscrollBehaviorInline?: string;
+        overscrollBehaviorX?: string;
+        overscrollBehaviorY?: string;
+        padding: string;
+        paddingBlock?: string;
+        paddingBlockEnd?: string;
+        paddingBlockStart?: string;
+        paddingBottom?: string;
+        paddingInline?: string;
+        paddingInlineEnd?: string;
+        paddingInlineStart?: string;
+        paddingLeft?: string;
+        paddingRight?: string;
+        paddingTop?: string;
+        page?: string;
+        pageBreakAfter?: string;
+        pageBreakBefore?: string;
+        pageBreakInside?: string;
+        paintOrder?: string;
+        parentRule?: CSSRule | null;
+        perspective?: string;
+        perspectiveOrigin?: string;
+        placeContent?: string;
+        placeItems?: string;
+        placeSelf?: string;
+        pointerEvents?: string;
+        position: string;
+        printColorAdjust?: string;
+        quotes?: string;
+        r?: string;
+        resize?: string;
+        right: string;
+        rotate?: string;
+        rowGap?: string;
+        rubyPosition?: string;
+        rx?: string;
+        ry?: string;
+        scale?: string;
+        scrollBehavior?: string;
+        scrollMargin?: string;
+        scrollMarginBlock?: string;
+        scrollMarginBlockEnd?: string;
+        scrollMarginBlockStart?: string;
+        scrollMarginBottom?: string;
+        scrollMarginInline?: string;
+        scrollMarginInlineEnd?: string;
+        scrollMarginInlineStart?: string;
+        scrollMarginLeft?: string;
+        scrollMarginRight?: string;
+        scrollMarginTop?: string;
+        scrollPadding?: string;
+        scrollPaddingBlock?: string;
+        scrollPaddingBlockEnd?: string;
+        scrollPaddingBlockStart?: string;
+        scrollPaddingBottom?: string;
+        scrollPaddingInline?: string;
+        scrollPaddingInlineEnd?: string;
+        scrollPaddingInlineStart?: string;
+        scrollPaddingLeft?: string;
+        scrollPaddingRight?: string;
+        scrollPaddingTop?: string;
+        scrollSnapAlign?: string;
+        scrollSnapStop?: string;
+        scrollSnapType?: string;
+        scrollbarColor?: string;
+        scrollbarGutter?: string;
+        scrollbarWidth?: string;
+        shapeImageThreshold?: string;
+        shapeMargin?: string;
+        shapeOutside?: string;
+        shapeRendering?: string;
+        stopColor?: string;
+        stopOpacity?: string;
+        stroke?: string;
+        strokeDasharray?: string;
+        strokeDashoffset?: string;
+        strokeLinecap?: string;
+        strokeLinejoin?: string;
+        strokeMiterlimit?: string;
+        strokeOpacity?: string;
+        strokeWidth?: string;
+        tabSize?: string;
+        tableLayout?: string;
+        textAlign?: string;
+        textAlignLast?: string;
+        textAnchor?: string;
+        textCombineUpright?: string;
+        textDecoration?: string;
+        textDecorationColor?: string;
+        textDecorationLine?: string;
+        textDecorationSkipInk?: string;
+        textDecorationStyle?: string;
+        textDecorationThickness?: string;
+        textEmphasis?: string;
+        textEmphasisColor?: string;
+        textEmphasisPosition?: string;
+        textEmphasisStyle?: string;
+        textIndent?: string;
+        textOrientation?: string;
+        textOverflow?: string;
+        textRendering?: string;
+        textShadow?: string;
+        textTransform?: string;
+        textUnderlineOffset?: string;
+        textUnderlinePosition?: string;
+        textWrap?: string;
+        textWrapMode?: string;
+        textWrapStyle?: string;
+        top: string;
+        touchAction?: string;
+        transform?: string;
+        transformBox?: string;
+        transformOrigin?: string;
+        transformStyle?: string;
+        transition?: string;
+        transitionBehavior?: string;
+        transitionDelay?: string;
+        transitionDuration?: string;
+        transitionProperty?: string;
+        transitionTimingFunction?: string;
+        translate?: string;
+        unicodeBidi?: string;
+        userSelect?: string;
+        vectorEffect?: string;
+        verticalAlign?: string;
+        visibility?: string;
+        webkitAlignContent?: string;
+        webkitAlignItems?: string;
+        webkitAlignSelf?: string;
+        webkitAnimation?: string;
+        webkitAnimationDelay?: string;
+        webkitAnimationDirection?: string;
+        webkitAnimationDuration?: string;
+        webkitAnimationFillMode?: string;
+        webkitAnimationIterationCount?: string;
+        webkitAnimationName?: string;
+        webkitAnimationPlayState?: string;
+        webkitAnimationTimingFunction?: string;
+        webkitAppearance?: string;
+        webkitBackfaceVisibility?: string;
+        webkitBackgroundClip?: string;
+        webkitBackgroundOrigin?: string;
+        webkitBackgroundSize?: string;
+        webkitBorderBottomLeftRadius?: string;
+        webkitBorderBottomRightRadius?: string;
+        webkitBorderRadius?: string;
+        webkitBorderTopLeftRadius?: string;
+        webkitBorderTopRightRadius?: string;
+        webkitBoxAlign?: string;
+        webkitBoxFlex?: string;
+        webkitBoxOrdinalGroup?: string;
+        webkitBoxOrient?: string;
+        webkitBoxPack?: string;
+        webkitBoxShadow?: string;
+        webkitBoxSizing?: string;
+        webkitFilter?: string;
+        webkitFlex?: string;
+        webkitFlexBasis?: string;
+        webkitFlexDirection?: string;
+        webkitFlexFlow?: string;
+        webkitFlexGrow?: string;
+        webkitFlexShrink?: string;
+        webkitFlexWrap?: string;
+        webkitJustifyContent?: string;
+        webkitLineClamp?: string;
+        webkitMask?: string;
+        webkitMaskBoxImage?: string;
+        webkitMaskBoxImageOutset?: string;
+        webkitMaskBoxImageRepeat?: string;
+        webkitMaskBoxImageSlice?: string;
+        webkitMaskBoxImageSource?: string;
+        webkitMaskBoxImageWidth?: string;
+        webkitMaskClip?: string;
+        webkitMaskComposite?: string;
+        webkitMaskImage?: string;
+        webkitMaskOrigin?: string;
+        webkitMaskPosition?: string;
+        webkitMaskRepeat?: string;
+        webkitMaskSize?: string;
+        webkitOrder?: string;
+        webkitPerspective?: string;
+        webkitPerspectiveOrigin?: string;
+        webkitTextFillColor?: string;
+        webkitTextSizeAdjust?: string;
+        webkitTextStroke?: string;
+        webkitTextStrokeColor?: string;
+        webkitTextStrokeWidth?: string;
+        webkitTransform?: string;
+        webkitTransformOrigin?: string;
+        webkitTransformStyle?: string;
+        webkitTransition?: string;
+        webkitTransitionDelay?: string;
+        webkitTransitionDuration?: string;
+        webkitTransitionProperty?: string;
+        webkitTransitionTimingFunction?: string;
+        webkitUserSelect?: string;
+        whiteSpace?: string;
+        whiteSpaceCollapse?: string;
+        widows?: string;
+        width: string;
+        willChange?: string;
+        wordBreak?: string;
+        wordSpacing?: string;
+        wordWrap?: string;
+        writingMode?: string;
+        x?: string;
+        y?: string;
+        zIndex?: string;
+        zoom?: string;
+        getPropertyPriority?: (property: string) => string;
+        getPropertyValue?: (property: string) => string;
+        item?: (index: number) => string;
+        removeProperty?: (property: string) => string;
+        setProperty?: (property: string, value: string | null, priority?: string) => void;
+    };
     static ɵfac: i0.ɵɵFactoryDeclaration<WaitingRoomModal, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<WaitingRoomModal, "app-waiting-room-modal", never, { "isWaitingModalVisible": { "alias": "isWaitingModalVisible"; "required": false; }; "waitingRoomCounter": { "alias": "waitingRoomCounter"; "required": false; }; "waitingRoomList": { "alias": "waitingRoomList"; "required": false; }; "roomName": { "alias": "roomName"; "required": false; }; "socket": { "alias": "socket"; "required": false; }; "position": { "alias": "position"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; "onWaitingRoomClose": { "alias": "onWaitingRoomClose"; "required": false; }; "onWaitingRoomFilterChange": { "alias": "onWaitingRoomFilterChange"; "required": false; }; "updateWaitingList": { "alias": "updateWaitingList"; "required": false; }; "onWaitingRoomItemPress": { "alias": "onWaitingRoomItemPress"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<WaitingRoomModal, "app-waiting-room-modal", never, { "isWaitingModalVisible": { "alias": "isWaitingModalVisible"; "required": false; }; "waitingRoomCounter": { "alias": "waitingRoomCounter"; "required": false; }; "waitingRoomList": { "alias": "waitingRoomList"; "required": false; }; "roomName": { "alias": "roomName"; "required": false; }; "socket": { "alias": "socket"; "required": false; }; "position": { "alias": "position"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; "onWaitingRoomClose": { "alias": "onWaitingRoomClose"; "required": false; }; "onWaitingRoomFilterChange": { "alias": "onWaitingRoomFilterChange"; "required": false; }; "updateWaitingList": { "alias": "updateWaitingList"; "required": false; }; "overlayStyle": { "alias": "overlayStyle"; "required": false; }; "contentStyle": { "alias": "contentStyle"; "required": false; }; "customTemplate": { "alias": "customTemplate"; "required": false; }; "onWaitingRoomItemPress": { "alias": "onWaitingRoomItemPress"; "required": false; }; }, {}, never, never, true, never>;
 }