From c3b46d383ce33832c49a32a937116592d4c3a667 Mon Sep 17 00:00:00 2001
From: Igor Agapov <aio350@yahoo.com>
Date: Wed, 30 Apr 2025 10:24:44 +0500
Subject: [PATCH] Update live-collaboration-trigger.mdx

fix example
---
 .../children-components/live-collaboration-trigger.mdx    | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/dev-docs/docs/@excalidraw/excalidraw/api/children-components/live-collaboration-trigger.mdx b/dev-docs/docs/@excalidraw/excalidraw/api/children-components/live-collaboration-trigger.mdx
index ef74d0e65..b797b166d 100644
--- a/dev-docs/docs/@excalidraw/excalidraw/api/children-components/live-collaboration-trigger.mdx
+++ b/dev-docs/docs/@excalidraw/excalidraw/api/children-components/live-collaboration-trigger.mdx
@@ -11,7 +11,7 @@ You'll need to supply `onSelect()` to handle opening of your collaboration dialo
 
 ```tsx live
 function App() {
-  const [excalidrawAPI, setExcalidrawAPI] = useState(null);
+  const [excalidrawAPI, setExcalidrawAPI] = useState<ExcalidrawImperativeAPI>();
   const [isCollaborating, setIsCollaborating] = useState(false);
   return (
     <div style={{ height: "500px" }}>
@@ -33,9 +33,9 @@ function App() {
                 username: "Pika",
                 avatarUrl: "../../../../img/pika.jpeg",
               });
-              excalidrawAPI.updateScene({ collaborators });
+              excalidrawAPI?.updateScene({ collaborators });
             } else {
-              excalidrawAPI.updateScene({
+              excalidrawAPI?.updateScene({
                 collaborators: new Map(),
               });
             }
@@ -45,7 +45,7 @@ function App() {
         Show Collaborators
       </label>
       <Excalidraw
-        ref={(api) => setExcalidrawAPI(api)}
+        excalidrawAPI={(api) => setExcalidrawAPI(api)}
         renderTopRightUI={() => (
           <LiveCollaborationTrigger
             isCollaborating={isCollaborating}