@atlaskit/editor-synced-block-provider 0.1.0

package/CHANGELOG.md

@@ -0,0 +1 @@
+# @atlaskit/editor-synced-block-provider

package/LICENSE.md

@@ -0,0 +1,11 @@
+Copyright 2023 Atlassian Pty Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in
+compliance with the License. You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under the License is
+distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+implied. See the License for the specific language governing permissions and limitations under the
+License.

package/README.md

@@ -0,0 +1,9 @@
+# EditorSyncedBlockProvider
+
+Synced Block Provider for @atlaskit/editor-plugin-synced-block
+
+## Usage
+
+`import EditorSyncedBlockProvider from '@atlaskit/editor-synced-block-provider';`
+
+Detailed docs and example usage can be found [here](https://atlaskit.atlassian.com/packages/editor/editor-synced-block-provider).

package/dist/cjs/common/syncBlockProvider.js

@@ -0,0 +1,92 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useFetchDocNode = exports.SyncBlockProvider = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("react");
+var _utils = require("../utils/utils");
+var _types = require("./types");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+var SyncBlockProvider = exports.SyncBlockProvider = /*#__PURE__*/function (_SyncBlockDataProvide) {
+  function SyncBlockProvider(fetchProvider, writeProvider, sourceId) {
+    var _this;
+    (0, _classCallCheck2.default)(this, SyncBlockProvider);
+    _this = _callSuper(this, SyncBlockProvider);
+    (0, _defineProperty2.default)(_this, "name", 'syncBlockProvider');
+    (0, _defineProperty2.default)(_this, "isNodeSupported", function (node) {
+      return node.type === 'syncBlock';
+    });
+    (0, _defineProperty2.default)(_this, "nodeDataKey", function (node) {
+      return node.attrs.localId;
+    });
+    (0, _defineProperty2.default)(_this, "fetchNodesData", function (nodes) {
+      return Promise.all(nodes.map(function (node) {
+        return _this.fetchProvider.fetchData(node.attrs.resourceId);
+      }));
+    });
+    /**
+     *
+     * @param nodes
+     * @param data
+     *
+     * @returns the resource ids of the nodes that were written
+     */
+    (0, _defineProperty2.default)(_this, "writeNodesData", function (nodes, data) {
+      var resourceIds = [];
+      nodes.forEach(function (node, index) {
+        if (!data[index].content) {
+          resourceIds.push(Promise.reject('No Synced Blockcontent to write'));
+          return;
+        }
+        var resourceId = _this.writeProvider.writeData(_this.sourceId, node.attrs.localId, data[index].content, node.attrs.resourceId);
+        resourceIds.push(resourceId);
+      });
+      return Promise.all(resourceIds);
+    });
+    _this.fetchProvider = fetchProvider;
+    _this.writeProvider = writeProvider;
+    _this.sourceId = sourceId;
+    return _this;
+  }
+  (0, _inherits2.default)(SyncBlockProvider, _SyncBlockDataProvide);
+  return (0, _createClass2.default)(SyncBlockProvider);
+}(_types.SyncBlockDataProvider);
+var useFetchDocNode = exports.useFetchDocNode = function useFetchDocNode(editorView, node, defaultDocNode, provider) {
+  var _useState = (0, _react.useState)(defaultDocNode),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    docNode = _useState2[0],
+    setDocNode = _useState2[1];
+  (0, _react.useEffect)(function () {
+    if (!provider) {
+      return;
+    }
+    var interval = window.setInterval(function () {
+      var nodes = [(0, _utils.createSyncBlockNode)(node, false)];
+      provider === null || provider === void 0 || provider.fetchNodesData(nodes).then(function (data) {
+        var _data$;
+        if (data && (_data$ = data[0]) !== null && _data$ !== void 0 && _data$.content) {
+          var newNode = editorView.state.schema.nodeFromJSON(data[0].content);
+          setDocNode(_objectSpread(_objectSpread({}, newNode.toJSON()), {}, {
+            version: 1
+          }));
+        }
+      });
+    }, 1000);
+    return function () {
+      window.clearInterval(interval);
+    };
+  }, [editorView, node, provider]);
+  return docNode;
+};

package/dist/cjs/common/syncBlockStoreManager.js

@@ -0,0 +1,94 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SyncBlockStoreManager = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+// Do this typedef to make it clear that
+// this is a local identifier for a resource for local use
+// A store manager responsible for the lifecycle and state management of sync blocks in an editor instance.
+// Supports create, read, update, and delete operations for sync blocks.
+// Designed to manage local in-memory state and synchronize with an external data provider.
+// Handles caching, debouncing updates, and publish/subscribe for local changes.
+// Ensures consistency between local and remote state, and can be used in both editor and renderer contexts.
+var SyncBlockStoreManager = exports.SyncBlockStoreManager = /*#__PURE__*/function () {
+  function SyncBlockStoreManager(dataProvider) {
+    (0, _classCallCheck2.default)(this, SyncBlockStoreManager);
+    this.syncBlocks = new Map();
+    this.dataProvider = dataProvider;
+  }
+  return (0, _createClass2.default)(SyncBlockStoreManager, [{
+    key: "setEditorView",
+    value: function setEditorView(editorView) {
+      this.editorView = editorView;
+    }
+  }, {
+    key: "isSourceBlock",
+    value: function isSourceBlock(node) {
+      var _this$syncBlocks$get;
+      if (!this.dataProvider || node.type.name !== 'syncBlock') {
+        return false;
+      }
+      var _node$attrs = node.attrs,
+        resourceId = _node$attrs.resourceId,
+        localId = _node$attrs.localId;
+      return this.syncBlocks.has(resourceId) && ((_this$syncBlocks$get = this.syncBlocks.get(resourceId)) === null || _this$syncBlocks$get === void 0 ? void 0 : _this$syncBlocks$get.sourceLocalId) === localId;
+    }
+  }, {
+    key: "registerConfirmationCallback",
+    value: function registerConfirmationCallback(callback) {
+      var _this = this;
+      this.confirmationCallback = callback;
+      return function () {
+        _this.confirmationCallback = undefined;
+      };
+    }
+  }, {
+    key: "requireConfirmationBeforeDelete",
+    value: function requireConfirmationBeforeDelete() {
+      return !!this.confirmationCallback;
+    }
+  }, {
+    key: "deleteSyncBlocksWithConfirmation",
+    value: function () {
+      var _deleteSyncBlocksWithConfirmation = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(tr, syncBlockIds) {
+        var _this2 = this;
+        var confirmed, _this$editorView;
+        return _regenerator.default.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              if (!this.confirmationCallback) {
+                _context.next = 5;
+                break;
+              }
+              _context.next = 3;
+              return this.confirmationCallback();
+            case 3:
+              confirmed = _context.sent;
+              if (confirmed) {
+                // TODO: EDITOR-1779 - "rebase" the transaction to reflect the latest document state
+                (_this$editorView = this.editorView) === null || _this$editorView === void 0 || _this$editorView.dispatch(tr.setMeta('isConfirmedSyncBlockDeletion', true));
+                // Need to update the BE on deletion
+                syncBlockIds.forEach(function (_ref) {
+                  var resourceId = _ref.resourceId;
+                  return _this2.syncBlocks.delete(resourceId);
+                });
+              }
+            case 5:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, this);
+      }));
+      function deleteSyncBlocksWithConfirmation(_x, _x2) {
+        return _deleteSyncBlocksWithConfirmation.apply(this, arguments);
+      }
+      return deleteSyncBlocksWithConfirmation;
+    }()
+  }]);
+}();

package/dist/cjs/common/types.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SyncBlockDataProvider = void 0;
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _nodeDataProvider = require("@atlaskit/node-data-provider");
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+var SyncBlockDataProvider = exports.SyncBlockDataProvider = /*#__PURE__*/function (_NodeDataProvider) {
+  function SyncBlockDataProvider() {
+    (0, _classCallCheck2.default)(this, SyncBlockDataProvider);
+    return _callSuper(this, SyncBlockDataProvider, arguments);
+  }
+  (0, _inherits2.default)(SyncBlockDataProvider, _NodeDataProvider);
+  return (0, _createClass2.default)(SyncBlockDataProvider);
+}(_nodeDataProvider.NodeDataProvider);

package/dist/cjs/index.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "SyncBlockStoreManager", {
+  enumerable: true,
+  get: function get() {
+    return _syncBlockStoreManager.SyncBlockStoreManager;
+  }
+});
+Object.defineProperty(exports, "SyncedBlockProvider", {
+  enumerable: true,
+  get: function get() {
+    return _syncBlockProvider.SyncBlockProvider;
+  }
+});
+Object.defineProperty(exports, "createSyncBlockNode", {
+  enumerable: true,
+  get: function get() {
+    return _utils.createSyncBlockNode;
+  }
+});
+Object.defineProperty(exports, "inMemoryFetchProvider", {
+  enumerable: true,
+  get: function get() {
+    return _inMemory.inMemoryFetchProvider;
+  }
+});
+Object.defineProperty(exports, "inMemoryWriteProvider", {
+  enumerable: true,
+  get: function get() {
+    return _inMemory.inMemoryWriteProvider;
+  }
+});
+Object.defineProperty(exports, "useFetchDocNode", {
+  enumerable: true,
+  get: function get() {
+    return _syncBlockProvider.useFetchDocNode;
+  }
+});
+var _syncBlockProvider = require("./common/syncBlockProvider");
+var _syncBlockStoreManager = require("./common/syncBlockStoreManager");
+var _inMemory = require("./providers/inMemory");
+var _utils = require("./utils/utils");

package/dist/cjs/providers/inMemory.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.inMemoryWriteProvider = exports.inMemoryFetchProvider = void 0;
+var inMemStore = new Map();
+var inMemoryFetchProvider = exports.inMemoryFetchProvider = {
+  fetchData: function fetchData(resourceId) {
+    return Promise.resolve({
+      content: inMemStore.get(resourceId)
+    });
+  }
+};
+var inMemoryWriteProvider = exports.inMemoryWriteProvider = {
+  writeData: function writeData(_sourceId, _localId, data, resourceId) {
+    if (resourceId) {
+      inMemStore.set(resourceId, data);
+      return Promise.resolve(resourceId);
+    } else {
+      var uuid = crypto.randomUUID();
+      inMemStore.set(uuid, data);
+      return Promise.resolve(uuid);
+    }
+  }
+};

package/dist/cjs/utils/utils.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createSyncBlockNode = void 0;
+var _editorJsonTransformer = require("@atlaskit/editor-json-transformer");
+var createSyncBlockNode = exports.createSyncBlockNode = function createSyncBlockNode(node) {
+  var includeContent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  var transformer = new _editorJsonTransformer.JSONTransformer();
+  var toJSON = function toJSON(node) {
+    return transformer.encodeNode(node);
+  };
+  return {
+    type: 'syncBlock',
+    attrs: {
+      localId: node.attrs.localId,
+      resourceId: node.attrs.resourceId
+    },
+    content: includeContent ? node.content.content.map(toJSON) : undefined
+  };
+};

package/dist/es2019/common/syncBlockProvider.js

@@ -0,0 +1,64 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { useEffect, useState } from 'react';
+import { createSyncBlockNode } from '../utils/utils';
+import { SyncBlockDataProvider } from './types';
+export class SyncBlockProvider extends SyncBlockDataProvider {
+  constructor(fetchProvider, writeProvider, sourceId) {
+    super();
+    _defineProperty(this, "name", 'syncBlockProvider');
+    _defineProperty(this, "isNodeSupported", node => node.type === 'syncBlock');
+    _defineProperty(this, "nodeDataKey", node => node.attrs.localId);
+    _defineProperty(this, "fetchNodesData", nodes => {
+      return Promise.all(nodes.map(node => {
+        return this.fetchProvider.fetchData(node.attrs.resourceId);
+      }));
+    });
+    /**
+     *
+     * @param nodes
+     * @param data
+     *
+     * @returns the resource ids of the nodes that were written
+     */
+    _defineProperty(this, "writeNodesData", (nodes, data) => {
+      const resourceIds = [];
+      nodes.forEach((node, index) => {
+        if (!data[index].content) {
+          resourceIds.push(Promise.reject('No Synced Blockcontent to write'));
+          return;
+        }
+        const resourceId = this.writeProvider.writeData(this.sourceId, node.attrs.localId, data[index].content, node.attrs.resourceId);
+        resourceIds.push(resourceId);
+      });
+      return Promise.all(resourceIds);
+    });
+    this.fetchProvider = fetchProvider;
+    this.writeProvider = writeProvider;
+    this.sourceId = sourceId;
+  }
+}
+export const useFetchDocNode = (editorView, node, defaultDocNode, provider) => {
+  const [docNode, setDocNode] = useState(defaultDocNode);
+  useEffect(() => {
+    if (!provider) {
+      return;
+    }
+    const interval = window.setInterval(() => {
+      const nodes = [createSyncBlockNode(node, false)];
+      provider === null || provider === void 0 ? void 0 : provider.fetchNodesData(nodes).then(data => {
+        var _data$;
+        if (data && (_data$ = data[0]) !== null && _data$ !== void 0 && _data$.content) {
+          const newNode = editorView.state.schema.nodeFromJSON(data[0].content);
+          setDocNode({
+            ...newNode.toJSON(),
+            version: 1
+          });
+        }
+      });
+    }, 1000);
+    return () => {
+      window.clearInterval(interval);
+    };
+  }, [editorView, node, provider]);
+  return docNode;
+};

package/dist/es2019/common/syncBlockStoreManager.js

@@ -0,0 +1,51 @@
+// Do this typedef to make it clear that
+// this is a local identifier for a resource for local use
+
+// A store manager responsible for the lifecycle and state management of sync blocks in an editor instance.
+// Supports create, read, update, and delete operations for sync blocks.
+// Designed to manage local in-memory state and synchronize with an external data provider.
+// Handles caching, debouncing updates, and publish/subscribe for local changes.
+// Ensures consistency between local and remote state, and can be used in both editor and renderer contexts.
+export class SyncBlockStoreManager {
+  constructor(dataProvider) {
+    this.syncBlocks = new Map();
+    this.dataProvider = dataProvider;
+  }
+  setEditorView(editorView) {
+    this.editorView = editorView;
+  }
+  isSourceBlock(node) {
+    var _this$syncBlocks$get;
+    if (!this.dataProvider || node.type.name !== 'syncBlock') {
+      return false;
+    }
+    const {
+      resourceId,
+      localId
+    } = node.attrs;
+    return this.syncBlocks.has(resourceId) && ((_this$syncBlocks$get = this.syncBlocks.get(resourceId)) === null || _this$syncBlocks$get === void 0 ? void 0 : _this$syncBlocks$get.sourceLocalId) === localId;
+  }
+  registerConfirmationCallback(callback) {
+    this.confirmationCallback = callback;
+    return () => {
+      this.confirmationCallback = undefined;
+    };
+  }
+  requireConfirmationBeforeDelete() {
+    return !!this.confirmationCallback;
+  }
+  async deleteSyncBlocksWithConfirmation(tr, syncBlockIds) {
+    if (this.confirmationCallback) {
+      const confirmed = await this.confirmationCallback();
+      if (confirmed) {
+        var _this$editorView;
+        // TODO: EDITOR-1779 - "rebase" the transaction to reflect the latest document state
+        (_this$editorView = this.editorView) === null || _this$editorView === void 0 ? void 0 : _this$editorView.dispatch(tr.setMeta('isConfirmedSyncBlockDeletion', true));
+        // Need to update the BE on deletion
+        syncBlockIds.forEach(({
+          resourceId
+        }) => this.syncBlocks.delete(resourceId));
+      }
+    }
+  }
+}

package/dist/es2019/common/types.js

@@ -0,0 +1,2 @@
+import { NodeDataProvider } from '@atlaskit/node-data-provider';
+export class SyncBlockDataProvider extends NodeDataProvider {}

package/dist/es2019/index.js

@@ -0,0 +1,6 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+
+export { SyncBlockProvider as SyncedBlockProvider, useFetchDocNode } from './common/syncBlockProvider';
+export { SyncBlockStoreManager } from './common/syncBlockStoreManager';
+export { inMemoryFetchProvider, inMemoryWriteProvider } from './providers/inMemory';
+export { createSyncBlockNode } from './utils/utils';

package/dist/es2019/providers/inMemory.js

@@ -0,0 +1,20 @@
+const inMemStore = new Map();
+export const inMemoryFetchProvider = {
+  fetchData: resourceId => {
+    return Promise.resolve({
+      content: inMemStore.get(resourceId)
+    });
+  }
+};
+export const inMemoryWriteProvider = {
+  writeData: (_sourceId, _localId, data, resourceId) => {
+    if (resourceId) {
+      inMemStore.set(resourceId, data);
+      return Promise.resolve(resourceId);
+    } else {
+      const uuid = crypto.randomUUID();
+      inMemStore.set(uuid, data);
+      return Promise.resolve(uuid);
+    }
+  }
+};

package/dist/es2019/utils/utils.js

@@ -0,0 +1,13 @@
+import { JSONTransformer } from "@atlaskit/editor-json-transformer";
+export const createSyncBlockNode = (node, includeContent = false) => {
+  const transformer = new JSONTransformer();
+  const toJSON = node => transformer.encodeNode(node);
+  return {
+    type: 'syncBlock',
+    attrs: {
+      localId: node.attrs.localId,
+      resourceId: node.attrs.resourceId
+    },
+    content: includeContent ? node.content.content.map(toJSON) : undefined
+  };
+};

package/dist/esm/common/syncBlockProvider.js

@@ -0,0 +1,85 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import { useEffect, useState } from 'react';
+import { createSyncBlockNode } from '../utils/utils';
+import { SyncBlockDataProvider } from './types';
+export var SyncBlockProvider = /*#__PURE__*/function (_SyncBlockDataProvide) {
+  function SyncBlockProvider(fetchProvider, writeProvider, sourceId) {
+    var _this;
+    _classCallCheck(this, SyncBlockProvider);
+    _this = _callSuper(this, SyncBlockProvider);
+    _defineProperty(_this, "name", 'syncBlockProvider');
+    _defineProperty(_this, "isNodeSupported", function (node) {
+      return node.type === 'syncBlock';
+    });
+    _defineProperty(_this, "nodeDataKey", function (node) {
+      return node.attrs.localId;
+    });
+    _defineProperty(_this, "fetchNodesData", function (nodes) {
+      return Promise.all(nodes.map(function (node) {
+        return _this.fetchProvider.fetchData(node.attrs.resourceId);
+      }));
+    });
+    /**
+     *
+     * @param nodes
+     * @param data
+     *
+     * @returns the resource ids of the nodes that were written
+     */
+    _defineProperty(_this, "writeNodesData", function (nodes, data) {
+      var resourceIds = [];
+      nodes.forEach(function (node, index) {
+        if (!data[index].content) {
+          resourceIds.push(Promise.reject('No Synced Blockcontent to write'));
+          return;
+        }
+        var resourceId = _this.writeProvider.writeData(_this.sourceId, node.attrs.localId, data[index].content, node.attrs.resourceId);
+        resourceIds.push(resourceId);
+      });
+      return Promise.all(resourceIds);
+    });
+    _this.fetchProvider = fetchProvider;
+    _this.writeProvider = writeProvider;
+    _this.sourceId = sourceId;
+    return _this;
+  }
+  _inherits(SyncBlockProvider, _SyncBlockDataProvide);
+  return _createClass(SyncBlockProvider);
+}(SyncBlockDataProvider);
+export var useFetchDocNode = function useFetchDocNode(editorView, node, defaultDocNode, provider) {
+  var _useState = useState(defaultDocNode),
+    _useState2 = _slicedToArray(_useState, 2),
+    docNode = _useState2[0],
+    setDocNode = _useState2[1];
+  useEffect(function () {
+    if (!provider) {
+      return;
+    }
+    var interval = window.setInterval(function () {
+      var nodes = [createSyncBlockNode(node, false)];
+      provider === null || provider === void 0 || provider.fetchNodesData(nodes).then(function (data) {
+        var _data$;
+        if (data && (_data$ = data[0]) !== null && _data$ !== void 0 && _data$.content) {
+          var newNode = editorView.state.schema.nodeFromJSON(data[0].content);
+          setDocNode(_objectSpread(_objectSpread({}, newNode.toJSON()), {}, {
+            version: 1
+          }));
+        }
+      });
+    }, 1000);
+    return function () {
+      window.clearInterval(interval);
+    };
+  }, [editorView, node, provider]);
+  return docNode;
+};

package/dist/esm/common/syncBlockStoreManager.js

@@ -0,0 +1,88 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+// Do this typedef to make it clear that
+// this is a local identifier for a resource for local use
+
+// A store manager responsible for the lifecycle and state management of sync blocks in an editor instance.
+// Supports create, read, update, and delete operations for sync blocks.
+// Designed to manage local in-memory state and synchronize with an external data provider.
+// Handles caching, debouncing updates, and publish/subscribe for local changes.
+// Ensures consistency between local and remote state, and can be used in both editor and renderer contexts.
+export var SyncBlockStoreManager = /*#__PURE__*/function () {
+  function SyncBlockStoreManager(dataProvider) {
+    _classCallCheck(this, SyncBlockStoreManager);
+    this.syncBlocks = new Map();
+    this.dataProvider = dataProvider;
+  }
+  return _createClass(SyncBlockStoreManager, [{
+    key: "setEditorView",
+    value: function setEditorView(editorView) {
+      this.editorView = editorView;
+    }
+  }, {
+    key: "isSourceBlock",
+    value: function isSourceBlock(node) {
+      var _this$syncBlocks$get;
+      if (!this.dataProvider || node.type.name !== 'syncBlock') {
+        return false;
+      }
+      var _node$attrs = node.attrs,
+        resourceId = _node$attrs.resourceId,
+        localId = _node$attrs.localId;
+      return this.syncBlocks.has(resourceId) && ((_this$syncBlocks$get = this.syncBlocks.get(resourceId)) === null || _this$syncBlocks$get === void 0 ? void 0 : _this$syncBlocks$get.sourceLocalId) === localId;
+    }
+  }, {
+    key: "registerConfirmationCallback",
+    value: function registerConfirmationCallback(callback) {
+      var _this = this;
+      this.confirmationCallback = callback;
+      return function () {
+        _this.confirmationCallback = undefined;
+      };
+    }
+  }, {
+    key: "requireConfirmationBeforeDelete",
+    value: function requireConfirmationBeforeDelete() {
+      return !!this.confirmationCallback;
+    }
+  }, {
+    key: "deleteSyncBlocksWithConfirmation",
+    value: function () {
+      var _deleteSyncBlocksWithConfirmation = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(tr, syncBlockIds) {
+        var _this2 = this;
+        var confirmed, _this$editorView;
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              if (!this.confirmationCallback) {
+                _context.next = 5;
+                break;
+              }
+              _context.next = 3;
+              return this.confirmationCallback();
+            case 3:
+              confirmed = _context.sent;
+              if (confirmed) {
+                // TODO: EDITOR-1779 - "rebase" the transaction to reflect the latest document state
+                (_this$editorView = this.editorView) === null || _this$editorView === void 0 || _this$editorView.dispatch(tr.setMeta('isConfirmedSyncBlockDeletion', true));
+                // Need to update the BE on deletion
+                syncBlockIds.forEach(function (_ref) {
+                  var resourceId = _ref.resourceId;
+                  return _this2.syncBlocks.delete(resourceId);
+                });
+              }
+            case 5:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, this);
+      }));
+      function deleteSyncBlocksWithConfirmation(_x, _x2) {
+        return _deleteSyncBlocksWithConfirmation.apply(this, arguments);
+      }
+      return deleteSyncBlocksWithConfirmation;
+    }()
+  }]);
+}();

package/dist/esm/common/types.js

@@ -0,0 +1,16 @@
+import _createClass from "@babel/runtime/helpers/createClass";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/inherits";
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import { NodeDataProvider } from '@atlaskit/node-data-provider';
+export var SyncBlockDataProvider = /*#__PURE__*/function (_NodeDataProvider) {
+  function SyncBlockDataProvider() {
+    _classCallCheck(this, SyncBlockDataProvider);
+    return _callSuper(this, SyncBlockDataProvider, arguments);
+  }
+  _inherits(SyncBlockDataProvider, _NodeDataProvider);
+  return _createClass(SyncBlockDataProvider);
+}(NodeDataProvider);

package/dist/esm/index.js

@@ -0,0 +1,6 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+
+export { SyncBlockProvider as SyncedBlockProvider, useFetchDocNode } from './common/syncBlockProvider';
+export { SyncBlockStoreManager } from './common/syncBlockStoreManager';
+export { inMemoryFetchProvider, inMemoryWriteProvider } from './providers/inMemory';
+export { createSyncBlockNode } from './utils/utils';

package/dist/esm/providers/inMemory.js

@@ -0,0 +1,20 @@
+var inMemStore = new Map();
+export var inMemoryFetchProvider = {
+  fetchData: function fetchData(resourceId) {
+    return Promise.resolve({
+      content: inMemStore.get(resourceId)
+    });
+  }
+};
+export var inMemoryWriteProvider = {
+  writeData: function writeData(_sourceId, _localId, data, resourceId) {
+    if (resourceId) {
+      inMemStore.set(resourceId, data);
+      return Promise.resolve(resourceId);
+    } else {
+      var uuid = crypto.randomUUID();
+      inMemStore.set(uuid, data);
+      return Promise.resolve(uuid);
+    }
+  }
+};

package/dist/esm/utils/utils.js

@@ -0,0 +1,16 @@
+import { JSONTransformer } from "@atlaskit/editor-json-transformer";
+export var createSyncBlockNode = function createSyncBlockNode(node) {
+  var includeContent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  var transformer = new JSONTransformer();
+  var toJSON = function toJSON(node) {
+    return transformer.encodeNode(node);
+  };
+  return {
+    type: 'syncBlock',
+    attrs: {
+      localId: node.attrs.localId,
+      resourceId: node.attrs.resourceId
+    },
+    content: includeContent ? node.content.content.map(toJSON) : undefined
+  };
+};

package/dist/types/common/syncBlockProvider.d.ts

@@ -0,0 +1,24 @@
+import type { DocNode } from '@atlaskit/adf-schema';
+import type { JSONNode } from '@atlaskit/editor-json-transformer/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { SyncBlockDataProvider, type ADFFetchProvider, type ADFWriteProvider, type SyncBlockData, type SyncBlockNode } from './types';
+export declare class SyncBlockProvider extends SyncBlockDataProvider {
+    name: string;
+    private fetchProvider;
+    private writeProvider;
+    private sourceId;
+    constructor(fetchProvider: ADFFetchProvider, writeProvider: ADFWriteProvider, sourceId: string);
+    isNodeSupported: (node: JSONNode) => node is SyncBlockNode;
+    nodeDataKey: (node: SyncBlockNode) => string;
+    fetchNodesData: (nodes: SyncBlockNode[]) => Promise<SyncBlockData[]>;
+    /**
+     *
+     * @param nodes
+     * @param data
+     *
+     * @returns the resource ids of the nodes that were written
+     */
+    writeNodesData: (nodes: SyncBlockNode[], data: SyncBlockData[]) => Promise<Array<string | undefined>>;
+}
+export declare const useFetchDocNode: (editorView: EditorView, node: PMNode, defaultDocNode: DocNode, provider?: SyncBlockProvider) => DocNode;

package/dist/types/common/syncBlockStoreManager.d.ts

@@ -0,0 +1,33 @@
+import type { ADFEntity } from '@atlaskit/adf-utils/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { Transaction } from '@atlaskit/editor-prosemirror/state';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { SyncBlockDataProvider } from './types';
+type ResourceId = string;
+export interface SyncBlock {
+    /**
+     * The local content of the block,
+     * this might or might not be synced with the server
+     */
+    content?: ADFEntity;
+    resourceId: string;
+    sourceLocalId: string;
+}
+type SyncBlockAttrs = {
+    localId: string;
+    resourceId: ResourceId;
+};
+type ConfirmationCallback = () => Promise<boolean>;
+export declare class SyncBlockStoreManager {
+    private syncBlocks;
+    private dataProvider?;
+    private confirmationCallback?;
+    private editorView?;
+    constructor(dataProvider?: SyncBlockDataProvider);
+    setEditorView(editorView: EditorView | undefined): void;
+    isSourceBlock(node: PMNode): boolean;
+    registerConfirmationCallback(callback: ConfirmationCallback): () => void;
+    requireConfirmationBeforeDelete(): boolean;
+    deleteSyncBlocksWithConfirmation(tr: Transaction, syncBlockIds: SyncBlockAttrs[]): Promise<void>;
+}
+export {};

package/dist/types/common/types.d.ts

@@ -0,0 +1,23 @@
+import type { ADFEntity } from '@atlaskit/adf-utils/types';
+import type { JSONNode } from '@atlaskit/editor-json-transformer/types';
+import { NodeDataProvider } from '@atlaskit/node-data-provider';
+export type SyncBlockNode = {
+    attrs: {
+        localId: string;
+        resourceId: string;
+    };
+    content?: Array<JSONNode>;
+    type: 'syncBlock';
+};
+export type SyncBlockData = {
+    content: ADFEntity | undefined;
+};
+export interface ADFFetchProvider {
+    fetchData: (resourceId: string) => Promise<SyncBlockData>;
+}
+export interface ADFWriteProvider {
+    writeData: (sourceId: string, localId: string, data: ADFEntity, resourceId?: string) => Promise<string>;
+}
+export declare abstract class SyncBlockDataProvider extends NodeDataProvider<SyncBlockNode, SyncBlockData> {
+    abstract writeNodesData: (nodes: SyncBlockNode[], data: SyncBlockData[]) => Promise<Array<string | undefined>>;
+}

package/dist/types/index.d.ts

@@ -0,0 +1,5 @@
+export { SyncBlockProvider as SyncedBlockProvider, useFetchDocNode } from './common/syncBlockProvider';
+export { SyncBlockStoreManager } from './common/syncBlockStoreManager';
+export type { SyncBlockDataProvider, ADFFetchProvider, ADFWriteProvider, SyncBlockData, SyncBlockNode } from './common/types';
+export { inMemoryFetchProvider, inMemoryWriteProvider } from './providers/inMemory';
+export { createSyncBlockNode } from './utils/utils';

package/dist/types/providers/inMemory.d.ts

@@ -0,0 +1,3 @@
+import type { ADFFetchProvider, ADFWriteProvider } from '../common/types';
+export declare const inMemoryFetchProvider: ADFFetchProvider;
+export declare const inMemoryWriteProvider: ADFWriteProvider;

package/dist/types/utils/utils.d.ts

@@ -0,0 +1,3 @@
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { SyncBlockNode } from "../common/types";
+export declare const createSyncBlockNode: (node: PMNode, includeContent?: boolean) => SyncBlockNode;

package/dist/types-ts4.5/common/syncBlockProvider.d.ts

@@ -0,0 +1,24 @@
+import type { DocNode } from '@atlaskit/adf-schema';
+import type { JSONNode } from '@atlaskit/editor-json-transformer/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import { SyncBlockDataProvider, type ADFFetchProvider, type ADFWriteProvider, type SyncBlockData, type SyncBlockNode } from './types';
+export declare class SyncBlockProvider extends SyncBlockDataProvider {
+    name: string;
+    private fetchProvider;
+    private writeProvider;
+    private sourceId;
+    constructor(fetchProvider: ADFFetchProvider, writeProvider: ADFWriteProvider, sourceId: string);
+    isNodeSupported: (node: JSONNode) => node is SyncBlockNode;
+    nodeDataKey: (node: SyncBlockNode) => string;
+    fetchNodesData: (nodes: SyncBlockNode[]) => Promise<SyncBlockData[]>;
+    /**
+     *
+     * @param nodes
+     * @param data
+     *
+     * @returns the resource ids of the nodes that were written
+     */
+    writeNodesData: (nodes: SyncBlockNode[], data: SyncBlockData[]) => Promise<Array<string | undefined>>;
+}
+export declare const useFetchDocNode: (editorView: EditorView, node: PMNode, defaultDocNode: DocNode, provider?: SyncBlockProvider) => DocNode;

package/dist/types-ts4.5/common/syncBlockStoreManager.d.ts

@@ -0,0 +1,33 @@
+import type { ADFEntity } from '@atlaskit/adf-utils/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { Transaction } from '@atlaskit/editor-prosemirror/state';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { SyncBlockDataProvider } from './types';
+type ResourceId = string;
+export interface SyncBlock {
+    /**
+     * The local content of the block,
+     * this might or might not be synced with the server
+     */
+    content?: ADFEntity;
+    resourceId: string;
+    sourceLocalId: string;
+}
+type SyncBlockAttrs = {
+    localId: string;
+    resourceId: ResourceId;
+};
+type ConfirmationCallback = () => Promise<boolean>;
+export declare class SyncBlockStoreManager {
+    private syncBlocks;
+    private dataProvider?;
+    private confirmationCallback?;
+    private editorView?;
+    constructor(dataProvider?: SyncBlockDataProvider);
+    setEditorView(editorView: EditorView | undefined): void;
+    isSourceBlock(node: PMNode): boolean;
+    registerConfirmationCallback(callback: ConfirmationCallback): () => void;
+    requireConfirmationBeforeDelete(): boolean;
+    deleteSyncBlocksWithConfirmation(tr: Transaction, syncBlockIds: SyncBlockAttrs[]): Promise<void>;
+}
+export {};

package/dist/types-ts4.5/common/types.d.ts

@@ -0,0 +1,23 @@
+import type { ADFEntity } from '@atlaskit/adf-utils/types';
+import type { JSONNode } from '@atlaskit/editor-json-transformer/types';
+import { NodeDataProvider } from '@atlaskit/node-data-provider';
+export type SyncBlockNode = {
+    attrs: {
+        localId: string;
+        resourceId: string;
+    };
+    content?: Array<JSONNode>;
+    type: 'syncBlock';
+};
+export type SyncBlockData = {
+    content: ADFEntity | undefined;
+};
+export interface ADFFetchProvider {
+    fetchData: (resourceId: string) => Promise<SyncBlockData>;
+}
+export interface ADFWriteProvider {
+    writeData: (sourceId: string, localId: string, data: ADFEntity, resourceId?: string) => Promise<string>;
+}
+export declare abstract class SyncBlockDataProvider extends NodeDataProvider<SyncBlockNode, SyncBlockData> {
+    abstract writeNodesData: (nodes: SyncBlockNode[], data: SyncBlockData[]) => Promise<Array<string | undefined>>;
+}

package/dist/types-ts4.5/index.d.ts

@@ -0,0 +1,5 @@
+export { SyncBlockProvider as SyncedBlockProvider, useFetchDocNode } from './common/syncBlockProvider';
+export { SyncBlockStoreManager } from './common/syncBlockStoreManager';
+export type { SyncBlockDataProvider, ADFFetchProvider, ADFWriteProvider, SyncBlockData, SyncBlockNode } from './common/types';
+export { inMemoryFetchProvider, inMemoryWriteProvider } from './providers/inMemory';
+export { createSyncBlockNode } from './utils/utils';

package/dist/types-ts4.5/providers/inMemory.d.ts

@@ -0,0 +1,3 @@
+import type { ADFFetchProvider, ADFWriteProvider } from '../common/types';
+export declare const inMemoryFetchProvider: ADFFetchProvider;
+export declare const inMemoryWriteProvider: ADFWriteProvider;

package/dist/types-ts4.5/utils/utils.d.ts

@@ -0,0 +1,3 @@
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { SyncBlockNode } from "../common/types";
+export declare const createSyncBlockNode: (node: PMNode, includeContent?: boolean) => SyncBlockNode;

package/package.json

@@ -0,0 +1,91 @@
+{
+	"atlassian": {
+		"team": "Editor: Jenga",
+		"website": {
+			"name": "EditorSyncedBlockProvider",
+			"category": "Layout and structure"
+		}
+	},
+	"repository": "https://stash.atlassian.com/projects/ATLASSIAN/repos/atlassian-frontend-monorepo",
+	"main": "dist/cjs/index.js",
+	"module": "dist/esm/index.js",
+	"module:es2019": "dist/es2019/index.js",
+	"types": "dist/types/index.d.ts",
+	"typesVersions": {
+		">=4.5 <5.9": {
+			"*": [
+				"dist/types-ts4.5/*",
+				"dist/types-ts4.5/index.d.ts"
+			]
+		}
+	},
+	"sideEffects": [
+		"*.compiled.css"
+	],
+	"atlaskit:src": "src/index.ts",
+	"dependencies": {
+		"@atlaskit/adf-schema": "^51.2.0",
+		"@atlaskit/adf-utils": "^19.24.0",
+		"@atlaskit/css": "^0.14.0",
+		"@atlaskit/editor-json-transformer": "^8.30.0",
+		"@atlaskit/editor-prosemirror": "7.0.0",
+		"@atlaskit/node-data-provider": "^6.4.0",
+		"@atlaskit/primitives": "^14.15.0",
+		"@atlaskit/tokens": "^6.3.0",
+		"@babel/runtime": "^7.0.0",
+		"@compiled/react": "^0.18.3"
+	},
+	"peerDependencies": {
+		"react": "^18.2.0"
+	},
+	"devDependencies": {
+		"@af/integration-testing": "workspace:^",
+		"@af/visual-regression": "workspace:^",
+		"@atlaskit/ssr": "workspace:^",
+		"@testing-library/react": "^13.4.0",
+		"react-dom": "^18.2.0"
+	},
+	"techstack": {
+		"@atlassian/frontend": {
+			"import-structure": [
+				"atlassian-conventions"
+			],
+			"circular-dependencies": [
+				"file-and-folder-level"
+			]
+		},
+		"@repo/internal": {
+			"dom-events": "use-bind-event-listener",
+			"analytics": [
+				"analytics-next"
+			],
+			"design-tokens": [
+				"color"
+			],
+			"theming": [
+				"react-context"
+			],
+			"ui-components": [
+				"lite-mode"
+			],
+			"deprecation": [
+				"no-deprecated-imports"
+			],
+			"styling": [
+				"static",
+				"compiled"
+			],
+			"imports": [
+				"import-no-extraneous-disable-for-examples-and-docs"
+			]
+		}
+	},
+	"name": "@atlaskit/editor-synced-block-provider",
+	"version": "0.1.0",
+	"description": "Synced Block Provider for @atlaskit/editor-plugin-synced-block",
+	"author": "Atlassian Pty Ltd",
+	"license": "Apache-2.0",
+	"publishConfig": {
+		"registry": "https://registry.npmjs.org/"
+	}
+}