@yorkie-js/sdk 0.6.38 → 0.6.39

package/dist/quill.html

@@ -246,6 +246,9 @@
             });
 
             // 03. create an instance of Quill
+            // Track composition state to prevent selection updates during IME input
+            let isComposing = false;
+
             const editorElem = clientElem?.getElementsByClassName('editor')[0];
             Quill.register('modules/cursors', QuillCursors);
             const quill = new Quill(editorElem, {
@@ -292,6 +295,14 @@
             }
 
             // 04. bind the document with the Quill.
+            // Track composition events to prevent selection updates during IME input
+            quill.root.addEventListener('compositionstart', () => {
+              isComposing = true;
+            });
+            quill.root.addEventListener('compositionend', () => {
+              isComposing = false;
+            });
+
             // 04-1. Quill to Document.
             quill
               .on('text-change', (delta, _, source) => {
@@ -354,6 +365,7 @@
                           (typeof op.insert === 'string'
                             ? op.insert.length
                             : 1);
+                        to = from;
                       }
 
                       if (range) {
@@ -380,7 +392,7 @@
                       op.retain !== undefined &&
                       typeof op.retain === 'number'
                     ) {
-                      from = to + op.retain;
+                      from += op.retain;
                       to = from;
                     }
                   }
@@ -391,6 +403,12 @@
                   return;
                 }
 
+                // Ignore selection changes during composition (e.g., Korean IME input)
+                // to prevent cursor position from being broadcast incorrectly to other users
+                if (isComposing) {
+                  return;
+                }
+
                 // NOTE(chacha912): If the selection in the Quill editor does not match the range computed by yorkie,
                 // additional updates are necessary. This condition addresses situations where Quill's selection behaves
                 // differently, such as when inserting text before a range selection made by another user, causing
@@ -420,15 +438,10 @@
 
             // 04-2. document to Quill(remote).
             function handleOperations(quill, ops) {
-              const deltaOperations = [];
-              let prevTo = 0;
               for (const op of ops) {
                 if (op.type === 'edit') {
                   const from = op.from;
                   const to = op.to;
-                  const retainFrom = from - prevTo;
-                  const retainTo = to - from;
-
                   const { insert, attributes } = toDeltaOperation(
                     op.value,
                     true,
@@ -438,14 +451,17 @@
                     'color: skyblue',
                   );
 
-                  if (retainFrom) {
-                    deltaOperations.push({ retain: retainFrom });
+                  const deltaOperations = [];
+
+                  if (from > 0) {
+                    deltaOperations.push({ retain: from });
                   }
-                  if (retainTo) {
-                    deltaOperations.push({ delete: retainTo });
+
+                  const deleteLength = to - from;
+                  if (deleteLength > 0) {
+                    deltaOperations.push({ delete: deleteLength });
                   }
-                  const insertLength =
-                    typeof insert === 'string' ? insert.length : 0;
+
                   if (insert) {
                     const op = { insert };
                     if (attributes) {
@@ -453,43 +469,47 @@
                     }
                     deltaOperations.push(op);
                   }
-                  // Update prevTo considering the actual text change:
-                  // from + length of inserted text (delete is already handled by retainTo)
-                  prevTo = from + insertLength;
+
+                  if (deltaOperations.length > 0) {
+                    console.log(
+                      `%c to quill: ${JSON.stringify(deltaOperations)}`,
+                      'color: green',
+                    );
+                    const delta = new Quill.imports.delta(deltaOperations);
+                    quill.updateContents(delta, 'api');
+                  }
                 } else if (op.type === 'style') {
                   const from = op.from;
                   const to = op.to;
-                  const retainFrom = from - prevTo;
-                  const retainTo = to - from;
                   const { attributes } = toDeltaOperation(op.value, false);
                   console.log(
                     `%c remote: ${from}-${to}: ${JSON.stringify(attributes)}`,
                     'color: skyblue',
                   );
 
-                  if (retainFrom) {
-                    deltaOperations.push({ retain: retainFrom });
-                  }
                   if (attributes) {
-                    const op = { attributes };
-                    if (retainTo) {
-                      op.retain = retainTo;
+                    const deltaOperations = [];
+
+                    if (from > 0) {
+                      deltaOperations.push({ retain: from });
                     }
 
+                    const op = { attributes };
+                    const retainLength = to - from;
+                    if (retainLength > 0) {
+                      op.retain = retainLength;
+                    }
                     deltaOperations.push(op);
+
+                    console.log(
+                      `%c to quill: ${JSON.stringify(deltaOperations)}`,
+                      'color: green',
+                    );
+                    const delta = new Quill.imports.delta(deltaOperations);
+                    quill.updateContents(delta, 'api');
                   }
-                  prevTo = to;
                 }
               }
-
-              if (deltaOperations.length) {
-                console.log(
-                  `%c to quill: ${JSON.stringify(deltaOperations)}`,
-                  'color: green',
-                );
-                const delta = new Quill.imports.delta(deltaOperations);
-                quill.updateContents(delta, 'api');
-              }
             }
 
             // 05. synchronize text of document and Quill.

package/dist/yorkie-js-sdk.es.js

@@ -22272,7 +22272,7 @@ function createAuthInterceptor(apiKey, token) {
   };
 }
 const name = "@yorkie-js/sdk";
-const version = "0.6.38";
+const version = "0.6.39";
 const pkg = {
   name,
   version

package/dist/yorkie-js-sdk.js

@@ -22276,7 +22276,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
     };
   }
   const name = "@yorkie-js/sdk";
-  const version = "0.6.38";
+  const version = "0.6.39";
   const pkg = {
     name,
     version

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yorkie-js/sdk",
-  "version": "0.6.38",
+  "version": "0.6.39",
   "description": "Yorkie JS SDK",
   "main": "./dist/yorkie-js-sdk.js",
   "publishConfig": {
@@ -56,7 +56,7 @@
     "@connectrpc/connect": "^1.4.0",
     "@connectrpc/connect-web": "^1.4.0",
     "long": "^5.2.0",
-    "@yorkie-js/schema": "0.6.38"
+    "@yorkie-js/schema": "0.6.39"
   },
   "scripts": {
     "build": "tsc && vite build -c vite.build.ts",