feat(crdt): Create useYjsBinding React hook

frontend/src/crdt/useYjsBinding.ts

@@ -0,0 +1,31 @@
+import { useEffect, useState } from 'react';
+import * as Y from 'yjs';
+import { YjsDocument } from './YjsDocument';
+
+export const useYjsBinding = (yjsDoc: YjsDocument) => {
+  const [doc, setDoc] = useState<Y.Doc>(yjsDoc.doc);
+  
+  useEffect(() => {
+    const handleUpdate = (update: Uint8Array, origin: any, doc: Y.Doc) => {
+      // Trigger re-render by updating state
+      setDoc({} as Y.Doc); // Force re-render
+      
+      // Update rbush index
+      updateRbushIndex(yjsDoc);
+    };
+
+    yjsDoc.doc.on('update', handleUpdate);
+    
+    return () => {
+      yjsDoc.doc.off('update', handleUpdate);
+    };
+  }, [yjsDoc]);
+
+  return doc;
+};
+
+const updateRbushIndex = (yjsDoc: YjsDocument) => {
+  // Implementation for updating rbush index with Yjs changes
+  // This would integrate with the canvas rendering system
+  console.log('Updating rbush index with Yjs changes');
+};