0.0.2

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@svelte-toolkit/jitsi",
-	"version": "0.0.1",
+	"version": "0.0.2",
 	"repository": {
 		"type": "git",
 		"url": "https://gitea.auvem.com/svelte-toolkit/jitsi.git"

src/lib/Jitsi.svelte

@@ -1,6 +1,10 @@
 <script lang="ts">
 	import { onMount } from 'svelte';
-	import { type JitsiMeetExternalAPIOptions, JitsiMeetExternalAPI } from './jitsi-iframe-api.js';
+	import type {
+		JitsiMeetExternalAPIOptions,
+		JitsiMeetExternalAPI
+	} from '$lib/jitsi-iframe-api.d.ts';
+	import type { ClassValue } from 'svelte/elements';
 
 	interface Props {
 		/**
@@ -13,9 +17,13 @@
 		 * The options to be passed to the Jitsi Meet External API.
 		 */
 		options: JitsiMeetExternalAPIOptions;
+		/**
+		 * Additional CSS classes to apply to the Jitsi container.
+		 */
+		class?: ClassValue;
 	}
 
-	let { domain = 'https://meet.jit.si', options }: Props = $props();
+	let { domain = 'https://meet.jit.si', options, class: classValue }: Props = $props();
 
 	const src = $derived(`${new URL('external_api.js', domain).toString()}`);
 
@@ -29,7 +37,7 @@
 		}
 
 		// Initialize the Jitsi Meet External API
-		api = new JitsiMeetExternalAPI(new URL(domain).host, {
+		api = new window.JitsiMeetExternalAPI(new URL(domain).host, {
 			...options,
 			parentNode: container
 		});
@@ -48,4 +56,4 @@
 	<script {src}></script>
 </svelte:head>
 
-<div id="jitsi-container" bind:this={container}></div>
+<div id="jitsi-container" bind:this={container} class={[classValue]}></div>