@yorkie-js/sdk 0.6.6 → 0.6.7

package/dist/counter.html

@@ -37,7 +37,9 @@
       async function main() {
         try {
           // 01. create client with RPCAddr then activate it.
-          const client = new yorkie.Client('http://localhost:8080');
+          const client = new yorkie.Client({
+            rpcAddr: 'http://localhost:8080',
+          });
           await client.activate();
 
           // 02. create a document then attach it into the client.

package/dist/drawing.html

@@ -38,7 +38,8 @@
       async function main() {
         try {
           // 01. create client with RPCAddr then activate it.
-          const client = new yorkie.Client('http://localhost:8080', {
+          const client = new yorkie.Client({
+            rpcAddr: 'http://localhost:8080',
             syncLoopDuration: 0,
             reconnectStreamDelay: 1000,
           });

package/dist/index.html

@@ -320,7 +320,9 @@
           devtool.setCodeMirror(codemirror);
 
           // 02-1. create client with RPCAddr.
-          const client = new yorkie.Client('http://localhost:8080');
+          const client = new yorkie.Client({
+            rpcAddr: 'http://localhost:8080',
+          });
           // 02-2. activate client
           await client.activate();
 

package/dist/multi.html

@@ -79,7 +79,9 @@
       async function main() {
         try {
           // 01-1. create client with RPCAddr.
-          const client = new yorkie.Client('http://localhost:8080');
+          const client = new yorkie.Client({
+            rpcAddr: 'http://localhost:8080',
+          });
           // 01-2. activate client
           await client.activate();
 

package/dist/prosemirror.html

@@ -252,7 +252,7 @@
        * main is the entry point of the example.
        */
       async function main() {
-        const client = new yorkie.Client('http://localhost:8080');
+        const client = new yorkie.Client({ rpcAddr: 'http://localhost:8080' });
         await client.activate();
 
         // 01. Build yorkie.Text from ProseMirror doc.

package/dist/quill-two-clients.html

@@ -142,7 +142,9 @@
         try {
           async function initializeRealtimeEditor(clientElem) {
             // 01. create client with RPCAddr(envoy) then activate it.
-            const client = new yorkie.Client('http://localhost:8080');
+            const client = new yorkie.Client({
+              rpcAddr: 'http://localhost:8080',
+            });
             await client.activate();
             const clientID = client.getID().slice(-2);
             clientElem.querySelector('.client-id').textContent = clientID;
@@ -484,9 +486,6 @@
 
             syncText(doc, quill);
             updateAllCursors();
-            window.addEventListener('beforeunload', async () => {
-              await client.deactivate({ keepalive: true });
-            });
 
             return { client, doc, quill };
           }

package/dist/quill.html

@@ -64,7 +64,9 @@
       async function main() {
         try {
           // 01. create client with RPCAddr then activate it.
-          const client = new yorkie.Client('http://localhost:8080');
+          const client = new yorkie.Client({
+            rpcAddr: 'http://localhost:8080',
+          });
           await client.activate();
 
           // 02. create a document then attach it into the client.

package/dist/whiteboard.html

@@ -254,7 +254,9 @@
       async function main() {
         try {
           // 01. create client with RPCAddr then activate it.
-          const client = new yorkie.Client('http://localhost:8080');
+          const client = new yorkie.Client({
+            rpcAddr: 'http://localhost:8080',
+          });
           await client.activate();
           const myClientID = client.getID();
 

package/dist/yorkie-js-sdk.d.ts

@@ -53,6 +53,26 @@ export declare type ArrayOperationInfo = AddOpInfo | RemoveOpInfo | MoveOpInfo;
  */
 declare type ArrayOperationInfo_2 = AddOpInfo_2 | RemoveOpInfo_2 | MoveOpInfo_2;
 
+/**
+ * `AttachOptions` are user-settable options used when attaching documents.
+ */
+declare interface AttachOptions<R, P> {
+    /**
+     * `initialRoot` is the initial root of the document. It is used to
+     * initialize the document. It is used when the fields are not set in the
+     * document.
+     */
+    initialRoot?: R;
+    /**
+     * `initialPresence` is the initial presence of the client.
+     */
+    initialPresence?: P;
+    /**
+     * `syncMode` defines the synchronization mode of the document.
+     */
+    syncMode?: SyncMode;
+}
+
 declare interface AuthErrorEvent extends BaseDocEvent {
     type: DocEventType_2.AuthError;
     value: {
@@ -710,7 +730,7 @@ export declare class Client {
      * @param rpcAddr - the address of the RPC server.
      * @param opts - the options of the client.
      */
-    constructor(rpcAddr: string, opts?: ClientOptions);
+    constructor(opts?: ClientOptions);
     /**
      * `activate` activates this client. That is, it registers itself to the server
      * and receives a unique ID from the server. The given ID is used to
@@ -738,11 +758,7 @@ export declare class Client {
      * `attach` attaches the given document to this client. It tells the server that
      * this client will synchronize the given document.
      */
-    attach<T, P extends Indexable>(doc: Document_2<T, P>, options?: {
-        initialRoot?: T;
-        initialPresence?: P;
-        syncMode?: SyncMode;
-    }): Promise<Document_2<T, P>>;
+    attach<R, P extends Indexable>(doc: Document_2<R, P>, opts?: AttachOptions<R, P>): Promise<Document_2<R, P>>;
     /**
      * `detach` detaches the given document from this client. It tells the
      * server that this client will no longer synchronize the given document.
@@ -751,24 +767,24 @@ export declare class Client {
      * the changes should be applied to other replicas before GC time. For this,
      * if the document is no longer used by this client, it should be detached.
      */
-    detach<T, P extends Indexable>(doc: Document_2<T, P>, options?: {
+    detach<R, P extends Indexable>(doc: Document_2<R, P>, opts?: {
         removeIfNotAttached?: boolean;
         keepalive?: boolean;
-    }): Promise<Document_2<T, P>>;
+    }): Promise<Document_2<R, P>>;
     /**
      * `changeRealtimeSync` changes the synchronization mode of the given document.
      */
-    changeSyncMode<T, P extends Indexable>(doc: Document_2<T, P>, syncMode: SyncMode): Promise<Document_2<T, P>>;
+    changeSyncMode<R, P extends Indexable>(doc: Document_2<R, P>, syncMode: SyncMode): Promise<Document_2<R, P>>;
     /**
      * `sync` pushes local changes of the attached documents to the server and
      * receives changes of the remote replica from the server then apply them to
      * local documents.
      */
-    sync<T, P extends Indexable>(doc?: Document_2<T, P>): Promise<Array<Document_2<T, P>>>;
+    sync<R, P extends Indexable>(doc?: Document_2<R, P>): Promise<Array<Document_2<R, P>>>;
     /**
      * `remove` removes the given document.
      */
-    remove<T, P extends Indexable>(doc: Document_2<T, P>): Promise<void>;
+    remove<R, P extends Indexable>(doc: Document_2<R, P>): Promise<void>;
     /**
      * `getID` returns a ActorID of client.
      */
@@ -851,6 +867,11 @@ export declare enum ClientCondition {
  * @public
  */
 export declare interface ClientOptions {
+    /**
+     * `rpcAddr` is the address of the RPC server. It is used to connect to
+     * the server.
+     */
+    rpcAddr?: string;
     /**
      * `key` is the client key. It is used to identify the client.
      * If not set, a random key is generated.
@@ -890,6 +911,11 @@ export declare interface ClientOptions {
      * default value is `1000`(ms).
      */
     reconnectStreamDelay?: number;
+    /**
+     * `userAgent` is the user agent of the client. It is used to identify the
+     * client.
+     */
+    userAgent?: string;
 }
 
 /**
@@ -2203,7 +2229,7 @@ declare enum DocSyncStatus_2 {
  *
  * @public
  */
-declare class Document_2<T, P extends Indexable = Indexable> {
+declare class Document_2<R, P extends Indexable = Indexable> {
     private key;
     private status;
     private opts;
@@ -2244,7 +2270,7 @@ declare class Document_2<T, P extends Indexable = Indexable> {
     /**
      * `update` executes the given updater to update this document.
      */
-    update(updater: (root: JSONObject<T>, presence: Presence<P>) => void, message?: string): void;
+    update(updater: (root: JSONObject<R>, presence: Presence<P>) => void, message?: string): void;
     /**
      * `subscribe` registers a callback to subscribe to events on the document.
      * The callback will be called when the document is changed.
@@ -2286,7 +2312,7 @@ declare class Document_2<T, P extends Indexable = Indexable> {
      * `subscribe` registers a callback to subscribe to events on the document.
      * The callback will be called when the targetPath or any of its nested values change.
      */
-    subscribe<TPath extends PathOf<T>, TOperationInfo extends OperationInfoOf<T, TPath>>(targetPath: TPath, next: NextFn<LocalChangeEvent<TOperationInfo, P> | RemoteChangeEvent<TOperationInfo, P>>, error?: ErrorFn, complete?: CompleteFn): Unsubscribe;
+    subscribe<TPath extends PathOf<R>, TOperationInfo extends OperationInfoOf<R, TPath>>(targetPath: TPath, next: NextFn<LocalChangeEvent<TOperationInfo, P> | RemoteChangeEvent<TOperationInfo, P>>, error?: ErrorFn, complete?: CompleteFn): Unsubscribe;
     /**
      * `subscribe` registers a callback to subscribe to events on the document.
      * The callback will be called when the broadcast event is received from the remote client.
@@ -2345,7 +2371,7 @@ declare class Document_2<T, P extends Indexable = Indexable> {
     /**
      * `getRoot` returns a new proxy of cloned root.
      */
-    getRoot(): JSONObject<T>;
+    getRoot(): JSONObject<R>;
     /* Excluded from this release type: garbageCollect */
     /* Excluded from this release type: getRootObject */
     /* Excluded from this release type: getGarbageLen */

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

@@ -3672,9 +3672,6 @@ function createClient(service, transport) {
     }
   });
 }
-function createPromiseClient(service, transport) {
-  return createClient(service, transport);
-}
 function createUnaryFn(transport, service, method) {
   return async function(input, options) {
     var _a2, _b2;
@@ -20215,14 +20212,18 @@ function createAuthInterceptor(apiKey, token) {
   };
 }
 const name = "@yorkie-js/sdk";
-const version = "0.6.6";
+const version = "0.6.7";
 const pkg = {
   name,
   version
 };
-function createMetricInterceptor() {
+function createMetricInterceptor(userAgent) {
   return (next) => async (req) => {
-    req.header.set("x-yorkie-user-agent", pkg.name + "/" + pkg.version);
+    if (userAgent) {
+      req.header.set("x-yorkie-user-agent", userAgent);
+    } else {
+      req.header.set("x-yorkie-user-agent", pkg.name + "/" + pkg.version);
+    }
     return await next(req);
   };
 }
@@ -20255,6 +20256,7 @@ var ClientCondition = /* @__PURE__ */ ((ClientCondition2) => {
   return ClientCondition2;
 })(ClientCondition || {});
 const DefaultClientOptions = {
+  rpcAddr: "https://api.yorkie.dev",
   syncLoopDuration: 50,
   retrySyncLoopDelay: 1e3,
   reconnectStreamDelay: 1e3
@@ -20269,7 +20271,7 @@ class Client {
    * @param rpcAddr - the address of the RPC server.
    * @param opts - the options of the client.
    */
-  constructor(rpcAddr, opts) {
+  constructor(opts) {
     __publicField(this, "id");
     __publicField(this, "key");
     __publicField(this, "metadata");
@@ -20287,7 +20289,8 @@ class Client {
     __publicField(this, "processing", false);
     __publicField(this, "keepalive", false);
     opts = opts || DefaultClientOptions;
-    this.key = opts.key ? opts.key : uuid();
+    const rpcAddr = opts.rpcAddr || DefaultClientOptions.rpcAddr;
+    this.key = opts.key || uuid();
     this.metadata = opts.metadata || {};
     this.status = "deactivated";
     this.attachmentMap = /* @__PURE__ */ new Map();
@@ -20308,11 +20311,14 @@ class Client {
     this.retrySyncLoopDelay = opts.retrySyncLoopDelay ?? DefaultClientOptions.retrySyncLoopDelay;
     const { authInterceptor, setToken } = createAuthInterceptor(this.apiKey);
     this.setAuthToken = setToken;
-    this.rpcClient = createPromiseClient(
+    this.rpcClient = createClient(
       YorkieService,
       createGrpcWebTransport({
         baseUrl: rpcAddr,
-        interceptors: [authInterceptor, createMetricInterceptor()],
+        interceptors: [
+          authInterceptor,
+          createMetricInterceptor(opts == null ? void 0 : opts.userAgent)
+        ],
         fetch: (input, init) => {
           const newInit = {
             ...init,
@@ -20338,22 +20344,28 @@ class Client {
       this.setAuthToken(token);
     }
     return this.enqueueTask(async () => {
-      return this.rpcClient.activateClient(
-        {
-          clientKey: this.key,
-          metadata: this.metadata
-        },
-        { headers: { "x-shard-key": this.apiKey } }
-      ).then((res) => {
+      try {
+        const res = await this.rpcClient.activateClient(
+          {
+            clientKey: this.key,
+            metadata: this.metadata
+          },
+          { headers: { "x-shard-key": this.apiKey } }
+        );
         this.id = res.clientId;
         this.status = "activated";
         this.runSyncLoop();
         logger.info(`[AC] c:"${this.getKey()}" activated, id:"${this.id}"`);
-      }).catch(async (err) => {
+        if (typeof window !== "undefined") {
+          window.addEventListener("beforeunload", async () => {
+            await this.deactivate({ keepalive: true });
+          });
+        }
+      } catch (err) {
         logger.error(`[AC] c:"${this.getKey()}" err :`, err);
         await this.handleConnectError(err);
         throw err;
-      });
+      }
     });
   }
   /**
@@ -20402,7 +20414,7 @@ class Client {
    * `attach` attaches the given document to this client. It tells the server that
    * this client will synchronize the given document.
    */
-  attach(doc, options = {}) {
+  attach(doc, opts = {}) {
     if (!this.isActive()) {
       throw new YorkieError(
         Code.ErrClientNotActivated,
@@ -20416,32 +20428,30 @@ class Client {
       );
     }
     doc.setActor(this.id);
-    doc.update((_, p) => p.set(options.initialPresence || {}));
-    const unsubscribeBroacastEvent = doc.subscribe(
-      "local-broadcast",
-      async (event) => {
-        var _a2;
-        const { topic, payload } = event.value;
-        const errorFn = (_a2 = event.options) == null ? void 0 : _a2.error;
-        const options2 = event.options;
-        try {
-          await this.broadcast(doc.getKey(), topic, payload, options2);
-        } catch (error) {
-          if (error instanceof Error) {
-            errorFn == null ? void 0 : errorFn(error);
-          }
+    doc.update((_, p) => p.set(opts.initialPresence || {}));
+    const unsub = doc.subscribe("local-broadcast", async (event) => {
+      var _a2;
+      const { topic, payload } = event.value;
+      const errorFn = (_a2 = event.options) == null ? void 0 : _a2.error;
+      const options = event.options;
+      try {
+        await this.broadcast(doc.getKey(), topic, payload, options);
+      } catch (error) {
+        if (error instanceof Error) {
+          errorFn == null ? void 0 : errorFn(error);
         }
       }
-    );
-    const syncMode = options.syncMode ?? "realtime";
+    });
+    const syncMode = opts.syncMode ?? "realtime";
     return this.enqueueTask(async () => {
-      return this.rpcClient.attachDocument(
-        {
-          clientId: this.id,
-          changePack: converter.toChangePack(doc.createChangePack())
-        },
-        { headers: { "x-shard-key": `${this.apiKey}/${doc.getKey()}` } }
-      ).then(async (res) => {
+      try {
+        const res = await this.rpcClient.attachDocument(
+          {
+            clientId: this.id,
+            changePack: converter.toChangePack(doc.createChangePack())
+          },
+          { headers: { "x-shard-key": `${this.apiKey}/${doc.getKey()}` } }
+        );
         const pack = converter.fromChangePack(res.changePack);
         doc.applyChangePack(pack);
         if (doc.getStatus() === DocStatus.Removed) {
@@ -20455,7 +20465,7 @@ class Client {
             doc,
             res.documentId,
             syncMode,
-            unsubscribeBroacastEvent
+            unsub
           )
         );
         if (syncMode !== "manual") {
@@ -20463,8 +20473,8 @@ class Client {
         }
         logger.info(`[AD] c:"${this.getKey()}" attaches d:"${doc.getKey()}"`);
         const crdtObject = doc.getRootObject();
-        if (options.initialRoot) {
-          const initialRoot = options.initialRoot;
+        if (opts.initialRoot) {
+          const initialRoot = opts.initialRoot;
           doc.update((root) => {
             for (const [k, v] of Object.entries(initialRoot)) {
               if (!crdtObject.has(k)) {
@@ -20475,11 +20485,11 @@ class Client {
           });
         }
         return doc;
-      }).catch(async (err) => {
+      } catch (err) {
         logger.error(`[AD] c:"${this.getKey()}" err :`, err);
         await this.handleConnectError(err);
         throw err;
-      });
+      }
     });
   }
   /**
@@ -20490,7 +20500,7 @@ class Client {
    * the changes should be applied to other replicas before GC time. For this,
    * if the document is no longer used by this client, it should be detached.
    */
-  detach(doc, options = { keepalive: false }) {
+  detach(doc, opts = { keepalive: false }) {
     if (!this.isActive()) {
       throw new YorkieError(
         Code.ErrClientNotActivated,
@@ -20506,15 +20516,16 @@ class Client {
     }
     doc.update((_, p) => p.clear());
     const task = async () => {
-      return await this.rpcClient.detachDocument(
-        {
-          clientId: this.id,
-          documentId: attachment.docID,
-          changePack: converter.toChangePack(doc.createChangePack()),
-          removeIfNotAttached: options.removeIfNotAttached ?? false
-        },
-        { headers: { "x-shard-key": `${this.apiKey}/${doc.getKey()}` } }
-      ).then((res) => {
+      try {
+        const res = await this.rpcClient.detachDocument(
+          {
+            clientId: this.id,
+            documentId: attachment.docID,
+            changePack: converter.toChangePack(doc.createChangePack()),
+            removeIfNotAttached: opts.removeIfNotAttached ?? false
+          },
+          { headers: { "x-shard-key": `${this.apiKey}/${doc.getKey()}` } }
+        );
         const pack = converter.fromChangePack(res.changePack);
         doc.applyChangePack(pack);
         if (doc.getStatus() !== DocStatus.Removed) {
@@ -20523,13 +20534,13 @@ class Client {
         this.detachInternal(doc.getKey());
         logger.info(`[DD] c:"${this.getKey()}" detaches d:"${doc.getKey()}"`);
         return doc;
-      }).catch(async (err) => {
+      } catch (err) {
         logger.error(`[DD] c:"${this.getKey()}" err :`, err);
         await this.handleConnectError(err);
         throw err;
-      });
+      }
     };
-    if (options.keepalive) {
+    if (opts.keepalive) {
       this.keepalive = true;
       const resp = task();
       this.keepalive = false;
@@ -20638,23 +20649,24 @@ class Client {
     const pbChangePack = converter.toChangePack(doc.createChangePack());
     pbChangePack.isRemoved = true;
     return this.enqueueTask(async () => {
-      return this.rpcClient.removeDocument(
-        {
-          clientId: this.id,
-          documentId: attachment.docID,
-          changePack: pbChangePack
-        },
-        { headers: { "x-shard-key": `${this.apiKey}/${doc.getKey()}` } }
-      ).then((res) => {
+      try {
+        const res = await this.rpcClient.removeDocument(
+          {
+            clientId: this.id,
+            documentId: attachment.docID,
+            changePack: pbChangePack
+          },
+          { headers: { "x-shard-key": `${this.apiKey}/${doc.getKey()}` } }
+        );
         const pack = converter.fromChangePack(res.changePack);
         doc.applyChangePack(pack);
         this.detachInternal(doc.getKey());
         logger.info(`[RD] c:"${this.getKey()}" removes d:"${doc.getKey()}"`);
-      }).catch(async (err) => {
+      } catch (err) {
         logger.error(`[RD] c:"${this.getKey()}" err :`, err);
         await this.handleConnectError(err);
         throw err;
-      });
+      }
     });
   }
   /**
@@ -20722,19 +20734,20 @@ class Client {
     };
     const doLoop = async () => {
       return this.enqueueTask(async () => {
-        return this.rpcClient.broadcast(
-          {
-            clientId: this.id,
-            documentId: attachment.docID,
-            topic,
-            payload: new TextEncoder().encode(JSON.stringify(payload))
-          },
-          { headers: { "x-shard-key": `${this.apiKey}/${docKey}` } }
-        ).then(() => {
+        try {
+          await this.rpcClient.broadcast(
+            {
+              clientId: this.id,
+              documentId: attachment.docID,
+              topic,
+              payload: new TextEncoder().encode(JSON.stringify(payload))
+            },
+            { headers: { "x-shard-key": `${this.apiKey}/${docKey}` } }
+          );
           logger.info(
             `[BC] c:"${this.getKey()}" broadcasts d:"${docKey}" t:"${topic}"`
           );
-        }).catch(async (err) => {
+        } catch (err) {
           logger.error(`[BC] c:"${this.getKey()}" err:`, err);
           if (await this.handleConnectError(err)) {
             if (err instanceof ConnectError && errorCodeOf(err) === Code.ErrUnauthenticated) {
@@ -20763,7 +20776,7 @@ class Client {
           } else {
             throw err;
           }
-        });
+        }
       });
     };
     return doLoop();
@@ -20948,19 +20961,20 @@ class Client {
     attachment.unsubscribeBroadcastEvent();
     this.attachmentMap.delete(docKey);
   }
-  syncInternal(attachment, syncMode) {
+  async syncInternal(attachment, syncMode) {
     const { doc, docID } = attachment;
     const reqPack = doc.createChangePack();
-    return this.rpcClient.pushPullChanges(
-      {
-        clientId: this.id,
-        documentId: docID,
-        changePack: converter.toChangePack(reqPack),
-        pushOnly: syncMode === "realtime-pushonly"
-        /* RealtimePushOnly */
-      },
-      { headers: { "x-shard-key": `${this.apiKey}/${doc.getKey()}` } }
-    ).then((res) => {
+    try {
+      const res = await this.rpcClient.pushPullChanges(
+        {
+          clientId: this.id,
+          documentId: docID,
+          changePack: converter.toChangePack(reqPack),
+          pushOnly: syncMode === "realtime-pushonly"
+          /* RealtimePushOnly */
+        },
+        { headers: { "x-shard-key": `${this.apiKey}/${doc.getKey()}` } }
+      );
       const respPack = converter.fromChangePack(res.changePack);
       if (respPack.hasChanges() && (attachment.syncMode === "realtime-pushonly" || attachment.syncMode === "realtime-syncoff")) {
         return doc;
@@ -20981,7 +20995,7 @@ class Client {
         `[PP] c:"${this.getKey()}" sync d:"${docKey}", push:${reqPack.getChangeSize()} pull:${remoteSize} cp:${respPack.getCheckpoint().toTestString()}`
       );
       return doc;
-    }).catch(async (err) => {
+    } catch (err) {
       doc.publish([
         {
           type: DocEventType.SyncStatusChanged,
@@ -20990,7 +21004,7 @@ class Client {
       ]);
       logger.error(`[PP] c:"${this.getKey()}" err :`, err);
       throw err;
-    });
+    }
   }
   /**
    * `handleConnectError` handles the given error. If the given error can be