@treyorr/voca-svelte 0.1.0

package/README.md

@@ -0,0 +1,66 @@
+# @treyorr/voca-svelte
+
+Svelte 5 Runes wrapper for Voca WebRTC voice chat.
+
+## Installation
+
+```bash
+npm install @treyorr/voca-svelte
+```
+
+## Quick Start
+
+### Create a Room
+```typescript
+import { VocaClient } from '@treyorr/voca-client';
+
+async function createRoom() {
+  const client = await VocaClient.createRoom();
+  goto(`/room/${client.roomId}`);
+}
+```
+
+### Join a Room
+```svelte
+<script lang="ts">
+  import { VocaRoom } from '@treyorr/voca-svelte';
+
+  const room = new VocaRoom('my-room');
+  
+  $effect(() => {
+    room.connect();
+    return () => room.disconnect();
+  });
+</script>
+
+<p>Status: {room.status}</p>
+<p>Peers: {room.peers.size}</p>
+
+<button onclick={() => room.toggleMute()}>
+  {room.isMuted ? 'Unmute' : 'Mute'}
+</button>
+```
+
+## API
+
+### `new VocaRoom(roomId, config?)`
+
+Creates a reactive room instance with Svelte 5 runes.
+
+### Reactive Properties
+
+- `room.status` - Connection status
+- `room.peers` - Map of connected peers
+- `room.isMuted` - Mute state
+- `room.localAudioLevel` - Local audio level (0-1)
+- `room.localStream` - Local MediaStream
+
+### Methods
+
+- `room.connect()` - Connect to room
+- `room.disconnect()` - Disconnect from room
+- `room.toggleMute()` - Toggle mute
+
+## License
+
+MIT

package/dist/index.svelte.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Voca WebRTC State Manager
+ *
+ * Svelte 5 runes-based wrapper around @treyorr/voca-client SDK.
+ */
+import { VocaClient, type ConnectionStatus, type Peer, type VocaConfig } from '@treyorr/voca-client';
+export { VocaClient };
+export type { ConnectionStatus, Peer, VocaConfig };
+export declare class VocaRoom {
+    peers: Map<string, Peer>;
+    localStream: MediaStream | null;
+    isMuted: boolean;
+    isConnected: boolean;
+    error: string | null;
+    localAudioLevel: number;
+    status: ConnectionStatus;
+    errorCode: string | null;
+    roomCapacity: number;
+    peerCount: number;
+    private client;
+    constructor(roomId: string, config?: VocaConfig);
+    private setupListeners;
+    private updatePeers;
+    connect(): Promise<void>;
+    disconnect(): void;
+    toggleMute(): void;
+    getPulseStyle(level: number): string;
+    getStatusLabel(): string;
+}

package/dist/index.svelte.js

@@ -0,0 +1,83 @@
+/**
+ * Voca WebRTC State Manager
+ *
+ * Svelte 5 runes-based wrapper around @treyorr/voca-client SDK.
+ */
+import { VocaClient } from '@treyorr/voca-client';
+export { VocaClient };
+export class VocaRoom {
+    constructor(roomId, config = {}) {
+        // Reactive state
+        this.peers = $state(new Map());
+        this.localStream = $state(null);
+        this.isMuted = $state(false);
+        this.isConnected = $state(false);
+        this.error = $state(null);
+        this.localAudioLevel = $state(0);
+        this.status = $state('connecting');
+        this.errorCode = $state(null);
+        this.roomCapacity = $state(6);
+        this.peerCount = $state(1); // Start at 1 (self)
+        this.client = new VocaClient(roomId, config);
+        this.setupListeners();
+    }
+    setupListeners() {
+        this.client.on('status', (s) => {
+            this.status = s;
+            this.isConnected = s === 'connected';
+        });
+        this.client.on('error', (e) => {
+            this.errorCode = e.code;
+            this.error = e.message;
+        });
+        this.client.on('peer-joined', () => this.updatePeers());
+        this.client.on('peer-left', () => this.updatePeers());
+        this.client.on('track', () => this.updatePeers()); // Updates stream references
+        this.client.on('peer-audio-level', (id, level) => {
+            // Trigger reactivity by creating a new Map reference
+            // The underlying peer objects are mutation in the SDK, so we just need to let Svelte know something changed
+            // Optimization: In a real app we might want granular reactivity per peer, but this matches original behavior
+            this.peers = new Map(this.client.peers);
+        });
+        this.client.on('local-audio-level', (level) => {
+            this.localAudioLevel = level;
+        });
+    }
+    updatePeers() {
+        this.peers = new Map(this.client.peers);
+        this.peerCount = this.peers.size + 1;
+    }
+    async connect() {
+        try {
+            await this.client.connect();
+            this.localStream = this.client.localStream;
+        }
+        catch (err) {
+            // Error handling is done via events mostly, but connect() throws
+            console.error('Connection failed', err);
+        }
+    }
+    disconnect() {
+        this.client.disconnect();
+        this.peers = new Map();
+        this.localStream = null;
+        this.isConnected = false;
+    }
+    toggleMute() {
+        this.isMuted = this.client.toggleMute();
+    }
+    getPulseStyle(level) {
+        return `--pulse: ${1 + Math.round(level * 7)}px`;
+    }
+    getStatusLabel() {
+        const labels = {
+            connecting: 'CONNECTING...',
+            connected: 'CONNECTED',
+            reconnecting: 'RECONNECTING...',
+            full: 'ROOM FULL',
+            error: 'ERROR',
+            disconnected: 'DISCONNECTED'
+        };
+        return labels[this.status] ?? 'UNKNOWN';
+    }
+}

package/package.json

@@ -0,0 +1,48 @@
+{
+    "name": "@treyorr/voca-svelte",
+    "version": "0.1.0",
+    "description": "Svelte 5 Runes wrapper for Voca Client SDK",
+    "svelte": "./dist/index.svelte.js",
+    "types": "./dist/index.svelte.d.ts",
+    "exports": {
+        ".": {
+            "types": "./dist/index.svelte.d.ts",
+            "svelte": "./dist/index.svelte.js",
+            "default": "./dist/index.svelte.js"
+        }
+    },
+    "files": [
+        "dist",
+        "!dist/**/*.test.*",
+        "!dist/**/*.spec.*"
+    ],
+    "scripts": {
+        "check": "svelte-check --tsconfig ./tsconfig.json",
+        "build": "svelte-package -i src/lib",
+        "prepublishOnly": "npm run build"
+    },
+    "peerDependencies": {
+        "svelte": "^5.0.0"
+    },
+    "author": "Trey Orr",
+    "license": "MIT",
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/treyorr/voca.git",
+        "directory": "packages/voca-svelte"
+    },
+    "homepage": "https://voca.vc",
+    "bugs": "https://github.com/treyorr/voca/issues",
+    "publishConfig": {
+        "access": "public"
+    },
+    "dependencies": {
+        "@treyorr/voca-client": "*"
+    },
+    "devDependencies": {
+        "@sveltejs/package": "^2.3.7",
+        "typescript": "^5.9.3",
+        "svelte": "^5.46.1",
+        "svelte-check": "^4.3.5"
+    }
+}