[lexical-yjs] Feature: Allow passing in custom syncCursorPositions function to collab hook

[amanharwara]

Description

We created a custom syncCursorPositions function in our app to allow for more advanced styling and behavior than what the implementation exported by @lexical/yjs allows (which requires some CSS trickery even just to customize basic styling)

However we were noticing that sometimes some of the cursors would use the styles from the Lexical impl and not ours, even though those styles didn't exist in our codebase. It turned out that the syncYjsChangesToLexical function calls the lexical implementation of syncCursorPositions, so depending on which implementation ran first, some cursors would use incorrect styles. Also, the lexical implementation removes cursors for user states which are not focusing, while ours does not. This would cause flickering of the cursors since the Lexical impl would remove them and then ours would add them back.

Currently we have used yarn patch to remove this call, but I think it makes sense to allow a custom function to be passed so that it becomes possible to have a custom implementation of collab cursors without the existing lexical implementation also running.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
lexical	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 15, 2025 9:23am
lexical-playground	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 15, 2025 9:23am

[github-actions]

size-limit report 📦

Path	Size
lexical - cjs	29.02 KB (0%)
lexical - esm	28.84 KB (0%)
@lexical/rich-text - cjs	37.97 KB (0%)
@lexical/rich-text - esm	30.9 KB (0%)
@lexical/plain-text - cjs	36.54 KB (0%)
@lexical/plain-text - esm	28.15 KB (0%)
@lexical/react - cjs	39.77 KB (0%)
@lexical/react - esm	32.26 KB (0%)

[etrepum]

Seems reasonable and straightforward