@slate-sheikah/bridge
Version:
slate-sheikah bridge: Bridge components for slate-sheikah. Slate + Automerge + Sockets
99 lines (79 loc) • 3.36 kB
Markdown
# slate-sheikah.
slatejs collaborative plugin & microservice
Forked from ([slate-collaborative](https://github.com/cudr/slate-collaborative) and modified for speed and stability.
## [demo](https://slate-sheikah.herokuapp.com/)

# API
## Client
Use it as a simple slatejs plugin
```ts
import { withIOCollaboration } from '@slate-sheikah/client'
const collaborationEditor = withIOCollaboration(editor, options)
```
Check [detailed example](https://github.com/docket-hq/slate-sheikah/blob/master/packages/example/src/Client.tsx)
### Options:
```ts
{
docId?: // document id
url?: string // url to open connection
connectOpts?: SocketIOClient.ConnectOpts // socket.io-client options
cursorData?: any // any data passed to cursor
presenceData?: Object //any object data that represents a participant in the meeting. This will get echoed back through the onParticipantChange when people join and leave the document.
onConnect?: () => void // connect callback
onDisconnect?: () => void // disconnect callback
onError?: (reason: string) => void // error callback
preserveExternalHistory?: boolean // preserve slate-history operations form other clients
onDocumentLoaded(id)?: => void // callback that runs once a document is loaded on the client, takes internal id of document (can be used to tell if the document you have in memory matches the one on the server)
onParticipantChange = (msg: Object) => void // callback called when the participants change. message contains an array of participants as defined in presenceData
}
```
You need to attach the useCursor decorator to provide custom cursor data in renderLeaf function
```ts
import { useCursor } from '@slate-sheikah/client'
const decorator = useCursor(editor)
```
## Backend
```ts
const { SocketIOConnection } = require('@slate-sheikah/backend')
const connection = new SocketIOConnection(options)
```
### options:
```ts
{
entry: Server // or specify port to start io server
defaultValue: Node[] // default value
saveFrequency: number // frequency of onDocumentSave callback execution in ms
cleanFrequency: number // frequency of cleaner runs in ms, defaults to 60000 (1 minute)
cleanThreshold: number // how long after all the connections have closed before allowing memory recovery in minutes defaults, to 30 minutes
onAuthRequest: ( // auth callback
query: Object,
socket?: SocketIO.Socket
) => Promise<boolean> | boolean
onDocumentLoad: ( // request slate document callback
pathname: string,
query?: Object
) => Promise<Node[]> | Node[]
onDocumentSave: (pathname: string, doc: Node[]) => Promise<void> | void // save document callback
onSocketConnection?: ({
docId: string,
socket: SocketIO.Socket,
_this: SocketIOConnection
}) => void // socket connection callback
onSocketDisconnection?: ({
docId: string,
socket: SocketIO.Socket,
_this: SocketIOConnection
}) => void // socket disconnection callback
}
```
# Contribute
You welcome to contribute!
start it ease:
```
yarn
yarn dev
```
# Credits
[cudr](https://github.com/cudr)
[slate-collaborative](https://github.com/cudr/slate-collaborative)
[slate-automerge](https://github.com/humandx/slate-automerge)