@roomful/svelte

Svelte bindings for Roomful — Svelte-native stores and actions for real-time collaboration (presence, cursors, shared state, awareness, events, viewport sync, laser pointer, locks, comments, and history).

Stable — v1.5. Realtime presence, cursors, and shared state, plus the collaboration primitives (viewport, locks, pointer, comments, history). The API is stable and ready for production.

Install

npm install @roomful/core @roomful/svelte

Usage

<script>
  import { roomful } from '@roomful/svelte';

  const { presence, cursors, state } = roomful('my-room', {
    presence: { name: 'Alice', color: '#4F46E5' },
  });

  const [count, setCount] = state.shared('count', { initialValue: 0 });
</script>

<div use:cursors.mount>
  {#each $presence.others as user}
    <span>{user.name}</span>
  {/each}
  <button on:click={() => setCount($count + 1)}>{$count}</button>
</div>

roomful() returns { presence, cursors, state, events, awareness, status } as Svelte stores, plus the v1.5 collaboration primitives viewport, locks (with lockState(key)), pointer, comments, and history — see the reference docs. The status store exposes the current RoomStatus, and roomful() accepts onConnect, onDisconnect, and onError lifecycle callbacks.

Documentation

See the Roomful repository for the full API reference.

License

MIT