@atlaskit/editor-plugin-synced-block 0.1.2 → 2.0.0

package/CHANGELOG.md

@@ -1,27 +1,17 @@
 # @atlaskit/editor-plugin-synced-block
 
-## 0.1.2
+## 2.0.0
 
 ### Patch Changes
 
-- [`a2cd8c46a3e94`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a2cd8c46a3e94) -
-  EDITOR-1442 Bump adf-schema
 - Updated dependencies
 
-## 0.1.1
+## 1.0.0
 
-### Patch Changes
-
-- [`7ce112e18ca29`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7ce112e18ca29) -
-  [ux] Copy the sync block reference to clipboard
-- Updated dependencies
-
-## 0.1.0
-
-### Minor Changes
+### Major Changes
 
-- [`c29118e6ca79d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c29118e6ca79d) -
-  ED-28986 create initial version of synced blocks
+- [`168d76bdf8be6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/168d76bdf8be6) -
+  Created new synced-block plugin (scaffolding only)
 
 ### Patch Changes
 

package/afm-cc/tsconfig.json

@@ -22,21 +22,6 @@
 		"../src/**/stories/**/*"
 	],
 	"references": [
-		{
-			"path": "../../adf-utils/afm-cc/tsconfig.json"
-		},
-		{
-			"path": "../../editor-json-transformer/afm-cc/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/icon/afm-cc/tsconfig.json"
-		},
-		{
-			"path": "../../renderer/afm-cc/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/tokens/afm-cc/tsconfig.json"
-		},
 		{
 			"path": "../../editor-common/afm-cc/tsconfig.json"
 		}

package/afm-dev-agents/tsconfig.json

@@ -22,21 +22,6 @@
 		"../src/**/stories/**/*"
 	],
 	"references": [
-		{
-			"path": "../../adf-utils/afm-dev-agents/tsconfig.json"
-		},
-		{
-			"path": "../../editor-json-transformer/afm-dev-agents/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/icon/afm-dev-agents/tsconfig.json"
-		},
-		{
-			"path": "../../renderer/afm-dev-agents/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/tokens/afm-dev-agents/tsconfig.json"
-		},
 		{
 			"path": "../../editor-common/afm-dev-agents/tsconfig.json"
 		}

package/afm-jira/tsconfig.json

@@ -22,21 +22,6 @@
 		"../src/**/stories/**/*"
 	],
 	"references": [
-		{
-			"path": "../../adf-utils/afm-jira/tsconfig.json"
-		},
-		{
-			"path": "../../editor-json-transformer/afm-jira/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/icon/afm-jira/tsconfig.json"
-		},
-		{
-			"path": "../../renderer/afm-jira/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/tokens/afm-jira/tsconfig.json"
-		},
 		{
 			"path": "../../editor-common/afm-jira/tsconfig.json"
 		}

package/afm-passionfruit/tsconfig.json

@@ -22,21 +22,6 @@
 		"../src/**/stories/**/*"
 	],
 	"references": [
-		{
-			"path": "../../adf-utils/afm-passionfruit/tsconfig.json"
-		},
-		{
-			"path": "../../editor-json-transformer/afm-passionfruit/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/icon/afm-passionfruit/tsconfig.json"
-		},
-		{
-			"path": "../../renderer/afm-passionfruit/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/tokens/afm-passionfruit/tsconfig.json"
-		},
 		{
 			"path": "../../editor-common/afm-passionfruit/tsconfig.json"
 		}

package/afm-post-office/tsconfig.json

@@ -22,21 +22,6 @@
 		"../src/**/stories/**/*"
 	],
 	"references": [
-		{
-			"path": "../../adf-utils/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../editor-json-transformer/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/icon/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../renderer/afm-post-office/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/tokens/afm-post-office/tsconfig.json"
-		},
 		{
 			"path": "../../editor-common/afm-post-office/tsconfig.json"
 		}

package/afm-rovo-extension/tsconfig.json

@@ -22,21 +22,6 @@
 		"../src/**/stories/**/*"
 	],
 	"references": [
-		{
-			"path": "../../adf-utils/afm-rovo-extension/tsconfig.json"
-		},
-		{
-			"path": "../../editor-json-transformer/afm-rovo-extension/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/icon/afm-rovo-extension/tsconfig.json"
-		},
-		{
-			"path": "../../renderer/afm-rovo-extension/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/tokens/afm-rovo-extension/tsconfig.json"
-		},
 		{
 			"path": "../../editor-common/afm-rovo-extension/tsconfig.json"
 		}

package/afm-townsquare/tsconfig.json

@@ -22,21 +22,6 @@
 		"../src/**/stories/**/*"
 	],
 	"references": [
-		{
-			"path": "../../adf-utils/afm-townsquare/tsconfig.json"
-		},
-		{
-			"path": "../../editor-json-transformer/afm-townsquare/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/icon/afm-townsquare/tsconfig.json"
-		},
-		{
-			"path": "../../renderer/afm-townsquare/tsconfig.json"
-		},
-		{
-			"path": "../../../design-system/tokens/afm-townsquare/tsconfig.json"
-		},
 		{
 			"path": "../../editor-common/afm-townsquare/tsconfig.json"
 		}

package/dist/cjs/nodeviews/syncedBlock.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getSyncedBlockNodeView = void 0;
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var SyncedBlockNodeView = /*#__PURE__*/(0, _createClass2.default)(function SyncedBlockNodeView(node, view, getPos) {
+  (0, _classCallCheck2.default)(this, SyncedBlockNodeView);
+  this.node = node;
+  this.view = view;
+  this.getPos = getPos;
+});
+var getSyncedBlockNodeView = exports.getSyncedBlockNodeView = function getSyncedBlockNodeView() {
+  return function (node, view, getPos) {
+    return new SyncedBlockNodeView(node, view, getPos);
+  };
+};

package/dist/cjs/pm-plugins/main.js

@@ -6,14 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 exports.syncedBlockPluginKey = exports.createPlugin = void 0;
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _state = require("@atlaskit/editor-prosemirror/state");
-var _SyncClient = require("./SyncClient");
-var _utils = require("./utils");
 var syncedBlockPluginKey = exports.syncedBlockPluginKey = new _state.PluginKey('syncedBlockPlugin');
 
 // eslint-disable-next-line @typescript-eslint/no-empty-object-type
 
 var createPlugin = exports.createPlugin = function createPlugin() {
-  var syncClient = new _SyncClient.SyncClient();
   return new _safePlugin.SafePlugin({
     key: syncedBlockPluginKey,
     state: {
@@ -21,24 +18,6 @@ var createPlugin = exports.createPlugin = function createPlugin() {
         return {};
       },
       apply: function apply(tr, currentPluginState) {
-        if (tr.docChanged) {
-          var $pos = tr.selection.$from;
-          var syncedBlockParent = (0, _utils.findSyncedBlockParent)($pos);
-          if (syncedBlockParent) {
-            var node = syncedBlockParent.node,
-              attributes = syncedBlockParent.attributes;
-            var _attributes$parameter = attributes.parameters,
-              sourceDocumentAri = _attributes$parameter.sourceDocumentAri,
-              contentAri = _attributes$parameter.contentAri,
-              contentPropertyKey = _attributes$parameter.contentPropertyKey;
-            syncClient.syncContent({
-              sourceDocumentAri: sourceDocumentAri,
-              contentAri: contentAri,
-              contentPropertyKey: contentPropertyKey,
-              node: node
-            });
-          }
-        }
         var meta = tr.getMeta(syncedBlockPluginKey);
         if (meta) {
           return meta;

package/dist/cjs/syncedBlockPlugin.js

@@ -1,24 +1,28 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.syncedBlockPlugin = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _syncedBlock = require("./nodeviews/syncedBlock");
 var _main = require("./pm-plugins/main");
-var _GlobalStyles = require("./ui/extensions/synced-block/components/GlobalStyles");
+var _floatingToolbar = require("./ui/floating-toolbar");
 var syncedBlockPlugin = exports.syncedBlockPlugin = function syncedBlockPlugin() {
   return {
     name: 'syncedBlock',
+    props: {
+      nodeViews: {
+        syncedBlock: (0, _syncedBlock.getSyncedBlockNodeView)()
+      }
+    },
     pmPlugins: function pmPlugins() {
       return [{
         name: 'syncedBlockPlugin',
         plugin: _main.createPlugin
       }];
     },
-    contentComponent: function contentComponent() {
-      return /*#__PURE__*/_react.default.createElement(_GlobalStyles.GlobalStylesWrapper, null);
+    pluginsOptions: {
+      floatingToolbar: (0, _floatingToolbar.getToolbarConfig)()
     }
   };
 };

package/dist/cjs/ui/floating-toolbar.js

@@ -0,0 +1,39 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getToolbarConfig = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var basicButton = function basicButton(formatMessage) {
+  return [{
+    id: 'placeholder',
+    type: 'button',
+    onClick: function onClick() {
+      return true;
+    },
+    title: formatMessage({
+      id: 'placeholder',
+      defaultMessage: 'Message',
+      description: 'Placeholder description.'
+    })
+  }];
+};
+var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig() {
+  return function (state, intl) {
+    var formatMessage = intl.formatMessage;
+
+    // placeholder nodeType
+    var nodeType = [state.schema.nodes.paragraph];
+    var basicButtonArray = basicButton(formatMessage);
+    return {
+      title: 'Floating controls',
+      nodeType: nodeType,
+      items: [].concat((0, _toConsumableArray2.default)(basicButtonArray), [{
+        type: 'separator'
+      }]),
+      scrollable: true
+    };
+  };
+};

package/dist/es2019/nodeviews/syncedBlock.js

@@ -0,0 +1,10 @@
+class SyncedBlockNodeView {
+  constructor(node, view, getPos) {
+    this.node = node;
+    this.view = view;
+    this.getPos = getPos;
+  }
+}
+export const getSyncedBlockNodeView = () => (node, view, getPos) => {
+  return new SyncedBlockNodeView(node, view, getPos);
+};

package/dist/es2019/pm-plugins/main.js

@@ -1,13 +1,10 @@
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
-import { SyncClient } from './SyncClient';
-import { findSyncedBlockParent } from './utils';
 export const syncedBlockPluginKey = new PluginKey('syncedBlockPlugin');
 
 // eslint-disable-next-line @typescript-eslint/no-empty-object-type
 
 export const createPlugin = () => {
-  const syncClient = new SyncClient();
   return new SafePlugin({
     key: syncedBlockPluginKey,
     state: {
@@ -15,27 +12,6 @@ export const createPlugin = () => {
         return {};
       },
       apply: (tr, currentPluginState) => {
-        if (tr.docChanged) {
-          const $pos = tr.selection.$from;
-          const syncedBlockParent = findSyncedBlockParent($pos);
-          if (syncedBlockParent) {
-            const {
-              node,
-              attributes
-            } = syncedBlockParent;
-            const {
-              sourceDocumentAri,
-              contentAri,
-              contentPropertyKey
-            } = attributes.parameters;
-            syncClient.syncContent({
-              sourceDocumentAri,
-              contentAri,
-              contentPropertyKey,
-              node
-            });
-          }
-        }
         const meta = tr.getMeta(syncedBlockPluginKey);
         if (meta) {
           return meta;

package/dist/es2019/syncedBlockPlugin.js

@@ -1,17 +1,20 @@
-import React from 'react';
+import { getSyncedBlockNodeView } from './nodeviews/syncedBlock';
 import { createPlugin } from './pm-plugins/main';
-import { GlobalStylesWrapper } from './ui/extensions/synced-block/components/GlobalStyles';
-export const syncedBlockPlugin = () => {
-  return {
-    name: 'syncedBlock',
-    pmPlugins() {
-      return [{
-        name: 'syncedBlockPlugin',
-        plugin: createPlugin
-      }];
-    },
-    contentComponent() {
-      return /*#__PURE__*/React.createElement(GlobalStylesWrapper, null);
+import { getToolbarConfig } from './ui/floating-toolbar';
+export const syncedBlockPlugin = () => ({
+  name: 'syncedBlock',
+  props: {
+    nodeViews: {
+      syncedBlock: getSyncedBlockNodeView()
     }
-  };
-};
+  },
+  pmPlugins() {
+    return [{
+      name: 'syncedBlockPlugin',
+      plugin: createPlugin
+    }];
+  },
+  pluginsOptions: {
+    floatingToolbar: getToolbarConfig()
+  }
+});

package/dist/es2019/ui/floating-toolbar.js

@@ -0,0 +1,31 @@
+const basicButton = formatMessage => {
+  return [{
+    id: 'placeholder',
+    type: 'button',
+    onClick: () => {
+      return true;
+    },
+    title: formatMessage({
+      id: 'placeholder',
+      defaultMessage: 'Message',
+      description: 'Placeholder description.'
+    })
+  }];
+};
+export const getToolbarConfig = () => (state, intl) => {
+  const {
+    formatMessage
+  } = intl;
+
+  // placeholder nodeType
+  const nodeType = [state.schema.nodes.paragraph];
+  const basicButtonArray = basicButton(formatMessage);
+  return {
+    title: 'Floating controls',
+    nodeType,
+    items: [...basicButtonArray, {
+      type: 'separator'
+    }],
+    scrollable: true
+  };
+};

package/dist/esm/nodeviews/syncedBlock.js

@@ -0,0 +1,13 @@
+import _createClass from "@babel/runtime/helpers/createClass";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+var SyncedBlockNodeView = /*#__PURE__*/_createClass(function SyncedBlockNodeView(node, view, getPos) {
+  _classCallCheck(this, SyncedBlockNodeView);
+  this.node = node;
+  this.view = view;
+  this.getPos = getPos;
+});
+export var getSyncedBlockNodeView = function getSyncedBlockNodeView() {
+  return function (node, view, getPos) {
+    return new SyncedBlockNodeView(node, view, getPos);
+  };
+};

package/dist/esm/pm-plugins/main.js

@@ -1,13 +1,10 @@
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
-import { SyncClient } from './SyncClient';
-import { findSyncedBlockParent } from './utils';
 export var syncedBlockPluginKey = new PluginKey('syncedBlockPlugin');
 
 // eslint-disable-next-line @typescript-eslint/no-empty-object-type
 
 export var createPlugin = function createPlugin() {
-  var syncClient = new SyncClient();
   return new SafePlugin({
     key: syncedBlockPluginKey,
     state: {
@@ -15,24 +12,6 @@ export var createPlugin = function createPlugin() {
         return {};
       },
       apply: function apply(tr, currentPluginState) {
-        if (tr.docChanged) {
-          var $pos = tr.selection.$from;
-          var syncedBlockParent = findSyncedBlockParent($pos);
-          if (syncedBlockParent) {
-            var node = syncedBlockParent.node,
-              attributes = syncedBlockParent.attributes;
-            var _attributes$parameter = attributes.parameters,
-              sourceDocumentAri = _attributes$parameter.sourceDocumentAri,
-              contentAri = _attributes$parameter.contentAri,
-              contentPropertyKey = _attributes$parameter.contentPropertyKey;
-            syncClient.syncContent({
-              sourceDocumentAri: sourceDocumentAri,
-              contentAri: contentAri,
-              contentPropertyKey: contentPropertyKey,
-              node: node
-            });
-          }
-        }
         var meta = tr.getMeta(syncedBlockPluginKey);
         if (meta) {
           return meta;

package/dist/esm/syncedBlockPlugin.js

@@ -1,17 +1,22 @@
-import React from 'react';
+import { getSyncedBlockNodeView } from './nodeviews/syncedBlock';
 import { createPlugin } from './pm-plugins/main';
-import { GlobalStylesWrapper } from './ui/extensions/synced-block/components/GlobalStyles';
+import { getToolbarConfig } from './ui/floating-toolbar';
 export var syncedBlockPlugin = function syncedBlockPlugin() {
   return {
     name: 'syncedBlock',
+    props: {
+      nodeViews: {
+        syncedBlock: getSyncedBlockNodeView()
+      }
+    },
     pmPlugins: function pmPlugins() {
       return [{
         name: 'syncedBlockPlugin',
         plugin: createPlugin
       }];
     },
-    contentComponent: function contentComponent() {
-      return /*#__PURE__*/React.createElement(GlobalStylesWrapper, null);
+    pluginsOptions: {
+      floatingToolbar: getToolbarConfig()
     }
   };
 };

package/dist/esm/ui/floating-toolbar.js

@@ -0,0 +1,32 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+var basicButton = function basicButton(formatMessage) {
+  return [{
+    id: 'placeholder',
+    type: 'button',
+    onClick: function onClick() {
+      return true;
+    },
+    title: formatMessage({
+      id: 'placeholder',
+      defaultMessage: 'Message',
+      description: 'Placeholder description.'
+    })
+  }];
+};
+export var getToolbarConfig = function getToolbarConfig() {
+  return function (state, intl) {
+    var formatMessage = intl.formatMessage;
+
+    // placeholder nodeType
+    var nodeType = [state.schema.nodes.paragraph];
+    var basicButtonArray = basicButton(formatMessage);
+    return {
+      title: 'Floating controls',
+      nodeType: nodeType,
+      items: [].concat(_toConsumableArray(basicButtonArray), [{
+        type: 'separator'
+      }]),
+      scrollable: true
+    };
+  };
+};

package/dist/types/index.d.ts

@@ -1,3 +1,2 @@
 export { syncedBlockPlugin } from './syncedBlockPlugin';
 export type { SyncedBlockPlugin } from './syncedBlockPluginType';
-export type { SyncedBlockPluginOptions } from './types';

package/dist/types/nodeviews/syncedBlock.d.ts

@@ -0,0 +1,11 @@
+import type { getPosHandler, getPosHandlerNode } from '@atlaskit/editor-common/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+declare class SyncedBlockNodeView {
+    node: PMNode;
+    view: EditorView;
+    getPos: getPosHandlerNode;
+    constructor(node: PMNode, view: EditorView, getPos: getPosHandlerNode);
+}
+export declare const getSyncedBlockNodeView: () => (node: PMNode, view: EditorView, getPos: getPosHandler) => SyncedBlockNodeView;
+export {};

package/dist/types/ui/floating-toolbar.d.ts

@@ -0,0 +1,2 @@
+import type { FloatingToolbarHandler } from '@atlaskit/editor-common/types';
+export declare const getToolbarConfig: () => FloatingToolbarHandler;

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

@@ -1,3 +1,2 @@
 export { syncedBlockPlugin } from './syncedBlockPlugin';
 export type { SyncedBlockPlugin } from './syncedBlockPluginType';
-export type { SyncedBlockPluginOptions } from './types';

package/dist/types-ts4.5/nodeviews/syncedBlock.d.ts

@@ -0,0 +1,11 @@
+import type { getPosHandler, getPosHandlerNode } from '@atlaskit/editor-common/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+declare class SyncedBlockNodeView {
+    node: PMNode;
+    view: EditorView;
+    getPos: getPosHandlerNode;
+    constructor(node: PMNode, view: EditorView, getPos: getPosHandlerNode);
+}
+export declare const getSyncedBlockNodeView: () => (node: PMNode, view: EditorView, getPos: getPosHandler) => SyncedBlockNodeView;
+export {};

package/dist/types-ts4.5/ui/floating-toolbar.d.ts

@@ -0,0 +1,2 @@
+import type { FloatingToolbarHandler } from '@atlaskit/editor-common/types';
+export declare const getToolbarConfig: () => FloatingToolbarHandler;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-synced-block",
-	"version": "0.1.2",
+	"version": "2.0.0",
 	"description": "SyncedBlock plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -28,18 +28,12 @@
 	"sideEffects": false,
 	"atlaskit:src": "src/index.ts",
 	"dependencies": {
-		"@atlaskit/adf-schema": "^50.2.3",
-		"@atlaskit/adf-utils": "^19.21.0",
-		"@atlaskit/editor-json-transformer": "^8.27.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
-		"@atlaskit/icon": "^28.1.0",
-		"@atlaskit/renderer": "^120.5.0",
-		"@atlaskit/tokens": "^6.1.0",
 		"@babel/runtime": "^7.0.0",
-		"@emotion/react": "^11.7.1"
+		"react-intl-next": "npm:react-intl@^5.18.1"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^107.33.0",
+		"@atlaskit/editor-common": "^109.0.0",
 		"react": "^18.2.0"
 	},
 	"devDependencies": {

package/SyncedBlock/package.json

@@ -1,15 +0,0 @@
-{
-  "name": "@atlaskit/editor-plugin-synced-block/SyncedBlock",
-  "main": "../dist/cjs/ui/extensions/synced-block/index.js",
-  "module": "../dist/esm/ui/extensions/synced-block/index.js",
-  "module:es2019": "../dist/es2019/ui/extensions/synced-block/index.js",
-  "sideEffects": false,
-  "types": "../dist/types/ui/extensions/synced-block/index.d.ts",
-  "typesVersions": {
-    ">=4.5 <5.9": {
-      "*": [
-        "../dist/types-ts4.5/ui/extensions/synced-block/index.d.ts"
-      ]
-    }
-  }
-}