From 4b1ea0d60381bb77991ba5182af45a781319c39a Mon Sep 17 00:00:00 2001
From: zbeyens <zbeyens@udecode.dev>
Date: Fri, 29 Nov 2024 00:07:48 +0100
Subject: [PATCH] docs

---
 apps/www/content/docs/cursor-overlay.mdx | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/apps/www/content/docs/cursor-overlay.mdx b/apps/www/content/docs/cursor-overlay.mdx
index 0679945d72..55d4f26cba 100644
--- a/apps/www/content/docs/cursor-overlay.mdx
+++ b/apps/www/content/docs/cursor-overlay.mdx
@@ -45,6 +45,21 @@ const plugins = [
 ];
 ```
 
+### Editor Container
+
+The editor requires a container component above `PlateContent` to ensure correct cursor overlay positioning:
+
+```tsx
+export const EditorContainer = (props: React.HTMLAttributes<HTMLDivElement>) => {
+  const editor = useEditorRef();
+  const containerRef = useEditorContainerRef();
+
+  return <div id={editor.uid} ref={containerRef} {...props} />;
+};
+```
+
+This component is available in [Editor](/docs/components/editor).
+
 ### Preserving Selection Focus
 
 To maintain the editor's selection state when focusing UI elements, add the `data-plate-focus="true"` attribute to those elements: