1
0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-08-11 01:33:58 +02:00

Add docs for with-react

This commit is contained in:
Sunny Hirai
2023-04-12 22:01:59 -07:00
parent cf5563a74d
commit 92b03170f7
3 changed files with 20 additions and 0 deletions

View File

@@ -54,6 +54,7 @@
## Libraries
- [Slate React](libraries/slate-react/README.md)
- [withReact](libraries/slate-react/with-react.md)
- [Slate History](libraries/slate-history/README.md)
- [withHistory](/libraries/slate-history/with-history.md)
- [HistoryEditor](/libraries/slate-history/history-editor.md)

View File

@@ -2,6 +2,8 @@
This sub-library contains the React-specific logic for Slate.
- [withReact](./with-react.md)
## Components
React components for rendering Slate editors

View File

@@ -0,0 +1,17 @@
# withReact
The `withReact` plugin enables Slate to work in a React environment. Currently, React is the only first class implementation of Slate available.
### `withReact<T extends Editor>(editor: T, clipboardFormatKey = 'x-slate-fragment'): T & ReactEditor`
Add `ReactEditor` to an instance of any `Editor`.
The `clipboardFormatKey` option allows you to customize the `DataTransfer` type when Slate data is copied to the clipboard. By default, it is `application/x-slate-fragment` but it can be customized using this option.
This can be useful when a user copies from one Slate editor to a differently configured Slate editor. This could cause nodes to be inserted which are not correctly typed for the receiving editor, corrupting the document. By customizing the `clipboardFormatKey` one can ensure that the raw JSON data isn't cpied between editors with different schemas.
Example with `withHistory`:
```typescript
const [editor] = useState(() => withReact(withHistory(createEditor())))
```