Components
Cursor Overlay

Cursor Overlay

A visual overlay for collaborative cursors and selections.

Installation

Install the following dependencies:

npm install @udecode/plate-dnd @udecode/plate-selection

Copy and paste the following code into your project.

Get the code ->

Update the import paths to match your project setup.

Examples

AI

Get the code ->

AI Menu

Generate and refine content with AI.
Access the AI menu in many ways:
  1. Press "⌘ + J".
  1. Select text and click "Ask AI" in the floating toolbar
  1. Click ⋮⋮ or right-click a block and select "Ask AI"
  1. Type "/ai"
  1. Press space in an empty block. Try it out:
  • 
Once opened, you can:
  • Type a prompt or use preset commands
  • Use arrow keys to navigate, Enter to select
Generating commands:
  • Continue writing
  • Add a summary
  • Explain
Generating suggestions:
  • Accept
  • Discard
  • Try again
Editing commands:
  • Improve writing
  • Make it longer or shorter
  • Fix spelling & grammar
  • Simplify language
  • Translate
Editing suggestions:
  • Replace the selection
  • Insert below
  • Discard
  • Try again
The AI chat keeps a history of the conversation until you accept or discard the changes. Clicking outside or pressing Escape resets the chat.
Comments PopoverDraggable