@atlaskit/collab-provider 7.0.1 → 7.1.3

package/dist/es2019/helpers/utils.js

@@ -1,23 +1,18 @@
 export const createLogger = (prefix, color = 'blue') => (msg, data = null) => {
   if (window.COLLAB_PROVIDER_LOGGER) {
     // eslint-disable-next-line no-console
-    console.log(`%cCollab-${prefix}: ${msg}`, `color: ${color}; font-weight: bold`);
-
-    if (data) {
-      // eslint-disable-next-line no-console
-      console.log(data);
-    }
+    console.log(`%cCollab-${prefix}: ${msg}`, `color: ${color}; font-weight: bold`, data);
   }
 };
+const logger = createLogger('Helper:util', 'black');
 export const getParticipant = userId => {
-  // eslint-disable-next-line no-bitwise
-  const name = 'Demo User';
-  return Promise.resolve({
-    userId,
-    name,
-    avatar: `https://api.adorable.io/avatars/80/${name.replace(/\s/g, '')}.png`,
-    email: `${name.replace(/\s/g, '').toLocaleLowerCase()}@atlassian.com`
-  });
+  logger('getParticipant: ', userId);
+  return {
+    userId: userId,
+    name: userId,
+    avatar: '',
+    email: `${userId.replace(/\s/g, '').toLocaleLowerCase()}@atlassian.com`
+  };
 };
 export function sleep(ms) {
   return new Promise(resolve => {

package/dist/es2019/provider/index.js

@@ -1,6 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { getVersion, sendableSteps } from 'prosemirror-collab';
 import throttle from 'lodash/throttle';
+import isequal from 'lodash/isEqual';
 import { Emitter } from '../emitter';
 import { Channel } from '../channel';
 import { createLogger, getParticipant, sleep } from '../helpers/utils';
@@ -8,6 +9,7 @@ import { ACK_MAX_TRY } from '../helpers/const';
 import { triggerAnalyticsForCatchupFailed, triggerAnalyticsForStepsRejected, triggerAnalyticsForStepsAddedSuccessfully } from '../analytics';
 import { catchup } from './catchup';
 import { errorCodeMapper } from '../error-code-mapper';
+import { DisconnectReason, socketIOReasons } from '../disconnected-reason-mapper';
 const logger = createLogger('Provider', 'black');
 const PARTICIPANT_UPDATE_INTERVAL = 300 * 1000; // 300 seconds
 
@@ -195,7 +197,7 @@ export class Provider extends Emitter {
       this.presenceUpdateTimeout = window.setTimeout(() => this.sendPresence(), SEND_PRESENCE_INTERVAL);
     });
 
-    _defineProperty(this, "onParticipantJoined", ({
+    _defineProperty(this, "onPresenceJoined", ({
       sessionId
     }) => {
       logger('Participant joined with session: ', sessionId); // This expose existing users to the newly joined user
@@ -203,25 +205,18 @@ export class Provider extends Emitter {
       this.sendPresence();
     });
 
-    _defineProperty(this, "onTitleChanged", ({
-      title
+    _defineProperty(this, "onPresence", ({
+      userId
     }) => {
-      if (title !== undefined && this.metadata.title !== title) {
-        this.metadata.title = title;
-        this.emit('metadata:changed', {
-          title
-        });
-      }
+      logger('onPresence userId: ', userId);
+      this.userId = userId;
+      this.sendPresence();
+      this.channel.sendPresenceJoined();
     });
 
-    _defineProperty(this, "onWidthChanged", ({
-      editorWidth
-    }) => {
-      if (editorWidth !== undefined && this.metadata.editorWidth !== editorWidth) {
-        this.metadata.editorWidth = editorWidth;
-        this.emit('metadata:changed', {
-          editorWidth
-        });
+    _defineProperty(this, "onMetadataChanged", metadata => {
+      if (metadata !== undefined && !isequal(this.metadata, metadata)) {
+        this.emit('metadata:changed', metadata);
       }
     });
 
@@ -288,6 +283,11 @@ export class Provider extends Emitter {
       userId,
       clientId
     }) => {
+      if (!userId) {
+        // If userId does not exsit, does nothing here to prevent duplication.
+        return;
+      }
+
       const {
         getUser
       } = this.config;
@@ -348,12 +348,38 @@ export class Provider extends Emitter {
       this.participantUpdateTimeout = window.setTimeout(() => this.updateParticipants(), PARTICIPANT_UPDATE_INTERVAL);
     });
 
+    _defineProperty(this, "disconnectedReasonMapper", reason => {
+      switch (reason) {
+        case socketIOReasons.IO_CLIENT_DISCONNECT:
+          return DisconnectReason.CLIENT_DISCONNECT;
+
+        case socketIOReasons.IO_SERVER_DISCONNECT:
+          return DisconnectReason.SERVER_DISCONNECT;
+
+        case socketIOReasons.TRANSPORT_CLOSED:
+          return DisconnectReason.SOCKET_CLOSED;
+
+        case socketIOReasons.TRANSPORT_ERROR:
+          return DisconnectReason.SOCKET_ERROR;
+
+        case socketIOReasons.PING_TIMEOUT:
+          return DisconnectReason.SOCKET_TIMEOUT;
+
+        default:
+          return DisconnectReason.UNKNOWN_DISCONNECT;
+      }
+    });
+
     _defineProperty(this, "onDisconnected", ({
       reason
     }) => {
       this.disconnectedAt = Date.now();
       const left = Array.from(this.participants.values());
       this.participants.clear();
+      this.emit('disconnected', {
+        reason: this.disconnectedReasonMapper(reason),
+        sid: this.sessionId
+      });
 
       if (left.length) {
         this.emit('presence', {
@@ -386,8 +412,7 @@ export class Provider extends Emitter {
       this.sessionId = sid;
       this.emit('connected', {
         sid
-      });
-      this.sendPresence(); // If already initialized, `connected` means reconnected
+      }); // If already initialized, `connected` means reconnected
 
       if (initialized && this.disconnectedAt && // Offline longer than `OUT_OF_SYNC_PERIOD`
       Date.now() - this.disconnectedAt >= OUT_OF_SYNC_PERIOD) {
@@ -398,18 +423,15 @@ export class Provider extends Emitter {
     }).on('init', ({
       doc,
       version,
-      userId,
       metadata
     }) => {
-      this.userId = userId;
-      this.sendPresence(); // Initial document and version
-
+      // Initial document and version
       this.updateDocumentWithMetadata({
         doc,
         version,
         metadata
       });
-    }).on('steps:added', this.onStepsAdded).on('participant:telepointer', this.onParticipantTelepointer).on('participant:joined', this.onParticipantJoined).on('participant:left', this.onParticipantLeft).on('participant:updated', this.onParticipantUpdated).on('title:changed', this.onTitleChanged).on('width:changed', this.onWidthChanged).on('disconnect', this.onDisconnected).on('error', this.onErrorHandled).connect();
+    }).on('steps:added', this.onStepsAdded).on('participant:telepointer', this.onParticipantTelepointer).on('presence:joined', this.onPresenceJoined).on('presence', this.onPresence).on('participant:left', this.onParticipantLeft).on('participant:updated', this.onParticipantUpdated).on('metadata:changed', this.onMetadataChanged).on('disconnect', this.onDisconnected).on('error', this.onErrorHandled).connect();
     return this;
   }
   /**
@@ -595,23 +617,32 @@ export class Provider extends Emitter {
   }
 
   setTitle(title, broadcast) {
-    this.metadata.title = title;
-
     if (broadcast) {
-      this.channel.broadcast('title:changed', {
+      this.channel.sendMetadata({
         title
       });
     }
+
+    Object.assign(this.metadata, {
+      title
+    });
   }
 
   setEditorWidth(editorWidth, broadcast) {
-    this.metadata.editorWidth = editorWidth;
-
     if (broadcast) {
-      this.channel.broadcast('width:changed', {
+      this.channel.sendMetadata({
         editorWidth
       });
     }
+
+    Object.assign(this.metadata, {
+      editorWidth
+    });
+  }
+
+  setMetadata(metadata) {
+    this.channel.sendMetadata(metadata);
+    Object.assign(this.metadata, metadata);
   }
   /**
    * Get latest state.

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/collab-provider",
-	"version": "7.0.1",
+	"version": "7.1.3",
 	"sideEffects": false
 }

package/dist/esm/channel.js

@@ -149,8 +149,11 @@ export var Channel = /*#__PURE__*/function (_Emitter) {
       this.socket.on('participant:telepointer', function (payload) {
         _this2.emit('participant:telepointer', payload.data);
       });
-      this.socket.on('participant:joined', function (data) {
-        _this2.emit('participant:joined', data);
+      this.socket.on('presence:joined', function (data) {
+        _this2.emit('presence:joined', data);
+      });
+      this.socket.on('presence', function (data) {
+        _this2.emit('presence', data);
       });
       this.socket.on('participant:left', function (data) {
         _this2.emit('participant:left', data);
@@ -167,11 +170,8 @@ export var Channel = /*#__PURE__*/function (_Emitter) {
           clientId: clientId
         }, data));
       });
-      this.socket.on('title:changed', function (payload) {
-        _this2.emit('title:changed', payload.data);
-      });
-      this.socket.on('width:changed', function (payload) {
-        _this2.emit('width:changed', payload.data);
+      this.socket.on('metadata:changed', function (payload) {
+        _this2.emit('metadata:changed', payload);
       });
       this.socket.on('disconnect', /*#__PURE__*/function () {
         var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(reason) {
@@ -344,6 +344,24 @@ export var Channel = /*#__PURE__*/function (_Emitter) {
         type: type
       }, data));
     }
+  }, {
+    key: "sendMetadata",
+    value: function sendMetadata(metadata) {
+      if (!this.connected || !this.socket) {
+        return;
+      }
+
+      this.socket.emit('metadata', metadata);
+    }
+  }, {
+    key: "sendPresenceJoined",
+    value: function sendPresenceJoined() {
+      if (!this.connected || !this.socket) {
+        return;
+      }
+
+      this.socket.emit('presence:joined');
+    }
   }, {
     key: "disconnect",
     value: function disconnect() {

package/dist/esm/disconnected-reason-mapper.js

@@ -0,0 +1,23 @@
+// See https://socket.io/docs/v3/client-socket-instance#disconnect for emitted reasons
+export var socketIOReasons = {
+  IO_CLIENT_DISCONNECT: 'io client disconnect',
+  // The socket was manually disconnected using socket.disconnect()
+  IO_SERVER_DISCONNECT: 'io server disconnect',
+  // The server has forcefully disconnected the socket with socket.disconnect()
+  TRANSPORT_CLOSED: 'transport close',
+  // The server did not send a PING within the pingInterval + pingTimeout range
+  TRANSPORT_ERROR: 'transport error',
+  // The connection was closed (example: the user has lost connection, or the network was changed from WiFi to 4G)
+  PING_TIMEOUT: 'ping timeout' // The connection has encountered an error (example: the server was killed during a HTTP long-polling cycle)
+
+};
+export var DisconnectReason;
+
+(function (DisconnectReason) {
+  DisconnectReason["CLIENT_DISCONNECT"] = "CLIENT_DISCONNECT";
+  DisconnectReason["SERVER_DISCONNECT"] = "SERVER_DISCONNECT";
+  DisconnectReason["SOCKET_CLOSED"] = "SOCKET_CLOSED";
+  DisconnectReason["SOCKET_ERROR"] = "SOCKET_ERROR";
+  DisconnectReason["SOCKET_TIMEOUT"] = "SOCKET_TIMEOUT";
+  DisconnectReason["UNKNOWN_DISCONNECT"] = "UNKNOWN_DISCONNECT";
+})(DisconnectReason || (DisconnectReason = {}));

package/dist/esm/helpers/utils.js

@@ -5,24 +5,19 @@ export var createLogger = function createLogger(prefix) {
 
     if (window.COLLAB_PROVIDER_LOGGER) {
       // eslint-disable-next-line no-console
-      console.log("%cCollab-".concat(prefix, ": ").concat(msg), "color: ".concat(color, "; font-weight: bold"));
-
-      if (data) {
-        // eslint-disable-next-line no-console
-        console.log(data);
-      }
+      console.log("%cCollab-".concat(prefix, ": ").concat(msg), "color: ".concat(color, "; font-weight: bold"), data);
     }
   };
 };
+var logger = createLogger('Helper:util', 'black');
 export var getParticipant = function getParticipant(userId) {
-  // eslint-disable-next-line no-bitwise
-  var name = 'Demo User';
-  return Promise.resolve({
+  logger('getParticipant: ', userId);
+  return {
     userId: userId,
-    name: name,
-    avatar: "https://api.adorable.io/avatars/80/".concat(name.replace(/\s/g, ''), ".png"),
-    email: "".concat(name.replace(/\s/g, '').toLocaleLowerCase(), "@atlassian.com")
-  });
+    name: userId,
+    avatar: '',
+    email: "".concat(userId.replace(/\s/g, '').toLocaleLowerCase(), "@atlassian.com")
+  };
 };
 export function sleep(ms) {
   return new Promise(function (resolve) {

package/dist/esm/provider/index.js

@@ -22,6 +22,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 import { getVersion, sendableSteps } from 'prosemirror-collab';
 import throttle from 'lodash/throttle';
+import isequal from 'lodash/isEqual';
 import { Emitter } from '../emitter';
 import { Channel } from '../channel';
 import { createLogger, getParticipant, sleep } from '../helpers/utils';
@@ -29,6 +30,7 @@ import { ACK_MAX_TRY } from '../helpers/const';
 import { triggerAnalyticsForCatchupFailed, triggerAnalyticsForStepsRejected, triggerAnalyticsForStepsAddedSuccessfully } from '../analytics';
 import { catchup } from './catchup';
 import { errorCodeMapper } from '../error-code-mapper';
+import { DisconnectReason, socketIOReasons } from '../disconnected-reason-mapper';
 var logger = createLogger('Provider', 'black');
 var PARTICIPANT_UPDATE_INTERVAL = 300 * 1000; // 300 seconds
 
@@ -261,39 +263,31 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
       }, SEND_PRESENCE_INTERVAL);
     });
 
-    _defineProperty(_assertThisInitialized(_this), "onParticipantJoined", function (_ref5) {
+    _defineProperty(_assertThisInitialized(_this), "onPresenceJoined", function (_ref5) {
       var sessionId = _ref5.sessionId;
       logger('Participant joined with session: ', sessionId); // This expose existing users to the newly joined user
 
       _this.sendPresence();
     });
 
-    _defineProperty(_assertThisInitialized(_this), "onTitleChanged", function (_ref6) {
-      var title = _ref6.title;
+    _defineProperty(_assertThisInitialized(_this), "onPresence", function (_ref6) {
+      var userId = _ref6.userId;
+      logger('onPresence userId: ', userId);
+      _this.userId = userId;
 
-      if (title !== undefined && _this.metadata.title !== title) {
-        _this.metadata.title = title;
+      _this.sendPresence();
 
-        _this.emit('metadata:changed', {
-          title: title
-        });
-      }
+      _this.channel.sendPresenceJoined();
     });
 
-    _defineProperty(_assertThisInitialized(_this), "onWidthChanged", function (_ref7) {
-      var editorWidth = _ref7.editorWidth;
-
-      if (editorWidth !== undefined && _this.metadata.editorWidth !== editorWidth) {
-        _this.metadata.editorWidth = editorWidth;
-
-        _this.emit('metadata:changed', {
-          editorWidth: editorWidth
-        });
+    _defineProperty(_assertThisInitialized(_this), "onMetadataChanged", function (metadata) {
+      if (metadata !== undefined && !isequal(_this.metadata, metadata)) {
+        _this.emit('metadata:changed', metadata);
       }
     });
 
-    _defineProperty(_assertThisInitialized(_this), "onParticipantLeft", function (_ref8) {
-      var sessionId = _ref8.sessionId;
+    _defineProperty(_assertThisInitialized(_this), "onParticipantLeft", function (_ref7) {
+      var sessionId = _ref7.sessionId;
       logger("Participant left");
 
       _this.participants.delete(sessionId);
@@ -305,11 +299,11 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
       });
     });
 
-    _defineProperty(_assertThisInitialized(_this), "onParticipantUpdated", function (_ref9) {
-      var sessionId = _ref9.sessionId,
-          timestamp = _ref9.timestamp,
-          userId = _ref9.userId,
-          clientId = _ref9.clientId;
+    _defineProperty(_assertThisInitialized(_this), "onParticipantUpdated", function (_ref8) {
+      var sessionId = _ref8.sessionId,
+          timestamp = _ref8.timestamp,
+          userId = _ref8.userId,
+          clientId = _ref8.clientId;
 
       _this.updateParticipant({
         sessionId: sessionId,
@@ -319,12 +313,12 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
       });
     });
 
-    _defineProperty(_assertThisInitialized(_this), "onParticipantTelepointer", function (_ref10) {
-      var sessionId = _ref10.sessionId,
-          timestamp = _ref10.timestamp,
-          selection = _ref10.selection,
-          userId = _ref10.userId,
-          clientId = _ref10.clientId;
+    _defineProperty(_assertThisInitialized(_this), "onParticipantTelepointer", function (_ref9) {
+      var sessionId = _ref9.sessionId,
+          timestamp = _ref9.timestamp,
+          selection = _ref9.selection,
+          userId = _ref9.userId,
+          clientId = _ref9.clientId;
 
       if (sessionId === _this.sessionId) {
         return;
@@ -353,19 +347,28 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "updateParticipant", /*#__PURE__*/function () {
-      var _ref12 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(_ref11) {
+      var _ref11 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(_ref10) {
         var sessionId, timestamp, userId, clientId, getUser, _yield, _yield$name, name, _yield$email, email, _yield$avatar, avatar, isNewParticipant;
 
         return _regeneratorRuntime.wrap(function _callee2$(_context2) {
           while (1) {
             switch (_context2.prev = _context2.next) {
               case 0:
-                sessionId = _ref11.sessionId, timestamp = _ref11.timestamp, userId = _ref11.userId, clientId = _ref11.clientId;
+                sessionId = _ref10.sessionId, timestamp = _ref10.timestamp, userId = _ref10.userId, clientId = _ref10.clientId;
+
+                if (userId) {
+                  _context2.next = 3;
+                  break;
+                }
+
+                return _context2.abrupt("return");
+
+              case 3:
                 getUser = _this.config.getUser;
-                _context2.next = 4;
+                _context2.next = 6;
                 return getUser ? getUser(userId) : getParticipant(userId);
 
-              case 4:
+              case 6:
                 _yield = _context2.sent;
                 _yield$name = _yield.name;
                 name = _yield$name === void 0 ? '' : _yield$name;
@@ -395,7 +398,7 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
 
                 _this.updateParticipants(isNewParticipant ? [_this.participants.get(sessionId)] : []);
 
-              case 15:
+              case 17:
               case "end":
                 return _context2.stop();
             }
@@ -404,7 +407,7 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
       }));
 
       return function (_x) {
-        return _ref12.apply(this, arguments);
+        return _ref11.apply(this, arguments);
       };
     }());
 
@@ -445,13 +448,40 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
       }, PARTICIPANT_UPDATE_INTERVAL);
     });
 
-    _defineProperty(_assertThisInitialized(_this), "onDisconnected", function (_ref13) {
-      var reason = _ref13.reason;
+    _defineProperty(_assertThisInitialized(_this), "disconnectedReasonMapper", function (reason) {
+      switch (reason) {
+        case socketIOReasons.IO_CLIENT_DISCONNECT:
+          return DisconnectReason.CLIENT_DISCONNECT;
+
+        case socketIOReasons.IO_SERVER_DISCONNECT:
+          return DisconnectReason.SERVER_DISCONNECT;
+
+        case socketIOReasons.TRANSPORT_CLOSED:
+          return DisconnectReason.SOCKET_CLOSED;
+
+        case socketIOReasons.TRANSPORT_ERROR:
+          return DisconnectReason.SOCKET_ERROR;
+
+        case socketIOReasons.PING_TIMEOUT:
+          return DisconnectReason.SOCKET_TIMEOUT;
+
+        default:
+          return DisconnectReason.UNKNOWN_DISCONNECT;
+      }
+    });
+
+    _defineProperty(_assertThisInitialized(_this), "onDisconnected", function (_ref12) {
+      var reason = _ref12.reason;
       _this.disconnectedAt = Date.now();
       var left = Array.from(_this.participants.values());
 
       _this.participants.clear();
 
+      _this.emit('disconnected', {
+        reason: _this.disconnectedReasonMapper(reason),
+        sid: _this.sessionId
+      });
+
       if (left.length) {
         _this.emit('presence', {
           left: left
@@ -484,16 +514,14 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
       this.getState().plugins.find(function (p) {
         return p.key === 'collab$';
       }).spec.config.clientID : optionsOrGetState.clientId;
-      this.channel.on('connected', function (_ref14) {
-        var sid = _ref14.sid,
-            initialized = _ref14.initialized;
+      this.channel.on('connected', function (_ref13) {
+        var sid = _ref13.sid,
+            initialized = _ref13.initialized;
         _this2.sessionId = sid;
 
         _this2.emit('connected', {
           sid: sid
-        });
-
-        _this2.sendPresence(); // If already initialized, `connected` means reconnected
+        }); // If already initialized, `connected` means reconnected
 
 
         if (initialized && _this2.disconnectedAt && // Offline longer than `OUT_OF_SYNC_PERIOD`
@@ -502,22 +530,18 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
         }
 
         _this2.disconnectedAt = undefined;
-      }).on('init', function (_ref15) {
-        var doc = _ref15.doc,
-            version = _ref15.version,
-            userId = _ref15.userId,
-            metadata = _ref15.metadata;
-        _this2.userId = userId;
-
-        _this2.sendPresence(); // Initial document and version
-
+      }).on('init', function (_ref14) {
+        var doc = _ref14.doc,
+            version = _ref14.version,
+            metadata = _ref14.metadata;
 
+        // Initial document and version
         _this2.updateDocumentWithMetadata({
           doc: doc,
           version: version,
           metadata: metadata
         });
-      }).on('steps:added', this.onStepsAdded).on('participant:telepointer', this.onParticipantTelepointer).on('participant:joined', this.onParticipantJoined).on('participant:left', this.onParticipantLeft).on('participant:updated', this.onParticipantUpdated).on('title:changed', this.onTitleChanged).on('width:changed', this.onWidthChanged).on('disconnect', this.onDisconnected).on('error', this.onErrorHandled).connect();
+      }).on('steps:added', this.onStepsAdded).on('participant:telepointer', this.onParticipantTelepointer).on('presence:joined', this.onPresenceJoined).on('presence', this.onPresence).on('participant:left', this.onParticipantLeft).on('participant:updated', this.onParticipantUpdated).on('metadata:changed', this.onMetadataChanged).on('disconnect', this.onDisconnected).on('error', this.onErrorHandled).connect();
       return this;
     }
     /**
@@ -616,8 +640,8 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
       logger("Processing data. Version \"".concat(version, "\"."));
 
       if (steps && steps.length) {
-        var clientIds = steps.map(function (_ref16) {
-          var clientId = _ref16.clientId;
+        var clientIds = steps.map(function (_ref15) {
+          var clientId = _ref15.clientId;
           return clientId;
         });
         this.emit('data', {
@@ -680,14 +704,14 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
             participant = _Array$from$filter2[0];
 
         if (participant) {
-          var _ref17 = step,
-              stepType = _ref17.stepType,
-              to = _ref17.to,
-              from = _ref17.from,
-              _ref17$slice = _ref17.slice,
-              slice = _ref17$slice === void 0 ? {
+          var _ref16 = step,
+              stepType = _ref16.stepType,
+              to = _ref16.to,
+              from = _ref16.from,
+              _ref16$slice = _ref16.slice,
+              slice = _ref16$slice === void 0 ? {
             content: []
-          } : _ref17$slice;
+          } : _ref16$slice;
 
           var _slice$content = _slicedToArray(slice.content, 1),
               node = _slice$content[0];
@@ -719,24 +743,34 @@ export var Provider = /*#__PURE__*/function (_Emitter) {
   }, {
     key: "setTitle",
     value: function setTitle(title, broadcast) {
-      this.metadata.title = title;
-
       if (broadcast) {
-        this.channel.broadcast('title:changed', {
+        this.channel.sendMetadata({
           title: title
         });
       }
+
+      Object.assign(this.metadata, {
+        title: title
+      });
     }
   }, {
     key: "setEditorWidth",
     value: function setEditorWidth(editorWidth, broadcast) {
-      this.metadata.editorWidth = editorWidth;
-
       if (broadcast) {
-        this.channel.broadcast('width:changed', {
+        this.channel.sendMetadata({
           editorWidth: editorWidth
         });
       }
+
+      Object.assign(this.metadata, {
+        editorWidth: editorWidth
+      });
+    }
+  }, {
+    key: "setMetadata",
+    value: function setMetadata(metadata) {
+      this.channel.sendMetadata(metadata);
+      Object.assign(this.metadata, metadata);
     }
     /**
      * Get latest state.

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/collab-provider",
-	"version": "7.0.1",
+	"version": "7.1.3",
 	"sideEffects": false
 }