@lexical/yjs
Advanced tools
@lexical/yjs is an npm package that integrates Lexical, a text editor framework, with Yjs, a real-time collaboration framework. This package allows developers to create collaborative text editing experiences where multiple users can edit the same document simultaneously with real-time updates.
Real-time Collaboration
This feature allows multiple users to collaborate on the same document in real-time. The code sample demonstrates how to set up a Lexical editor with Yjs WebSocket provider to enable real-time collaboration.
const { createEditor } = require('lexical');
const { WebsocketProvider } = require('y-websocket');
const { yjsPlugin } = require('@lexical/yjs');
const editor = createEditor();
const provider = new WebsocketProvider('wss://demos.yjs.dev', 'my-roomname', editor);
editor.registerPlugin(yjsPlugin(provider));Conflict Resolution
This feature ensures that any conflicts that arise during real-time collaboration are automatically resolved. The code sample shows how to listen for the 'synced' event to confirm that all conflicts have been resolved.
const { createEditor } = require('lexical');
const { WebsocketProvider } = require('y-websocket');
const { yjsPlugin } = require('@lexical/yjs');
const editor = createEditor();
const provider = new WebsocketProvider('wss://demos.yjs.dev', 'my-roomname', editor);
editor.registerPlugin(yjsPlugin(provider));
provider.on('synced', (isSynced) => {
if (isSynced) {
console.log('All conflicts have been resolved.');
}
});Offline Editing
This feature allows users to continue editing the document even when they are offline. The code sample demonstrates how to set up IndexedDB persistence to enable offline editing.
const { createEditor } = require('lexical');
const { IndexeddbPersistence } = require('y-indexeddb');
const { yjsPlugin } = require('@lexical/yjs');
const editor = createEditor();
const persistence = new IndexeddbPersistence('my-database', editor);
editor.registerPlugin(yjsPlugin(persistence));slate-yjs integrates Slate, another text editor framework, with Yjs for real-time collaboration. Similar to @lexical/yjs, it allows multiple users to edit the same document simultaneously. However, it is designed specifically for use with the Slate editor.
@lexical/yjs
This package provides a set of bindings for Y.js that allow for collaborative editing with Lexical.
v0.17.1 (2024-08-26)
FAQs
The library provides Yjs editor bindings for Lexical.
We found that @lexical/yjs demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
At its inaugural meeting, the JSR Working Group outlined plans for an open governance model and a roadmap to enhance JavaScript package management.
Security News
Research
An advanced npm supply chain attack is leveraging Ethereum smart contracts for decentralized, persistent malware control, evading traditional defenses.
Security News
Research
Attackers are impersonating Sindre Sorhus on npm with a fake 'chalk-node' package containing a malicious backdoor to compromise developers' projects.