ov-components: Updated to Angular 19

master
Carlos Santos 2025-04-30 12:21:38 +02:00
parent 518e1511d2
commit 0c1e1a7134
53 changed files with 4890 additions and 4632 deletions

View File

@ -155,17 +155,19 @@
"sourceRoot": "src",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"builder": "@angular-devkit/build-angular:application",
"options": {
"outputPath": "dist/openvidu-webcomponent-rc",
"index": "src/index.html",
"main": "src/app/openvidu-webcomponent/openvidu-webcomponent.main.ts",
"outputPath": {
"base": "dist/openvidu-webcomponent-rc"
},
"index": "src/index.html",
"polyfills": ["zone.js"],
"tsConfig": "src/app/openvidu-webcomponent/tsconfig.openvidu-webcomponent.json",
"aot": true,
"assets": ["src/favicon.ico"],
"styles": ["src/app/openvidu-webcomponent/openvidu-webcomponent.component.scss"],
"scripts": []
"scripts": [],
"browser": "src/app/openvidu-webcomponent/openvidu-webcomponent.main.ts"
},
"configurations": {
"production": {
@ -179,9 +181,7 @@
"outputHashing": "none",
"sourceMap": false,
"namedChunks": false,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"extractLicenses": true,
"budgets": [
{
"type": "initial",

File diff suppressed because it is too large Load Diff

View File

@ -1,27 +1,27 @@
{
"dependencies": {
"@angular/animations": "18.2.5",
"@angular/cdk": "18.2.5",
"@angular/common": "18.2.5",
"@angular/core": "18.2.5",
"@angular/forms": "18.2.5",
"@angular/material": "18.2.5",
"@angular/platform-browser": "18.2.5",
"@angular/platform-browser-dynamic": "18.2.5",
"@angular/router": "18.2.5",
"@angular/animations": "19.2.8",
"@angular/cdk": "19.2.11",
"@angular/common": "19.2.8",
"@angular/core": "19.2.8",
"@angular/forms": "19.2.8",
"@angular/material": "19.2.11",
"@angular/platform-browser": "19.2.8",
"@angular/platform-browser-dynamic": "19.2.8",
"@angular/router": "19.2.8",
"@livekit/track-processors": "0.3.2",
"autolinker": "4.0.0",
"livekit-client": "2.5.2",
"rxjs": "7.8.1",
"tslib": "2.7.0",
"zone.js": "^0.14.6"
"zone.js": "^0.15.0"
},
"devDependencies": {
"@angular-devkit/build-angular": "18.2.5",
"@angular/cli": "18.2.5",
"@angular/compiler": "18.2.5",
"@angular/compiler-cli": "18.2.5",
"@angular/elements": "18.2.5",
"@angular-devkit/build-angular": "19.2.9",
"@angular/cli": "19.2.9",
"@angular/compiler": "19.2.8",
"@angular/compiler-cli": "19.2.8",
"@angular/elements": "19.2.8",
"@compodoc/compodoc": "^1.1.25",
"@types/dom-mediacapture-transform": "0.1.9",
"@types/dom-webcodecs": "0.1.11",
@ -49,13 +49,13 @@
"karma-mocha-reporter": "2.2.5",
"karma-notify-reporter": "1.3.0",
"lint-staged": "^15.2.10",
"ng-packagr": "18.2.1",
"ng-packagr": "19.2.2",
"npm-watch": "^0.13.0",
"prettier": "3.3.3",
"selenium-webdriver": "4.25.0",
"ts-node": "10.9.2",
"tslint": "6.1.3",
"typescript": "5.4.5",
"typescript": "5.8.3",
"webpack-bundle-analyzer": "^4.10.2"
},
"name": "openvidu-components-testapp",

View File

@ -8,7 +8,8 @@ import { RecordingService } from '../../services/recording/recording.service';
@Component({
selector: 'ov-admin-dashboard',
templateUrl: './admin-dashboard.component.html',
styleUrls: ['./admin-dashboard.component.scss']
styleUrls: ['./admin-dashboard.component.scss'],
standalone: false
})
export class AdminDashboardComponent implements OnInit, OnDestroy {
/**

View File

@ -7,7 +7,8 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
@Component({
selector: 'ov-admin-login',
templateUrl: './admin-login.component.html',
styleUrls: ['./admin-login.component.scss']
styleUrls: ['./admin-login.component.scss'],
standalone: false
})
export class AdminLoginComponent implements OnInit {
/**

View File

@ -10,6 +10,7 @@ import { Component } from '@angular/core';
<div class="stick loud play"></div>
<div class="stick normal play"></div>
</div>`,
styleUrls: ['./audio-wave.component.scss']
styleUrls: ['./audio-wave.component.scss'],
standalone: false
})
export class AudioWaveComponent {}

View File

@ -13,7 +13,8 @@ import { Component, Input } from '@angular/core';
</div>
</div>
`,
styleUrls: ['./avatar-profile.component.scss']
styleUrls: ['./avatar-profile.component.scss'],
standalone: false
})
export class AvatarProfileComponent {
letter: string;

View File

@ -5,8 +5,8 @@ import { MatDialogRef } from '@angular/material/dialog';
* @internal
*/
@Component({
selector: 'app-delete-dialog',
template: `
selector: 'app-delete-dialog',
template: `
<div mat-dialog-content>{{ 'PANEL.RECORDING.DELETE_QUESTION' | translate }}</div>
<div mat-dialog-actions>
<button mat-button [disableRipple]="true" (click)="close()">{{ 'PANEL.RECORDING.CANCEL' | translate }}</button>
@ -15,8 +15,8 @@ import { MatDialogRef } from '@angular/material/dialog';
</button>
</div>
`,
styles: [
`
styles: [
`
::ng-deep .mat-mdc-dialog-content {
color: var(--ov-text-surface-color) !important;
}
@ -36,7 +36,8 @@ import { MatDialogRef } from '@angular/material/dialog';
border-radius: var(--ov-surface-radius);
}
`
]
],
standalone: false
})
export class DeleteDialogComponent {
constructor(public dialogRef: MatDialogRef<DeleteDialogComponent>) {}

View File

@ -7,16 +7,16 @@ import { DialogData } from '../../models/dialog.model';
*/
@Component({
selector: 'ov-dialog-template',
template: `
selector: 'ov-dialog-template',
template: `
<h1 mat-dialog-title>{{ data.title }}</h1>
<div mat-dialog-content id="openvidu-dialog">{{ data.description }}</div>
<div mat-dialog-actions *ngIf="data.showActionButtons">
<button mat-button [disableRipple]="true" (click)="close()">{{ 'PANEL.CLOSE' | translate }}</button>
</div>
`,
styles: [
`
styles: [
`
::ng-deep .mat-mdc-dialog-content {
color: var(--ov-text-surface-color) !important;
}
@ -33,7 +33,8 @@ import { DialogData } from '../../models/dialog.model';
border-radius: var(--ov-surface-radius);
}
`
]
],
standalone: false
})
export class DialogTemplateComponent {
constructor(

View File

@ -8,8 +8,8 @@ import { DialogData } from '../../models/dialog.model';
*/
@Component({
selector: 'ov-pro-feature-template',
template: `
selector: 'ov-pro-feature-template',
template: `
<h1 mat-dialog-title>{{ data.title }}</h1>
<div mat-dialog-content>{{ data.description }}</div>
<div mat-dialog-actions *ngIf="data.showActionButtons">
@ -19,7 +19,8 @@ import { DialogData } from '../../models/dialog.model';
</button>
<button mat-button (click)="close()">{{'PANEL.CLOSE' | translate}}</button>
</div>
`
`,
standalone: false
})
export class ProFeatureDialogTemplateComponent {
constructor(public dialogRef: MatDialogRef<ProFeatureDialogTemplateComponent>, @Inject(MAT_DIALOG_DATA) public data: DialogData) {}

View File

@ -6,8 +6,8 @@ import { RecordingDialogData } from '../../models/dialog.model';
* @internal
*/
@Component({
selector: 'app-recording-dialog',
template: `
selector: 'app-recording-dialog',
template: `
<div mat-dialog-content>
<video #videoElement controls autoplay [src]="src" (error)="handleError()"></video>
</div>
@ -15,8 +15,8 @@ import { RecordingDialogData } from '../../models/dialog.model';
<button mat-button [disableRipple]="true" (click)="close()">{{ 'PANEL.CLOSE' | translate }}</button>
</div>
`,
styles: [
`
styles: [
`
::ng-deep .mat-mdc-dialog-content {
color: var(--ov-text-surface-color) !important;
}
@ -38,7 +38,8 @@ import { RecordingDialogData } from '../../models/dialog.model';
border-radius: var(--ov-surface-radius);
}
`
]
],
standalone: false
})
export class RecordingDialogComponent {
@ViewChild('videoElement', { static: true }) videoElement: ElementRef<HTMLVideoElement>;

View File

@ -30,7 +30,8 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
selector: 'ov-layout',
templateUrl: './layout.component.html',
styleUrls: ['./layout.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
export class LayoutComponent implements OnInit, OnDestroy, AfterViewInit {
/**

View File

@ -18,7 +18,8 @@ import { Track } from 'livekit-client';
transition(':enter', [style({ opacity: 0 }), animate('100ms', style({ opacity: 1 }))]),
transition(':leave', [style({ opacity: 1 }), animate('200ms', style({ opacity: 0 }))])
])
]
],
standalone: false
})
export class MediaElementComponent implements AfterViewInit {
_track: Track;

View File

@ -20,7 +20,8 @@ import { BroadcastingStartRequestedEvent, BroadcastingStopRequestedEvent } from
selector: 'ov-activities-panel',
templateUrl: './activities-panel.component.html',
styleUrls: ['../panel.component.scss', './activities-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
export class ActivitiesPanelComponent implements OnInit {
/**

View File

@ -18,7 +18,8 @@ import { OpenViduService } from '../../../../services/openvidu/openvidu.service'
selector: 'ov-broadcasting-activity',
templateUrl: './broadcasting-activity.component.html',
styleUrls: ['./broadcasting-activity.component.scss', '../activities-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
// TODO: Allow to add more than one broadcast url

View File

@ -24,7 +24,8 @@ import { LoggerService } from '../../../../services/logger/logger.service';
selector: 'ov-recording-activity',
templateUrl: './recording-activity.component.html',
styleUrls: ['./recording-activity.component.scss', '../activities-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
// TODO: Allow to add more than one recording type

View File

@ -12,7 +12,8 @@ import { VirtualBackgroundService } from '../../../services/virtual-background/v
selector: 'ov-background-effects-panel',
templateUrl: './background-effects-panel.component.html',
styleUrls: ['../panel.component.scss', './background-effects-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
export class BackgroundEffectsPanelComponent implements OnInit {
backgroundSelectedId: string;
@ -56,10 +57,6 @@ export class BackgroundEffectsPanelComponent implements OnInit {
}
async applyBackground(effect: BackgroundEffect) {
if (effect.type === EffectType.NONE) {
await this.backgroundService.removeBackground();
} else {
await this.backgroundService.applyBackground(effect);
}
await this.backgroundService.applyBackground(effect);
}
}

View File

@ -13,7 +13,8 @@ import { PanelService } from '../../../services/panel/panel.service';
selector: 'ov-chat-panel',
templateUrl: './chat-panel.component.html',
styleUrls: ['../panel.component.scss', './chat-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
export class ChatPanelComponent implements OnInit, AfterViewInit {
/**

View File

@ -37,7 +37,8 @@ import { BackgroundEffect } from '../../models/background-effect.model';
selector: 'ov-panel',
templateUrl: './panel.component.html',
styleUrls: ['./panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
export class PanelComponent implements OnInit {
/**

View File

@ -15,7 +15,8 @@ import { ParticipantService } from '../../../../services/participant/participant
selector: 'ov-participant-panel-item',
templateUrl: './participant-panel-item.component.html',
styleUrls: ['./participant-panel-item.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
export class ParticipantPanelItemComponent implements OnInit, OnDestroy {
/**

View File

@ -25,7 +25,8 @@ import { ParticipantModel } from '../../../../models/participant.model';
selector: 'ov-participants-panel',
templateUrl: './participants-panel.component.html',
styleUrls: ['../../panel.component.scss', './participants-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
export class ParticipantsPanelComponent implements OnInit, OnDestroy, AfterViewInit {
/**

View File

@ -13,7 +13,8 @@ import { LangOption } from '../../../models/lang.model';
@Component({
selector: 'ov-settings-panel',
templateUrl: './settings-panel.component.html',
styleUrls: ['../panel.component.scss', './settings-panel.component.scss']
styleUrls: ['../panel.component.scss', './settings-panel.component.scss'],
standalone: false
})
export class SettingsPanelComponent implements OnInit {
@Output() onVideoEnabledChanged = new EventEmitter<boolean>();

View File

@ -17,7 +17,8 @@ import { StorageService } from '../../services/storage/storage.service';
@Component({
selector: 'ov-pre-join',
templateUrl: './pre-join.component.html',
styleUrls: ['./pre-join.component.scss']
styleUrls: ['./pre-join.component.scss'],
standalone: false
})
export class PreJoinComponent implements OnInit, OnDestroy {
@Input() set error(error: { name: string; message: string } | undefined) {

View File

@ -53,11 +53,12 @@ import { ParticipantLeftEvent, ParticipantLeftReason, ParticipantModel } from '.
*/
@Component({
selector: 'ov-session',
templateUrl: './session.component.html',
styleUrls: ['./session.component.scss'],
animations: [trigger('sessionAnimation', [transition(':enter', [style({ opacity: 0 }), animate('50ms', style({ opacity: 1 }))])])],
changeDetection: ChangeDetectionStrategy.OnPush
selector: 'ov-session',
templateUrl: './session.component.html',
styleUrls: ['./session.component.scss'],
animations: [trigger('sessionAnimation', [transition(':enter', [style({ opacity: 0 }), animate('50ms', style({ opacity: 1 }))])])],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
export class SessionComponent implements OnInit, OnDestroy {
@ContentChild('toolbar', { read: TemplateRef }) toolbarTemplate: TemplateRef<any>;

View File

@ -12,7 +12,8 @@ import { ParticipantModel } from '../../../models/participant.model';
@Component({
selector: 'ov-audio-devices-select',
templateUrl: './audio-devices.component.html',
styleUrls: ['./audio-devices.component.scss']
styleUrls: ['./audio-devices.component.scss'],
standalone: false
})
export class AudioDevicesComponent implements OnInit, OnDestroy {
@Output() onAudioDeviceChanged = new EventEmitter<CustomDevice>();

View File

@ -12,7 +12,8 @@ import { Subscription } from 'rxjs';
@Component({
selector: 'ov-lang-selector',
templateUrl: './lang-selector.component.html',
styleUrls: ['./lang-selector.component.scss']
styleUrls: ['./lang-selector.component.scss'],
standalone: false
})
export class LangSelectorComponent implements OnInit, OnDestroy {
/**

View File

@ -9,7 +9,8 @@ import { StorageService } from '../../../services/storage/storage.service';
@Component({
selector: 'ov-participant-name-input',
templateUrl: './participant-name-input.component.html',
styleUrls: ['./participant-name-input.component.scss']
styleUrls: ['./participant-name-input.component.scss'],
standalone: false
})
export class ParticipantNameInputComponent implements OnInit {
name: string;

View File

@ -12,7 +12,8 @@ import { ParticipantModel } from '../../../models/participant.model';
@Component({
selector: 'ov-video-devices-select',
templateUrl: './video-devices.component.html',
styleUrls: ['./video-devices.component.scss']
styleUrls: ['./video-devices.component.scss'],
standalone: false
})
export class VideoDevicesComponent implements OnInit, OnDestroy {
@Output() onVideoDeviceChanged = new EventEmitter<CustomDevice>();

View File

@ -15,7 +15,8 @@ import { ParticipantTrackPublication } from '../../models/participant.model';
@Component({
selector: 'ov-stream',
templateUrl: './stream.component.html',
styleUrls: ['./stream.component.scss']
styleUrls: ['./stream.component.scss'],
standalone: false
})
export class StreamComponent implements OnInit, OnDestroy {
/**

View File

@ -58,7 +58,8 @@ import { ToolbarAdditionalButtonsPosition } from '../../models/toolbar.model';
selector: 'ov-toolbar',
templateUrl: './toolbar.component.html',
styleUrls: ['./toolbar.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
})
export class ToolbarComponent implements OnInit, OnDestroy, AfterViewInit {
/**

View File

@ -54,7 +54,8 @@ import { LangOption } from '../../models/lang.model';
transition(':enter', [style({ opacity: 0 }), animate('300ms ease-out', style({ opacity: 1 }))])
// transition(':leave', [style({ opacity: 1 }), animate('50ms ease-in', style({ opacity: 0.9 }))])
])
]
],
standalone: false
})
export class VideoconferenceComponent implements OnDestroy, AfterViewInit {
// *** Toolbar ***

View File

@ -17,7 +17,8 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
* <ov-activities-panel *ovActivitiesPanel [recordingActivity]="false"></ov-activities-panel>
*/
@Directive({
selector: 'ov-videoconference[activitiesPanelRecordingActivity], ov-activities-panel[recordingActivity]'
selector: 'ov-videoconference[activitiesPanelRecordingActivity], ov-activities-panel[recordingActivity]',
standalone: false
})
export class ActivitiesPanelRecordingActivityDirective implements AfterViewInit, OnDestroy {
@Input() set activitiesPanelRecordingActivity(value: boolean) {
@ -31,7 +32,10 @@ export class ActivitiesPanelRecordingActivityDirective implements AfterViewInit,
recordingActivityValue: boolean = true;
constructor(public elementRef: ElementRef, private libService: OpenViduComponentsConfigService) {}
constructor(
public elementRef: ElementRef,
private libService: OpenViduComponentsConfigService
) {}
ngAfterViewInit() {
this.update(this.recordingActivityValue);
@ -66,8 +70,9 @@ export class ActivitiesPanelRecordingActivityDirective implements AfterViewInit,
* @example
* <ov-activities-panel *ovActivitiesPanel [broadcastingActivity]="false"></ov-activities-panel>
*/
@Directive({
selector: 'ov-videoconference[activitiesPanelBroadcastingActivity], ov-activities-panel[broadcastingActivity]'
@Directive({
selector: 'ov-videoconference[activitiesPanelBroadcastingActivity], ov-activities-panel[broadcastingActivity]',
standalone: false
})
export class ActivitiesPanelBroadcastingActivityDirective implements AfterViewInit, OnDestroy {
@Input() set activitiesPanelBroadcastingActivity(value: boolean) {
@ -81,7 +86,10 @@ export class ActivitiesPanelBroadcastingActivityDirective implements AfterViewIn
broadcastingActivityValue: boolean = true;
constructor(public elementRef: ElementRef, private libService: OpenViduComponentsConfigService) {}
constructor(
public elementRef: ElementRef,
private libService: OpenViduComponentsConfigService
) {}
ngAfterViewInit() {
this.update(this.broadcastingActivityValue);
@ -100,4 +108,3 @@ export class ActivitiesPanelBroadcastingActivityDirective implements AfterViewIn
}
}
}

View File

@ -12,7 +12,8 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
*
*/
@Directive({
selector: 'ov-admin-dashboard[recordingsList]'
selector: 'ov-admin-dashboard[recordingsList]',
standalone: false
})
export class AdminDashboardRecordingsListDirective implements AfterViewInit, OnDestroy {
@ -53,7 +54,8 @@ export class AdminDashboardRecordingsListDirective implements AfterViewInit, OnD
*
*/
@Directive({
selector: 'ov-admin-dashboard[navbarTitle]'
selector: 'ov-admin-dashboard[navbarTitle]',
standalone: false
})
export class AdminDashboardTitleDirective implements AfterViewInit, OnDestroy {
@ -95,7 +97,8 @@ export class AdminDashboardTitleDirective implements AfterViewInit, OnDestroy {
*
*/
@Directive({
selector: 'ov-admin-login[navbarTitle]'
selector: 'ov-admin-login[navbarTitle]',
standalone: false
})
export class AdminLoginTitleDirective implements AfterViewInit, OnDestroy {
@ -138,7 +141,8 @@ export class AdminLoginTitleDirective implements AfterViewInit, OnDestroy {
*
*/
@Directive({
selector: 'ov-admin-login[error]'
selector: 'ov-admin-login[error]',
standalone: false
})
export class AdminLoginErrorDirective implements AfterViewInit, OnDestroy {

View File

@ -1,7 +1,17 @@
import { NgModule } from '@angular/core';
import { ActivitiesPanelBroadcastingActivityDirective, ActivitiesPanelRecordingActivityDirective } from './activities-panel.directive';
import { AdminLoginErrorDirective, AdminDashboardRecordingsListDirective, AdminLoginTitleDirective, AdminDashboardTitleDirective } from './admin.directive';
import { LayoutRemoteParticipantsDirective, FallbackLogoDirective, ToolbarBrandingLogoDirective, PrejoinDisplayParticipantName } from './internals.directive';
import {
AdminLoginErrorDirective,
AdminDashboardRecordingsListDirective,
AdminLoginTitleDirective,
AdminDashboardTitleDirective
} from './admin.directive';
import {
LayoutRemoteParticipantsDirective,
FallbackLogoDirective,
ToolbarBrandingLogoDirective,
PrejoinDisplayParticipantName
} from './internals.directive';
import { ParticipantPanelItemMuteButtonDirective } from './participant-panel-item.directive';
import {
StreamDisplayAudioDetectionDirective,
@ -42,97 +52,54 @@ import {
VideoEnabledDirective
} from './videoconference.directive';
const directives = [
LivekitUrlDirective,
TokenDirective,
TokenErrorDirective,
MinimalDirective,
LangDirective,
LangOptionsDirective,
// CaptionsLangOptionsDirective,
// CaptionsLangDirective,
PrejoinDirective,
PrejoinDisplayParticipantName,
VideoEnabledDirective,
AudioEnabledDirective,
RecordingStreamBaseUrlDirective,
ToolbarCameraButtonDirective,
ToolbarMicrophoneButtonDirective,
ToolbarScreenshareButtonDirective,
ToolbarFullscreenButtonDirective,
ToolbarBackgroundEffectsButtonDirective,
// ToolbarCaptionsButtonDirective,
ToolbarLeaveButtonDirective,
ToolbarRecordingButtonDirective,
ToolbarBroadcastingButtonDirective,
ToolbarParticipantsPanelButtonDirective,
ToolbarChatPanelButtonDirective,
ToolbarActivitiesPanelButtonDirective,
ToolbarDisplayRoomNameDirective,
ToolbarDisplayLogoDirective,
ToolbarSettingsButtonDirective,
ToolbarAdditionalButtonsPossitionDirective,
StreamDisplayParticipantNameDirective,
StreamDisplayAudioDetectionDirective,
StreamVideoControlsDirective,
FallbackLogoDirective,
ToolbarBrandingLogoDirective,
ParticipantPanelItemMuteButtonDirective,
ParticipantNameDirective,
ActivitiesPanelRecordingActivityDirective,
ActivitiesPanelBroadcastingActivityDirective,
AdminDashboardRecordingsListDirective,
AdminLoginTitleDirective,
AdminLoginErrorDirective,
AdminDashboardTitleDirective,
LayoutRemoteParticipantsDirective
];
@NgModule({
declarations: [
LivekitUrlDirective,
TokenDirective,
TokenErrorDirective,
MinimalDirective,
LangDirective,
LangOptionsDirective,
// CaptionsLangOptionsDirective,
// CaptionsLangDirective,
PrejoinDirective,
PrejoinDisplayParticipantName,
VideoEnabledDirective,
AudioEnabledDirective,
RecordingStreamBaseUrlDirective,
ToolbarCameraButtonDirective,
ToolbarMicrophoneButtonDirective,
ToolbarScreenshareButtonDirective,
ToolbarFullscreenButtonDirective,
ToolbarBackgroundEffectsButtonDirective,
// ToolbarCaptionsButtonDirective,
ToolbarLeaveButtonDirective,
ToolbarRecordingButtonDirective,
ToolbarBroadcastingButtonDirective,
ToolbarParticipantsPanelButtonDirective,
ToolbarChatPanelButtonDirective,
ToolbarActivitiesPanelButtonDirective,
ToolbarDisplayRoomNameDirective,
ToolbarDisplayLogoDirective,
ToolbarSettingsButtonDirective,
ToolbarAdditionalButtonsPossitionDirective,
StreamDisplayParticipantNameDirective,
StreamDisplayAudioDetectionDirective,
StreamVideoControlsDirective,
FallbackLogoDirective,
ToolbarBrandingLogoDirective,
ParticipantPanelItemMuteButtonDirective,
ParticipantNameDirective,
ActivitiesPanelRecordingActivityDirective,
ActivitiesPanelBroadcastingActivityDirective,
AdminDashboardRecordingsListDirective,
AdminLoginTitleDirective,
AdminLoginErrorDirective,
AdminDashboardTitleDirective,
LayoutRemoteParticipantsDirective
],
exports: [
LivekitUrlDirective,
TokenDirective,
TokenErrorDirective,
MinimalDirective,
LangDirective,
LangOptionsDirective,
// CaptionsLangOptionsDirective,
// CaptionsLangDirective,
PrejoinDirective,
PrejoinDisplayParticipantName,
VideoEnabledDirective,
AudioEnabledDirective,
RecordingStreamBaseUrlDirective,
ToolbarCameraButtonDirective,
ToolbarMicrophoneButtonDirective,
ToolbarScreenshareButtonDirective,
ToolbarFullscreenButtonDirective,
ToolbarBackgroundEffectsButtonDirective,
// ToolbarCaptionsButtonDirective,
ToolbarLeaveButtonDirective,
ToolbarRecordingButtonDirective,
ToolbarBroadcastingButtonDirective,
ToolbarParticipantsPanelButtonDirective,
ToolbarChatPanelButtonDirective,
ToolbarActivitiesPanelButtonDirective,
ToolbarDisplayRoomNameDirective,
ToolbarDisplayLogoDirective,
ToolbarSettingsButtonDirective,
ToolbarAdditionalButtonsPossitionDirective,
StreamDisplayParticipantNameDirective,
StreamDisplayAudioDetectionDirective,
StreamVideoControlsDirective,
FallbackLogoDirective,
ToolbarBrandingLogoDirective,
ParticipantPanelItemMuteButtonDirective,
ParticipantNameDirective,
ActivitiesPanelRecordingActivityDirective,
ActivitiesPanelBroadcastingActivityDirective,
AdminDashboardRecordingsListDirective,
AdminLoginTitleDirective,
AdminLoginErrorDirective,
AdminDashboardTitleDirective,
LayoutRemoteParticipantsDirective
]
declarations: [...directives],
exports: [...directives]
})
export class ApiDirectiveModule {}

View File

@ -9,7 +9,8 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
* @internal
*/
@Directive({
selector: 'img[ovLogo]'
selector: 'img[ovLogo]',
standalone: false
})
export class FallbackLogoDirective implements OnInit {
defaultLogo =
@ -53,7 +54,8 @@ export class FallbackLogoDirective implements OnInit {
* @internal
*/
@Directive({
selector: 'ov-layout[ovRemoteParticipants]'
selector: 'ov-layout[ovRemoteParticipants]',
standalone: false
})
export class LayoutRemoteParticipantsDirective {
@Input() set ovRemoteParticipants(value: ParticipantModel[] | undefined) {
@ -85,7 +87,8 @@ export class LayoutRemoteParticipantsDirective {
* @internal
*/
@Directive({
selector: 'ov-videoconference[brandingLogo], ov-toolbar[brandingLogo]'
selector: 'ov-videoconference[brandingLogo], ov-toolbar[brandingLogo]',
standalone: false
})
export class ToolbarBrandingLogoDirective implements AfterViewInit, OnDestroy {
/**
@ -127,7 +130,8 @@ export class ToolbarBrandingLogoDirective implements AfterViewInit, OnDestroy {
* @internal
*/
@Directive({
selector: 'ov-videoconference[prejoinDisplayParticipantName]'
selector: 'ov-videoconference[prejoinDisplayParticipantName]',
standalone: false
})
export class PrejoinDisplayParticipantName implements OnDestroy {
/**

View File

@ -17,7 +17,8 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
* <ov-participant-panel-item [muteButton]="false"></ov-participant-panel-item>
*/
@Directive({
selector: 'ov-videoconference[participantPanelItemMuteButton], ov-participant-panel-item[muteButton]'
selector: 'ov-videoconference[participantPanelItemMuteButton], ov-participant-panel-item[muteButton]',
standalone: false
})
export class ParticipantPanelItemMuteButtonDirective implements AfterViewInit, OnDestroy {
@Input() set participantPanelItemMuteButton(value: boolean) {

View File

@ -17,7 +17,8 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
* <ov-stream [displayParticipantName]="false"></ov-stream>
*/
@Directive({
selector: 'ov-videoconference[streamDisplayParticipantName], ov-stream[displayParticipantName]'
selector: 'ov-videoconference[streamDisplayParticipantName], ov-stream[displayParticipantName]',
standalone: false
})
export class StreamDisplayParticipantNameDirective implements AfterViewInit, OnDestroy {
@Input() set streamDisplayParticipantName(value: boolean) {
@ -71,7 +72,8 @@ export class StreamDisplayParticipantNameDirective implements AfterViewInit, OnD
* <ov-stream [displayAudioDetection]="false"></ov-stream>
*/
@Directive({
selector: 'ov-videoconference[streamDisplayAudioDetection], ov-stream[displayAudioDetection]'
selector: 'ov-videoconference[streamDisplayAudioDetection], ov-stream[displayAudioDetection]',
standalone: false
})
export class StreamDisplayAudioDetectionDirective implements AfterViewInit, OnDestroy {
@Input() set streamDisplayAudioDetection(value: boolean) {
@ -123,7 +125,8 @@ export class StreamDisplayAudioDetectionDirective implements AfterViewInit, OnDe
* <ov-stream [videoControls]="false"></ov-stream>
*/
@Directive({
selector: 'ov-videoconference[streamVideoControls], ov-stream[videoControls]'
selector: 'ov-videoconference[streamVideoControls], ov-stream[videoControls]',
standalone: false
})
export class StreamVideoControlsDirective implements AfterViewInit, OnDestroy {
@Input() set streamVideoControls(value: boolean) {

View File

@ -18,7 +18,8 @@ import { ToolbarAdditionalButtonsPosition } from '../../models/toolbar.model';
* <ov-toolbar [cameraButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarCameraButton], ov-toolbar[cameraButton]'
selector: 'ov-videoconference[toolbarCameraButton], ov-toolbar[cameraButton]',
standalone: false
})
export class ToolbarCameraButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -83,7 +84,8 @@ export class ToolbarCameraButtonDirective implements AfterViewInit, OnDestroy {
* <ov-toolbar [microphoneButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarMicrophoneButton], ov-toolbar[microphoneButton]'
selector: 'ov-videoconference[toolbarMicrophoneButton], ov-toolbar[microphoneButton]',
standalone: false
})
export class ToolbarMicrophoneButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -132,7 +134,6 @@ export class ToolbarMicrophoneButtonDirective implements AfterViewInit, OnDestro
}
}
/**
* The **screenshareButton** directive allows show/hide the screenshare toolbar button.
*
@ -149,7 +150,8 @@ export class ToolbarMicrophoneButtonDirective implements AfterViewInit, OnDestro
* <ov-toolbar [screenshareButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarScreenshareButton], ov-toolbar[screenshareButton]'
selector: 'ov-videoconference[toolbarScreenshareButton], ov-toolbar[screenshareButton]',
standalone: false
})
export class ToolbarScreenshareButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -214,7 +216,8 @@ export class ToolbarScreenshareButtonDirective implements AfterViewInit, OnDestr
* <ov-toolbar [recordingButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarRecordingButton], ov-toolbar[recordingButton]'
selector: 'ov-videoconference[toolbarRecordingButton], ov-toolbar[recordingButton]',
standalone: false
})
export class ToolbarRecordingButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -277,7 +280,8 @@ export class ToolbarRecordingButtonDirective implements AfterViewInit, OnDestroy
*
*/
@Directive({
selector: 'ov-videoconference[toolbarBroadcastingButton], ov-toolbar[broadcastingButton]'
selector: 'ov-videoconference[toolbarBroadcastingButton], ov-toolbar[broadcastingButton]',
standalone: false
})
export class ToolbarBroadcastingButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -339,7 +343,8 @@ export class ToolbarBroadcastingButtonDirective implements AfterViewInit, OnDest
* <ov-toolbar [fullscreenButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarFullscreenButton], ov-toolbar[fullscreenButton]'
selector: 'ov-videoconference[toolbarFullscreenButton], ov-toolbar[fullscreenButton]',
standalone: false
})
export class ToolbarFullscreenButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -401,7 +406,8 @@ export class ToolbarFullscreenButtonDirective implements AfterViewInit, OnDestro
* <ov-toolbar [backgroundEffectsButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarBackgroundEffectsButton], ov-toolbar[backgroundEffectsButton]'
selector: 'ov-videoconference[toolbarBackgroundEffectsButton], ov-toolbar[backgroundEffectsButton]',
standalone: false
})
export class ToolbarBackgroundEffectsButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -522,7 +528,8 @@ export class ToolbarBackgroundEffectsButtonDirective implements AfterViewInit, O
* <ov-toolbar [settingsButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarSettingsButton], ov-toolbar[settingsButton]'
selector: 'ov-videoconference[toolbarSettingsButton], ov-toolbar[settingsButton]',
standalone: false
})
export class ToolbarSettingsButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -584,7 +591,8 @@ export class ToolbarSettingsButtonDirective implements AfterViewInit, OnDestroy
* <ov-toolbar [leaveButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarLeaveButton], ov-toolbar[leaveButton]'
selector: 'ov-videoconference[toolbarLeaveButton], ov-toolbar[leaveButton]',
standalone: false
})
export class ToolbarLeaveButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -647,7 +655,8 @@ export class ToolbarLeaveButtonDirective implements AfterViewInit, OnDestroy {
* <ov-toolbar [participantsPanelButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarParticipantsPanelButton], ov-toolbar[participantsPanelButton]'
selector: 'ov-videoconference[toolbarParticipantsPanelButton], ov-toolbar[participantsPanelButton]',
standalone: false
})
export class ToolbarParticipantsPanelButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -711,7 +720,8 @@ export class ToolbarParticipantsPanelButtonDirective implements AfterViewInit, O
* <ov-toolbar [chatPanelButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarChatPanelButton], ov-toolbar[chatPanelButton]'
selector: 'ov-videoconference[toolbarChatPanelButton], ov-toolbar[chatPanelButton]',
standalone: false
})
export class ToolbarChatPanelButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -773,7 +783,8 @@ export class ToolbarChatPanelButtonDirective implements AfterViewInit, OnDestroy
* <ov-toolbar [activitiesPanelButton]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarActivitiesPanelButton], ov-toolbar[activitiesPanelButton]'
selector: 'ov-videoconference[toolbarActivitiesPanelButton], ov-toolbar[activitiesPanelButton]',
standalone: false
})
export class ToolbarActivitiesPanelButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -835,7 +846,8 @@ export class ToolbarActivitiesPanelButtonDirective implements AfterViewInit, OnD
* <ov-toolbar [displayRoomName]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarDisplayRoomName], ov-toolbar[displayRoomName]'
selector: 'ov-videoconference[toolbarDisplayRoomName], ov-toolbar[displayRoomName]',
standalone: false
})
export class ToolbarDisplayRoomNameDirective implements AfterViewInit, OnDestroy {
/**
@ -898,7 +910,8 @@ export class ToolbarDisplayRoomNameDirective implements AfterViewInit, OnDestroy
* <ov-toolbar [displayLogo]="false"></ov-toolbar>
*/
@Directive({
selector: 'ov-videoconference[toolbarDisplayLogo], ov-toolbar[displayLogo]'
selector: 'ov-videoconference[toolbarDisplayLogo], ov-toolbar[displayLogo]',
standalone: false
})
export class ToolbarDisplayLogoDirective implements AfterViewInit, OnDestroy {
/**
@ -958,7 +971,8 @@ export class ToolbarDisplayLogoDirective implements AfterViewInit, OnDestroy {
*
*/
@Directive({
selector: '[ovToolbarAdditionalButtonsPosition]'
selector: '[ovToolbarAdditionalButtonsPosition]',
standalone: false
})
export class ToolbarAdditionalButtonsPossitionDirective implements AfterViewInit, OnDestroy {
/**

View File

@ -18,7 +18,8 @@ import { StorageService } from '../../services/storage/storage.service';
* <ov-videoconference [livekitUrl]="http://localhost:1234"></ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[livekitUrl]'
selector: 'ov-videoconference[livekitUrl]',
standalone: false
})
export class LivekitUrlDirective implements OnDestroy {
/**
@ -70,7 +71,8 @@ export class LivekitUrlDirective implements OnDestroy {
* <ov-videoconference [token]="token"></ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[token]'
selector: 'ov-videoconference[token]',
standalone: false
})
export class TokenDirective implements OnDestroy {
/**
@ -121,7 +123,8 @@ export class TokenDirective implements OnDestroy {
* <ov-videoconference [tokenError]="error"></ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[tokenError]'
selector: 'ov-videoconference[tokenError]',
standalone: false
})
export class TokenErrorDirective implements OnDestroy {
/**
@ -172,7 +175,8 @@ export class TokenErrorDirective implements OnDestroy {
* <ov-videoconference [minimal]="true"></ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[minimal]'
selector: 'ov-videoconference[minimal]',
standalone: false
})
export class MinimalDirective implements OnDestroy {
/**
@ -238,7 +242,8 @@ export class MinimalDirective implements OnDestroy {
* <ov-videoconference [lang]="'es'"></ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[lang]'
selector: 'ov-videoconference[lang]',
standalone: false
})
export class LangDirective implements OnDestroy {
/**
@ -307,7 +312,8 @@ export class LangDirective implements OnDestroy {
* <ov-videoconference [langOptions]="[{name:'Spanish', lang: 'es'}]"></ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[langOptions]'
selector: 'ov-videoconference[langOptions]',
standalone: false
})
export class LangOptionsDirective implements OnDestroy {
/**
@ -488,7 +494,8 @@ export class LangOptionsDirective implements OnDestroy {
* <ov-videoconference [participantName]="'OpenVidu'"></ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[participantName]'
selector: 'ov-videoconference[participantName]',
standalone: false
})
export class ParticipantNameDirective implements AfterViewInit, OnDestroy {
/**
@ -546,7 +553,8 @@ export class ParticipantNameDirective implements AfterViewInit, OnDestroy {
* <ov-videoconference [prejoin]="false"></ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[prejoin]'
selector: 'ov-videoconference[prejoin]',
standalone: false
})
export class PrejoinDirective implements OnDestroy {
/**
@ -600,7 +608,8 @@ export class PrejoinDirective implements OnDestroy {
* <ov-videoconference [videoEnabled]="false"></ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[videoEnabled]'
selector: 'ov-videoconference[videoEnabled]',
standalone: false
})
export class VideoEnabledDirective implements OnDestroy {
/**
@ -671,7 +680,8 @@ export class VideoEnabledDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[audioEnabled]'
selector: 'ov-videoconference[audioEnabled]',
standalone: false
})
export class AudioEnabledDirective implements OnDestroy {
/**
@ -745,7 +755,8 @@ export class AudioEnabledDirective implements OnDestroy {
* </ov-videoconference>
*/
@Directive({
selector: 'ov-videoconference[recordingStreamBaseUrl]'
selector: 'ov-videoconference[recordingStreamBaseUrl]',
standalone: false
})
export class RecordingStreamBaseUrlDirective implements AfterViewInit, OnDestroy {
/**

View File

@ -46,7 +46,6 @@ import { ApiDirectiveModule } from './directives/api/api.directive.module';
import { OpenViduComponentsDirectiveModule } from './directives/template/openvidu-components-angular.directive.module';
import { AppMaterialModule } from './openvidu-components-angular.material.module';
// Declaraciones de componentes/pipes (públicos y privados)
const publicComponents = [
AdminDashboardComponent,
AdminLoginComponent,

View File

@ -4,7 +4,7 @@ import { Linkifier } from '../models/linkifier.model';
/**
* @internal
*/
@Pipe({ name: 'linkify' })
@Pipe({ name: 'linkify', standalone: false })
export class LinkifyPipe implements PipeTransform {
private linkifer: Linkifier;

View File

@ -8,9 +8,9 @@ import { Track } from 'livekit-client';
* This is used to display the tracks in the videoconference layout.
* @returns {ParticipantTrackPublication[]} Array of tracks
*/
@Pipe({ name: 'tracks' })
@Pipe({ name: 'tracks', standalone: false })
export class RemoteParticipantTracksPipe implements PipeTransform {
constructor() { }
constructor() {}
transform(participants: ParticipantModel[]): ParticipantTrackPublication[] {
return participants.map((p) => p.tracks).flat();
@ -20,9 +20,9 @@ export class RemoteParticipantTracksPipe implements PipeTransform {
/**
* @internal
*/
@Pipe({ name: 'tracksPublishedTypes' })
@Pipe({ name: 'tracksPublishedTypes', standalone: false })
export class TrackPublishedTypesPipe implements PipeTransform {
constructor(private translateService: TranslateService) { }
constructor(private translateService: TranslateService) {}
transform(participant: ParticipantModel): string {
const trackTypes = participant?.getTracksPublishedTypes() ?? [];

View File

@ -4,7 +4,8 @@ import { Pipe, PipeTransform } from '@angular/core';
* @internal
*/
@Pipe({
name: 'duration'
name: 'duration',
standalone: false
})
export class DurationFromSecondsPipe implements PipeTransform {
transform(durationInSeconds: number): string {
@ -26,7 +27,8 @@ export class DurationFromSecondsPipe implements PipeTransform {
* @internal
*/
@Pipe({
name: 'searchByStringProperty'
name: 'searchByStringProperty',
standalone: false
})
export class SearchByStringPropertyPipe implements PipeTransform {
transform(items: any[], props: { properties: string[]; filter: string }): any {
@ -57,7 +59,8 @@ export class SearchByStringPropertyPipe implements PipeTransform {
* @internal
*/
@Pipe({
name: 'thumbnailUrl'
name: 'thumbnailUrl',
standalone: false
})
export class ThumbnailFromUrlPipe implements PipeTransform {
transform(url: string): string {

View File

@ -4,7 +4,10 @@ import { TranslateService } from '../services/translate/translate.service';
/**
* @internal
*/
@Pipe({ name: 'translate', pure: false })
@Pipe({
name: 'translate', pure: false,
standalone: false
})
export class TranslatePipe implements PipeTransform {
constructor(private translateService: TranslateService) {}

View File

@ -3,9 +3,10 @@ import { RecordingDeleteRequestedEvent, RecordingInfo } from 'openvidu-component
import { RestService } from 'src/app/services/rest.service';
@Component({
selector: 'app-admin-dashboard',
templateUrl: './admin-dashboard.component.html',
styleUrls: ['./admin-dashboard.component.scss']
selector: 'app-admin-dashboard',
templateUrl: './admin-dashboard.component.html',
styleUrls: ['./admin-dashboard.component.scss'],
standalone: false
})
export class AdminDashboardComponent implements OnInit {
recordings: RecordingInfo[] = [];

View File

@ -1,9 +1,10 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
standalone: false
})
export class AppComponent implements OnInit {
title = 'openvidu-components-angular';

View File

@ -2,9 +2,10 @@ import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.scss']
selector: 'app-dashboard',
templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.scss'],
standalone: false
})
export class DashboardComponent implements OnInit {
title = 'openvidu-components-angular';

View File

@ -15,9 +15,10 @@ import { ActivatedRoute, Router } from '@angular/router';
import { ParticipantLeftEvent } from '../../../projects/openvidu-components-angular/src/lib/models/participant.model';
@Component({
selector: 'app-call',
templateUrl: './call.component.html',
styleUrls: ['./call.component.scss']
selector: 'app-call',
templateUrl: './call.component.html',
styleUrls: ['./call.component.scss'],
standalone: false
})
export class CallComponent implements OnInit {
roomName = 'daily-call';

View File

@ -1,13 +1,15 @@
@use '@angular/material' as mat;
@include mat.core();
@include mat.elevation-classes();
@include mat.app-background();
// Define the theme
$openvidu-theme: mat.define-theme();
html {
// Emit theme-dependent styles for common features used across multiple components.
@include mat.core-theme($openvidu-theme);
@include mat.elevation-classes();
@include mat.app-background();
// @include mat.button-theme($theme);
@include mat.all-component-bases($openvidu-theme);
@include mat.all-component-colors($openvidu-theme);

View File

@ -28,7 +28,8 @@ import { LangOption } from '../../../projects/openvidu-components-angular/src/li
*
*/
@Component({
templateUrl: './openvidu-webcomponent.component.html'
templateUrl: './openvidu-webcomponent.component.html',
standalone: false
})
export class OpenviduWebComponentComponent {
/**

View File

@ -48,9 +48,10 @@ export enum AttributeDirective {
}
@Component({
selector: 'app-testing',
templateUrl: './testing.component.html',
styleUrls: ['./testing.component.scss']
selector: 'app-testing',
templateUrl: './testing.component.html',
styleUrls: ['./testing.component.scss'],
standalone: false
})
export class TestingComponent implements AfterViewInit {
roomName: string;

View File

@ -1,13 +1,15 @@
@use '@angular/material' as mat;
@include mat.core();
@include mat.elevation-classes();
@include mat.app-background();
// Define the theme
$openvidu-theme: mat.define-theme();
html {
// Emit theme-dependent styles for common features used across multiple components.
@include mat.core-theme($openvidu-theme);
@include mat.elevation-classes();
@include mat.app-background();
// @include mat.button-theme($theme);
@include mat.all-component-bases($openvidu-theme);
@include mat.all-component-colors($openvidu-theme);