@atlaskit/editor-plugin-synced-block 4.5.0 → 4.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/afm-cc/tsconfig.json +3 -0
  3. package/dist/cjs/editor-commands/index.js +19 -5
  4. package/dist/cjs/pm-plugins/main.js +24 -18
  5. package/dist/cjs/syncedBlockPlugin.js +1 -1
  6. package/dist/cjs/types/index.js +1 -0
  7. package/dist/cjs/ui/Flag.js +49 -14
  8. package/dist/cjs/ui/floating-toolbar.js +1 -1
  9. package/dist/cjs/ui/toolbar-components.js +9 -29
  10. package/dist/es2019/editor-commands/index.js +20 -5
  11. package/dist/es2019/pm-plugins/main.js +24 -17
  12. package/dist/es2019/syncedBlockPlugin.js +1 -1
  13. package/dist/es2019/types/index.js +1 -0
  14. package/dist/es2019/ui/Flag.js +50 -14
  15. package/dist/es2019/ui/floating-toolbar.js +1 -1
  16. package/dist/es2019/ui/toolbar-components.js +9 -31
  17. package/dist/esm/editor-commands/index.js +19 -5
  18. package/dist/esm/pm-plugins/main.js +24 -18
  19. package/dist/esm/syncedBlockPlugin.js +1 -1
  20. package/dist/esm/types/index.js +1 -0
  21. package/dist/esm/ui/Flag.js +50 -15
  22. package/dist/esm/ui/floating-toolbar.js +1 -1
  23. package/dist/esm/ui/toolbar-components.js +10 -30
  24. package/dist/types/editor-commands/index.d.ts +2 -2
  25. package/dist/types/types/index.d.ts +2 -1
  26. package/dist/types-ts4.5/editor-commands/index.d.ts +2 -2
  27. package/dist/types-ts4.5/types/index.d.ts +2 -1
  28. package/package.json +2 -1
  29. package/dist/cjs/ui/CreateSyncedBlockItem.js +0 -53
  30. package/dist/cjs/ui/OverflowMenuSection.js +0 -20
  31. package/dist/es2019/ui/CreateSyncedBlockItem.js +0 -46
  32. package/dist/es2019/ui/OverflowMenuSection.js +0 -15
  33. package/dist/esm/ui/CreateSyncedBlockItem.js +0 -44
  34. package/dist/esm/ui/OverflowMenuSection.js +0 -13
  35. package/dist/types/ui/CreateSyncedBlockItem.d.ts +0 -8
  36. package/dist/types/ui/OverflowMenuSection.d.ts +0 -6
  37. package/dist/types-ts4.5/ui/CreateSyncedBlockItem.d.ts +0 -8
  38. package/dist/types-ts4.5/ui/OverflowMenuSection.d.ts +0 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # @atlaskit/editor-plugin-synced-block
2
2
 
3
+ ## 4.5.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`ccab9e988fb9e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ccab9e988fb9e) -
8
+ EDITOR-3852 show a flag on synced block reference copy
9
+ - [`f2ec7c28a69da`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f2ec7c28a69da) -
10
+ Remove Synced Block button from selection toolbar and update position in pinned toolbar
11
+ - Updated dependencies
12
+
3
13
  ## 4.5.0
4
14
 
5
15
  ### Minor Changes
@@ -80,6 +80,9 @@
80
80
  {
81
81
  "path": "../../../design-system/primitives/afm-cc/tsconfig.json"
82
82
  },
83
+ {
84
+ "path": "../../tmp-editor-statsig/afm-cc/tsconfig.json"
85
+ },
83
86
  {
84
87
  "path": "../../../design-system/tokens/afm-cc/tsconfig.json"
85
88
  },
@@ -8,7 +8,9 @@ var _analytics = require("@atlaskit/editor-common/analytics");
8
8
  var _copyButton = require("@atlaskit/editor-common/copy-button");
9
9
  var _state = require("@atlaskit/editor-prosemirror/state");
10
10
  var _utils = require("@atlaskit/editor-prosemirror/utils");
11
+ var _main = require("../pm-plugins/main");
11
12
  var _utils2 = require("../pm-plugins/utils/utils");
13
+ var _types = require("../types");
12
14
  var createSyncedBlock = exports.createSyncedBlock = function createSyncedBlock(_ref) {
13
15
  var tr = _ref.tr,
14
16
  syncBlockStore = _ref.syncBlockStore,
@@ -59,21 +61,21 @@ var createSyncedBlock = exports.createSyncedBlock = function createSyncedBlock(_
59
61
  // see filterTransaction for more details
60
62
  return tr;
61
63
  };
62
- var copySyncedBlockReferenceToClipboardEditorCommand = exports.copySyncedBlockReferenceToClipboardEditorCommand = function copySyncedBlockReferenceToClipboardEditorCommand(syncBlockStore) {
64
+ var copySyncedBlockReferenceToClipboardEditorCommand = exports.copySyncedBlockReferenceToClipboardEditorCommand = function copySyncedBlockReferenceToClipboardEditorCommand(syncBlockStore, api) {
63
65
  return function (_ref2) {
64
66
  var tr = _ref2.tr;
65
- if (copySyncedBlockReferenceToClipboardInternal(tr.doc.type.schema, tr.selection, syncBlockStore)) {
67
+ if (copySyncedBlockReferenceToClipboardInternal(tr.doc.type.schema, tr.selection, syncBlockStore, api)) {
66
68
  return tr;
67
69
  }
68
70
  return null;
69
71
  };
70
72
  };
71
- var copySyncedBlockReferenceToClipboard = exports.copySyncedBlockReferenceToClipboard = function copySyncedBlockReferenceToClipboard(syncBlockStore) {
73
+ var copySyncedBlockReferenceToClipboard = exports.copySyncedBlockReferenceToClipboard = function copySyncedBlockReferenceToClipboard(syncBlockStore, api) {
72
74
  return function (state, _dispatch, _view) {
73
- return copySyncedBlockReferenceToClipboardInternal(state.tr.doc.type.schema, state.tr.selection, syncBlockStore);
75
+ return copySyncedBlockReferenceToClipboardInternal(state.tr.doc.type.schema, state.tr.selection, syncBlockStore, api);
74
76
  };
75
77
  };
76
- var copySyncedBlockReferenceToClipboardInternal = function copySyncedBlockReferenceToClipboardInternal(schema, selection, syncBlockStore) {
78
+ var copySyncedBlockReferenceToClipboardInternal = function copySyncedBlockReferenceToClipboardInternal(schema, selection, syncBlockStore, api) {
77
79
  var syncBlockFindResult = (0, _utils2.findSyncBlockOrBodiedSyncBlock)(schema, selection);
78
80
  if (!syncBlockFindResult) {
79
81
  return false;
@@ -98,6 +100,18 @@ var copySyncedBlockReferenceToClipboardInternal = function copySyncedBlockRefere
98
100
  }
99
101
  var domNode = (0, _copyButton.toDOM)(referenceSyncBlockNode, schema);
100
102
  (0, _copyButton.copyDomNode)(domNode, referenceSyncBlockNode.type, selection);
103
+
104
+ // Use setTimeout to dispatch transaction in next tick and avoid re-entrant dispatch
105
+ setTimeout(function () {
106
+ api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
107
+ var tr = _ref3.tr;
108
+ return tr.setMeta(_main.syncedBlockPluginKey, {
109
+ activeFlag: {
110
+ id: _types.FLAG_ID.SYNC_BLOCK_COPIED
111
+ }
112
+ });
113
+ });
114
+ }, 0);
101
115
  return true;
102
116
  };
103
117
  var editSyncedBlockSource = exports.editSyncedBlockSource = function editSyncedBlockSource(syncBlockStore, api) {
@@ -118,27 +118,33 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pmPlugi
118
118
  var pluginState = syncedBlockPluginKey.getState(state);
119
119
  var syncBlockStore = pluginState === null || pluginState === void 0 ? void 0 : pluginState.syncBlockStore;
120
120
  var schema = state.schema;
121
+ // Use setTimeout to dispatch transaction in next tick and avoid re-entrant dispatch
122
+ setTimeout(function () {
123
+ api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
124
+ var tr = _ref3.tr;
125
+ return tr.setMeta(syncedBlockPluginKey, {
126
+ activeFlag: {
127
+ id: _types.FLAG_ID.SYNC_BLOCK_COPIED
128
+ }
129
+ });
130
+ });
131
+ }, 0);
121
132
  if (!syncBlockStore) {
122
133
  return slice;
123
134
  }
124
135
  return (0, _utils.mapSlice)(slice, function (node) {
125
136
  if (node.type.name === 'bodiedSyncBlock' && node.attrs.resourceId) {
126
- try {
127
- var newResourceId = syncBlockStore.referenceManager.generateResourceIdForReference(node.attrs.resourceId);
128
- // Convert bodiedSyncBlock to syncBlock
129
- // The paste transformation will regenrate the localId
130
- var newAttrs = _objectSpread(_objectSpread({}, node.attrs), {}, {
131
- resourceId: newResourceId
132
- });
133
- var newMarks = schema.nodes.syncBlock.markSet ? node.marks.filter(function (mark) {
134
- var _schema$nodes$syncBlo;
135
- return (_schema$nodes$syncBlo = schema.nodes.syncBlock.markSet) === null || _schema$nodes$syncBlo === void 0 ? void 0 : _schema$nodes$syncBlo.includes(mark.type);
136
- }) : node.marks;
137
- return schema.nodes.syncBlock.create(newAttrs, null, newMarks);
138
- } catch (error) {
139
- // If generateResourceIdForReference died, return the original node
140
- return node;
141
- }
137
+ var newResourceId = syncBlockStore.referenceManager.generateResourceIdForReference(node.attrs.resourceId);
138
+ // Convert bodiedSyncBlock to syncBlock
139
+ // The paste transformation will regenrate the localId
140
+ var newAttrs = _objectSpread(_objectSpread({}, node.attrs), {}, {
141
+ resourceId: newResourceId
142
+ });
143
+ var newMarks = schema.nodes.syncBlock.markSet ? node.marks.filter(function (mark) {
144
+ var _schema$nodes$syncBlo;
145
+ return (_schema$nodes$syncBlo = schema.nodes.syncBlock.markSet) === null || _schema$nodes$syncBlo === void 0 ? void 0 : _schema$nodes$syncBlo.includes(mark.type);
146
+ }) : node.marks;
147
+ return schema.nodes.syncBlock.create(newAttrs, null, newMarks);
142
148
  }
143
149
  return node;
144
150
  });
@@ -202,8 +208,8 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pmPlugi
202
208
  if (errorFlag) {
203
209
  // Use setTimeout to dispatch transaction in next tick and avoid re-entrant dispatch
204
210
  setTimeout(function () {
205
- api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
206
- var tr = _ref3.tr;
211
+ api === null || api === void 0 || api.core.actions.execute(function (_ref4) {
212
+ var tr = _ref4.tr;
207
213
  return tr.setMeta(syncedBlockPluginKey, {
208
214
  activeFlag: {
209
215
  id: errorFlag
@@ -48,7 +48,7 @@ var syncedBlockPlugin = exports.syncedBlockPlugin = function syncedBlockPlugin(_
48
48
  },
49
49
  commands: {
50
50
  copySyncedBlockReferenceToClipboard: function copySyncedBlockReferenceToClipboard() {
51
- return (0, _editorCommands.copySyncedBlockReferenceToClipboardEditorCommand)(syncBlockStore);
51
+ return (0, _editorCommands.copySyncedBlockReferenceToClipboardEditorCommand)(syncBlockStore, api);
52
52
  },
53
53
  insertSyncedBlock: function insertSyncedBlock() {
54
54
  return function (_ref2) {
@@ -9,5 +9,6 @@ var FLAG_ID = exports.FLAG_ID = /*#__PURE__*/function (FLAG_ID) {
9
9
  FLAG_ID["CANNOT_EDIT_WHEN_OFFLINE"] = "cannot-edit-when-offline";
10
10
  FLAG_ID["CANNOT_CREATE_WHEN_OFFLINE"] = "cannot-create-when-offline";
11
11
  FLAG_ID["FAIL_TO_DELETE"] = "fail-to-delete";
12
+ FLAG_ID["SYNC_BLOCK_COPIED"] = "sync-block-copied";
12
13
  return FLAG_ID;
13
14
  }({});
@@ -12,24 +12,34 @@ var _reactIntlNext = require("react-intl-next");
12
12
  var _hooks = require("@atlaskit/editor-common/hooks");
13
13
  var _messages = require("@atlaskit/editor-common/messages");
14
14
  var _flag = _interopRequireWildcard(require("@atlaskit/flag"));
15
+ var _image = _interopRequireDefault(require("@atlaskit/icon/core/image"));
15
16
  var _statusWarning = _interopRequireDefault(require("@atlaskit/icon/core/status-warning"));
16
17
  var _main = require("../pm-plugins/main");
17
18
  var _types = require("../types");
18
19
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
19
20
  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; }
20
21
  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; }
21
- var flagMap = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _types.FLAG_ID.CANNOT_DELETE_WHEN_OFFLINE, {
22
+ var flagMap = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _types.FLAG_ID.CANNOT_DELETE_WHEN_OFFLINE, {
22
23
  title: _messages.syncBlockMessages.failToDeleteTitle,
23
- description: _messages.syncBlockMessages.failToDeleteWhenOfflineDescription
24
+ description: _messages.syncBlockMessages.failToDeleteWhenOfflineDescription,
25
+ type: 'error'
24
26
  }), _types.FLAG_ID.CANNOT_EDIT_WHEN_OFFLINE, {
25
27
  title: _messages.syncBlockMessages.failToEditTitle,
26
- description: _messages.syncBlockMessages.failToEditWhenOfflineDescription
28
+ description: _messages.syncBlockMessages.failToEditWhenOfflineDescription,
29
+ type: 'error'
27
30
  }), _types.FLAG_ID.CANNOT_CREATE_WHEN_OFFLINE, {
28
31
  title: _messages.syncBlockMessages.failToCreateTitle,
29
- description: _messages.syncBlockMessages.failToCreateWhenOfflineDescription
32
+ description: _messages.syncBlockMessages.failToCreateWhenOfflineDescription,
33
+ type: 'error'
30
34
  }), _types.FLAG_ID.FAIL_TO_DELETE, {
31
35
  title: _messages.syncBlockMessages.cannotDeleteTitle,
32
- description: _messages.syncBlockMessages.cannotDeleteDescription
36
+ description: _messages.syncBlockMessages.cannotDeleteDescription,
37
+ type: 'error'
38
+ }), _types.FLAG_ID.SYNC_BLOCK_COPIED, {
39
+ title: _messages.syncBlockMessages.syncBlockCopiedTitle,
40
+ description: _messages.syncBlockMessages.syncBlockCopiedDescription,
41
+ action: _messages.syncBlockMessages.syncBlockCopiedAction,
42
+ type: 'info'
33
43
  });
34
44
  var Flag = exports.Flag = function Flag(_ref) {
35
45
  var api = _ref.api;
@@ -49,7 +59,9 @@ var Flag = exports.Flag = function Flag(_ref) {
49
59
  }
50
60
  var _flagMap$activeFlag$i = flagMap[activeFlag.id],
51
61
  title = _flagMap$activeFlag$i.title,
52
- description = _flagMap$activeFlag$i.description;
62
+ description = _flagMap$activeFlag$i.description,
63
+ action = _flagMap$activeFlag$i.action,
64
+ type = _flagMap$activeFlag$i.type;
53
65
  var onRetry = activeFlag.onRetry,
54
66
  onDismissedCallback = activeFlag.onDismissed;
55
67
 
@@ -76,19 +88,42 @@ var Flag = exports.Flag = function Flag(_ref) {
76
88
  });
77
89
  api === null || api === void 0 || api.core.actions.focus();
78
90
  };
79
- return /*#__PURE__*/_react.default.createElement(_flag.FlagGroup, null, /*#__PURE__*/_react.default.createElement(_flag.default, {
91
+ var typeToActions = function typeToActions() {
92
+ if (type === 'error') {
93
+ if (onRetry) {
94
+ return [{
95
+ content: formatMessage(_messages.syncBlockMessages.deleteRetryButton),
96
+ onClick: onRetry
97
+ }];
98
+ }
99
+ } else if (type === 'info' && action) {
100
+ return [{
101
+ content: formatMessage(action),
102
+ href: 'https://atlaskit.atlassian.com/',
103
+ target: '_blank'
104
+ }];
105
+ }
106
+ return undefined;
107
+ };
108
+ var FlagComponent = type === 'info' ? _flag.AutoDismissFlag : _flag.default;
109
+ return /*#__PURE__*/_react.default.createElement(_flag.FlagGroup, null, /*#__PURE__*/_react.default.createElement(FlagComponent, {
80
110
  onDismissed: onDismissed,
81
111
  title: formatMessage(title),
82
112
  description: formatMessage(description),
83
113
  id: activeFlag.id,
84
114
  testId: activeFlag.id,
85
- icon: /*#__PURE__*/_react.default.createElement(_statusWarning.default, {
115
+ icon: typeToIcon(type),
116
+ actions: typeToActions()
117
+ }));
118
+ };
119
+ var typeToIcon = function typeToIcon(type) {
120
+ if (type === 'error') {
121
+ return /*#__PURE__*/_react.default.createElement(_statusWarning.default, {
86
122
  label: "",
87
123
  color: "var(--ds-icon-warning, #E06C00)"
88
- }),
89
- actions: onRetry ? [{
90
- content: formatMessage(_messages.syncBlockMessages.deleteRetryButton),
91
- onClick: onRetry
92
- }] : undefined
93
- }));
124
+ });
125
+ }
126
+ return /*#__PURE__*/_react.default.createElement(_image.default, {
127
+ label: ""
128
+ });
94
129
  };
@@ -47,7 +47,7 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(stat
47
47
  title: formatMessage(_messages.syncBlockMessages.copySyncBlockLabel),
48
48
  showTitle: false,
49
49
  tooltipContent: formatMessage(_messages.syncBlockMessages.copySyncBlockTooltip),
50
- onClick: (0, _editorCommands.copySyncedBlockReferenceToClipboard)(syncBlockStore)
50
+ onClick: (0, _editorCommands.copySyncedBlockReferenceToClipboard)(syncBlockStore, api)
51
51
  }, hoverDecorationProps(nodeType, _consts.akEditorSelectedNodeClassName));
52
52
  items.push(copyButton);
53
53
  var disabled = !syncBlockStore.referenceManager.getSyncBlockURL(syncBlockObject.node.attrs.resourceId);
@@ -7,25 +7,18 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.getToolbarComponents = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _toolbar = require("@atlaskit/editor-common/toolbar");
10
+ var _editorToolbar = require("@atlaskit/editor-toolbar");
11
+ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
10
12
  var _CreateSyncedBlockButton = require("./CreateSyncedBlockButton");
11
- var _CreateSyncedBlockItem = require("./CreateSyncedBlockItem");
12
- var _OverflowMenuSection = require("./OverflowMenuSection");
13
- var SYNCED_BLOCK_OVERFLOW_MENU_SECTION = {
14
- type: _toolbar.SYNCED_BLOCK_SECTION.type,
15
- key: _toolbar.SYNCED_BLOCK_SECTION.key,
16
- parents: [{
17
- type: _toolbar.OVERFLOW_MENU.type,
18
- key: _toolbar.OVERFLOW_MENU.key,
19
- rank: _toolbar.OVERFLOW_MENU_RANK[_toolbar.SYNCED_BLOCK_SECTION.key]
20
- }],
21
- component: function component(_ref) {
22
- var children = _ref.children;
23
- return /*#__PURE__*/_react.default.createElement(_OverflowMenuSection.OverflowMenuSection, null, children);
24
- }
25
- };
26
13
  var SYNCED_BLOCK_PRIMARY_TOOLBAR_GROUP = {
27
14
  type: _toolbar.SYNCED_BLOCK_GROUP.type,
28
15
  key: _toolbar.SYNCED_BLOCK_GROUP.key,
16
+ component: (0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) ? function (_ref) {
17
+ var children = _ref.children;
18
+ return /*#__PURE__*/_react.default.createElement(_editorToolbar.Show, {
19
+ above: "md"
20
+ }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarButtonGroup, null, children));
21
+ } : undefined,
29
22
  parents: [{
30
23
  type: _toolbar.INSERT_BLOCK_SECTION.type,
31
24
  key: _toolbar.INSERT_BLOCK_SECTION.key,
@@ -33,7 +26,7 @@ var SYNCED_BLOCK_PRIMARY_TOOLBAR_GROUP = {
33
26
  }]
34
27
  };
35
28
  var getToolbarComponents = exports.getToolbarComponents = function getToolbarComponents(api) {
36
- return [SYNCED_BLOCK_PRIMARY_TOOLBAR_GROUP, SYNCED_BLOCK_OVERFLOW_MENU_SECTION, {
29
+ return [SYNCED_BLOCK_PRIMARY_TOOLBAR_GROUP, {
37
30
  type: _toolbar.SYNCED_BLOCK_BUTTON.type,
38
31
  key: _toolbar.SYNCED_BLOCK_BUTTON.key,
39
32
  component: function component() {
@@ -46,18 +39,5 @@ var getToolbarComponents = exports.getToolbarComponents = function getToolbarCom
46
39
  key: _toolbar.SYNCED_BLOCK_GROUP.key,
47
40
  rank: _toolbar.SYNCED_BLOCK_SECTION_RANK[_toolbar.SYNCED_BLOCK_BUTTON.key]
48
41
  }]
49
- }, {
50
- type: _toolbar.SYNCED_BLOCK_ITEM.type,
51
- key: _toolbar.SYNCED_BLOCK_ITEM.key,
52
- parents: [{
53
- type: _toolbar.SYNCED_BLOCK_SECTION.type,
54
- key: _toolbar.SYNCED_BLOCK_SECTION.key,
55
- rank: _toolbar.SYNCED_BLOCK_SECTION_RANK[_toolbar.SYNCED_BLOCK_ITEM.key]
56
- }],
57
- component: function component() {
58
- return /*#__PURE__*/_react.default.createElement(_CreateSyncedBlockItem.CreateSyncedBlockItem, {
59
- api: api
60
- });
61
- }
62
42
  }];
63
43
  };
@@ -2,7 +2,9 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit
2
2
  import { copyDomNode, toDOM } from '@atlaskit/editor-common/copy-button';
3
3
  import { TextSelection } from '@atlaskit/editor-prosemirror/state';
4
4
  import { findSelectedNodeOfType, removeParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
5
+ import { syncedBlockPluginKey } from '../pm-plugins/main';
5
6
  import { canBeConvertedToSyncBlock, findSyncBlock, findSyncBlockOrBodiedSyncBlock, isBodiedSyncBlockNode } from '../pm-plugins/utils/utils';
7
+ import { FLAG_ID } from '../types';
6
8
  export const createSyncedBlock = ({
7
9
  tr,
8
10
  syncBlockStore,
@@ -59,18 +61,18 @@ export const createSyncedBlock = ({
59
61
  // see filterTransaction for more details
60
62
  return tr;
61
63
  };
62
- export const copySyncedBlockReferenceToClipboardEditorCommand = syncBlockStore => ({
64
+ export const copySyncedBlockReferenceToClipboardEditorCommand = (syncBlockStore, api) => ({
63
65
  tr
64
66
  }) => {
65
- if (copySyncedBlockReferenceToClipboardInternal(tr.doc.type.schema, tr.selection, syncBlockStore)) {
67
+ if (copySyncedBlockReferenceToClipboardInternal(tr.doc.type.schema, tr.selection, syncBlockStore, api)) {
66
68
  return tr;
67
69
  }
68
70
  return null;
69
71
  };
70
- export const copySyncedBlockReferenceToClipboard = syncBlockStore => (state, _dispatch, _view) => {
71
- return copySyncedBlockReferenceToClipboardInternal(state.tr.doc.type.schema, state.tr.selection, syncBlockStore);
72
+ export const copySyncedBlockReferenceToClipboard = (syncBlockStore, api) => (state, _dispatch, _view) => {
73
+ return copySyncedBlockReferenceToClipboardInternal(state.tr.doc.type.schema, state.tr.selection, syncBlockStore, api);
72
74
  };
73
- const copySyncedBlockReferenceToClipboardInternal = (schema, selection, syncBlockStore) => {
75
+ const copySyncedBlockReferenceToClipboardInternal = (schema, selection, syncBlockStore, api) => {
74
76
  const syncBlockFindResult = findSyncBlockOrBodiedSyncBlock(schema, selection);
75
77
  if (!syncBlockFindResult) {
76
78
  return false;
@@ -99,6 +101,19 @@ const copySyncedBlockReferenceToClipboardInternal = (schema, selection, syncBloc
99
101
  }
100
102
  const domNode = toDOM(referenceSyncBlockNode, schema);
101
103
  copyDomNode(domNode, referenceSyncBlockNode.type, selection);
104
+
105
+ // Use setTimeout to dispatch transaction in next tick and avoid re-entrant dispatch
106
+ setTimeout(() => {
107
+ api === null || api === void 0 ? void 0 : api.core.actions.execute(({
108
+ tr
109
+ }) => {
110
+ return tr.setMeta(syncedBlockPluginKey, {
111
+ activeFlag: {
112
+ id: FLAG_ID.SYNC_BLOCK_COPIED
113
+ }
114
+ });
115
+ });
116
+ }, 0);
102
117
  return true;
103
118
  };
104
119
  export const editSyncedBlockSource = (syncBlockStore, api) => (state, dispatch, _view) => {
@@ -108,28 +108,35 @@ export const createPlugin = (options, pmPluginFactoryParams, syncBlockStore, api
108
108
  const {
109
109
  schema
110
110
  } = state;
111
+ // Use setTimeout to dispatch transaction in next tick and avoid re-entrant dispatch
112
+ setTimeout(() => {
113
+ api === null || api === void 0 ? void 0 : api.core.actions.execute(({
114
+ tr
115
+ }) => {
116
+ return tr.setMeta(syncedBlockPluginKey, {
117
+ activeFlag: {
118
+ id: FLAG_ID.SYNC_BLOCK_COPIED
119
+ }
120
+ });
121
+ });
122
+ }, 0);
111
123
  if (!syncBlockStore) {
112
124
  return slice;
113
125
  }
114
126
  return mapSlice(slice, node => {
115
127
  if (node.type.name === 'bodiedSyncBlock' && node.attrs.resourceId) {
116
- try {
117
- const newResourceId = syncBlockStore.referenceManager.generateResourceIdForReference(node.attrs.resourceId);
118
- // Convert bodiedSyncBlock to syncBlock
119
- // The paste transformation will regenrate the localId
120
- const newAttrs = {
121
- ...node.attrs,
122
- resourceId: newResourceId
123
- };
124
- const newMarks = schema.nodes.syncBlock.markSet ? node.marks.filter(mark => {
125
- var _schema$nodes$syncBlo;
126
- return (_schema$nodes$syncBlo = schema.nodes.syncBlock.markSet) === null || _schema$nodes$syncBlo === void 0 ? void 0 : _schema$nodes$syncBlo.includes(mark.type);
127
- }) : node.marks;
128
- return schema.nodes.syncBlock.create(newAttrs, null, newMarks);
129
- } catch (error) {
130
- // If generateResourceIdForReference died, return the original node
131
- return node;
132
- }
128
+ const newResourceId = syncBlockStore.referenceManager.generateResourceIdForReference(node.attrs.resourceId);
129
+ // Convert bodiedSyncBlock to syncBlock
130
+ // The paste transformation will regenrate the localId
131
+ const newAttrs = {
132
+ ...node.attrs,
133
+ resourceId: newResourceId
134
+ };
135
+ const newMarks = schema.nodes.syncBlock.markSet ? node.marks.filter(mark => {
136
+ var _schema$nodes$syncBlo;
137
+ return (_schema$nodes$syncBlo = schema.nodes.syncBlock.markSet) === null || _schema$nodes$syncBlo === void 0 ? void 0 : _schema$nodes$syncBlo.includes(mark.type);
138
+ }) : node.marks;
139
+ return schema.nodes.syncBlock.create(newAttrs, null, newMarks);
133
140
  }
134
141
  return node;
135
142
  });
@@ -39,7 +39,7 @@ export const syncedBlockPlugin = ({
39
39
  }];
40
40
  },
41
41
  commands: {
42
- copySyncedBlockReferenceToClipboard: () => copySyncedBlockReferenceToClipboardEditorCommand(syncBlockStore),
42
+ copySyncedBlockReferenceToClipboard: () => copySyncedBlockReferenceToClipboardEditorCommand(syncBlockStore, api),
43
43
  insertSyncedBlock: () => ({
44
44
  tr
45
45
  }) => createSyncedBlock({
@@ -3,5 +3,6 @@ export let FLAG_ID = /*#__PURE__*/function (FLAG_ID) {
3
3
  FLAG_ID["CANNOT_EDIT_WHEN_OFFLINE"] = "cannot-edit-when-offline";
4
4
  FLAG_ID["CANNOT_CREATE_WHEN_OFFLINE"] = "cannot-create-when-offline";
5
5
  FLAG_ID["FAIL_TO_DELETE"] = "fail-to-delete";
6
+ FLAG_ID["SYNC_BLOCK_COPIED"] = "sync-block-copied";
6
7
  return FLAG_ID;
7
8
  }({});
@@ -2,26 +2,37 @@ import React from 'react';
2
2
  import { useIntl } from 'react-intl-next';
3
3
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
4
4
  import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
5
- import AkFlag, { FlagGroup } from '@atlaskit/flag';
5
+ import AkFlag, { AutoDismissFlag, FlagGroup } from '@atlaskit/flag';
6
+ import ImageIcon from '@atlaskit/icon/core/image';
6
7
  import StatusWarningIcon from '@atlaskit/icon/core/status-warning';
7
8
  import { syncedBlockPluginKey } from '../pm-plugins/main';
8
9
  import { FLAG_ID } from '../types';
9
10
  const flagMap = {
10
11
  [FLAG_ID.CANNOT_DELETE_WHEN_OFFLINE]: {
11
12
  title: messages.failToDeleteTitle,
12
- description: messages.failToDeleteWhenOfflineDescription
13
+ description: messages.failToDeleteWhenOfflineDescription,
14
+ type: 'error'
13
15
  },
14
16
  [FLAG_ID.CANNOT_EDIT_WHEN_OFFLINE]: {
15
17
  title: messages.failToEditTitle,
16
- description: messages.failToEditWhenOfflineDescription
18
+ description: messages.failToEditWhenOfflineDescription,
19
+ type: 'error'
17
20
  },
18
21
  [FLAG_ID.CANNOT_CREATE_WHEN_OFFLINE]: {
19
22
  title: messages.failToCreateTitle,
20
- description: messages.failToCreateWhenOfflineDescription
23
+ description: messages.failToCreateWhenOfflineDescription,
24
+ type: 'error'
21
25
  },
22
26
  [FLAG_ID.FAIL_TO_DELETE]: {
23
27
  title: messages.cannotDeleteTitle,
24
- description: messages.cannotDeleteDescription
28
+ description: messages.cannotDeleteDescription,
29
+ type: 'error'
30
+ },
31
+ [FLAG_ID.SYNC_BLOCK_COPIED]: {
32
+ title: messages.syncBlockCopiedTitle,
33
+ description: messages.syncBlockCopiedDescription,
34
+ action: messages.syncBlockCopiedAction,
35
+ type: 'info'
25
36
  }
26
37
  };
27
38
  export const Flag = ({
@@ -45,7 +56,9 @@ export const Flag = ({
45
56
  }
46
57
  const {
47
58
  title,
48
- description
59
+ description,
60
+ action,
61
+ type
49
62
  } = flagMap[activeFlag.id];
50
63
  const {
51
64
  onRetry,
@@ -78,19 +91,42 @@ export const Flag = ({
78
91
  });
79
92
  api === null || api === void 0 ? void 0 : api.core.actions.focus();
80
93
  };
81
- return /*#__PURE__*/React.createElement(FlagGroup, null, /*#__PURE__*/React.createElement(AkFlag, {
94
+ const typeToActions = () => {
95
+ if (type === 'error') {
96
+ if (onRetry) {
97
+ return [{
98
+ content: formatMessage(messages.deleteRetryButton),
99
+ onClick: onRetry
100
+ }];
101
+ }
102
+ } else if (type === 'info' && action) {
103
+ return [{
104
+ content: formatMessage(action),
105
+ href: 'https://atlaskit.atlassian.com/',
106
+ target: '_blank'
107
+ }];
108
+ }
109
+ return undefined;
110
+ };
111
+ const FlagComponent = type === 'info' ? AutoDismissFlag : AkFlag;
112
+ return /*#__PURE__*/React.createElement(FlagGroup, null, /*#__PURE__*/React.createElement(FlagComponent, {
82
113
  onDismissed: onDismissed,
83
114
  title: formatMessage(title),
84
115
  description: formatMessage(description),
85
116
  id: activeFlag.id,
86
117
  testId: activeFlag.id,
87
- icon: /*#__PURE__*/React.createElement(StatusWarningIcon, {
118
+ icon: typeToIcon(type),
119
+ actions: typeToActions()
120
+ }));
121
+ };
122
+ const typeToIcon = type => {
123
+ if (type === 'error') {
124
+ return /*#__PURE__*/React.createElement(StatusWarningIcon, {
88
125
  label: "",
89
126
  color: "var(--ds-icon-warning, #E06C00)"
90
- }),
91
- actions: onRetry ? [{
92
- content: formatMessage(messages.deleteRetryButton),
93
- onClick: onRetry
94
- }] : undefined
95
- }));
127
+ });
128
+ }
129
+ return /*#__PURE__*/React.createElement(ImageIcon, {
130
+ label: ""
131
+ });
96
132
  };
@@ -41,7 +41,7 @@ export const getToolbarConfig = (state, intl, api, syncBlockStore) => {
41
41
  title: formatMessage(messages.copySyncBlockLabel),
42
42
  showTitle: false,
43
43
  tooltipContent: formatMessage(messages.copySyncBlockTooltip),
44
- onClick: copySyncedBlockReferenceToClipboard(syncBlockStore),
44
+ onClick: copySyncedBlockReferenceToClipboard(syncBlockStore, api),
45
45
  ...hoverDecorationProps(nodeType, akEditorSelectedNodeClassName)
46
46
  };
47
47
  items.push(copyButton);
@@ -1,25 +1,16 @@
1
1
  import React from 'react';
2
- import { INSERT_BLOCK_SECTION, INSERT_BLOCK_SECTION_RANK, OVERFLOW_MENU, OVERFLOW_MENU_RANK, SYNCED_BLOCK_BUTTON, SYNCED_BLOCK_GROUP, SYNCED_BLOCK_ITEM, SYNCED_BLOCK_SECTION, SYNCED_BLOCK_SECTION_RANK } from '@atlaskit/editor-common/toolbar';
2
+ import { INSERT_BLOCK_SECTION, INSERT_BLOCK_SECTION_RANK, SYNCED_BLOCK_BUTTON, SYNCED_BLOCK_GROUP, SYNCED_BLOCK_SECTION_RANK } from '@atlaskit/editor-common/toolbar';
3
+ import { Show, ToolbarButtonGroup } from '@atlaskit/editor-toolbar';
4
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
3
5
  import { CreateSyncedBlockButton } from './CreateSyncedBlockButton';
4
- import { CreateSyncedBlockItem } from './CreateSyncedBlockItem';
5
- import { OverflowMenuSection } from './OverflowMenuSection';
6
- const SYNCED_BLOCK_OVERFLOW_MENU_SECTION = {
7
- type: SYNCED_BLOCK_SECTION.type,
8
- key: SYNCED_BLOCK_SECTION.key,
9
- parents: [{
10
- type: OVERFLOW_MENU.type,
11
- key: OVERFLOW_MENU.key,
12
- rank: OVERFLOW_MENU_RANK[SYNCED_BLOCK_SECTION.key]
13
- }],
14
- component: ({
15
- children
16
- }) => {
17
- return /*#__PURE__*/React.createElement(OverflowMenuSection, null, children);
18
- }
19
- };
20
6
  const SYNCED_BLOCK_PRIMARY_TOOLBAR_GROUP = {
21
7
  type: SYNCED_BLOCK_GROUP.type,
22
8
  key: SYNCED_BLOCK_GROUP.key,
9
+ component: expValEquals('platform_editor_toolbar_aifc_responsive', 'isEnabled', true) ? ({
10
+ children
11
+ }) => /*#__PURE__*/React.createElement(Show, {
12
+ above: "md"
13
+ }, /*#__PURE__*/React.createElement(ToolbarButtonGroup, null, children)) : undefined,
23
14
  parents: [{
24
15
  type: INSERT_BLOCK_SECTION.type,
25
16
  key: INSERT_BLOCK_SECTION.key,
@@ -27,7 +18,7 @@ const SYNCED_BLOCK_PRIMARY_TOOLBAR_GROUP = {
27
18
  }]
28
19
  };
29
20
  export const getToolbarComponents = api => {
30
- return [SYNCED_BLOCK_PRIMARY_TOOLBAR_GROUP, SYNCED_BLOCK_OVERFLOW_MENU_SECTION, {
21
+ return [SYNCED_BLOCK_PRIMARY_TOOLBAR_GROUP, {
31
22
  type: SYNCED_BLOCK_BUTTON.type,
32
23
  key: SYNCED_BLOCK_BUTTON.key,
33
24
  component: () => /*#__PURE__*/React.createElement(CreateSyncedBlockButton, {
@@ -38,18 +29,5 @@ export const getToolbarComponents = api => {
38
29
  key: SYNCED_BLOCK_GROUP.key,
39
30
  rank: SYNCED_BLOCK_SECTION_RANK[SYNCED_BLOCK_BUTTON.key]
40
31
  }]
41
- }, {
42
- type: SYNCED_BLOCK_ITEM.type,
43
- key: SYNCED_BLOCK_ITEM.key,
44
- parents: [{
45
- type: SYNCED_BLOCK_SECTION.type,
46
- key: SYNCED_BLOCK_SECTION.key,
47
- rank: SYNCED_BLOCK_SECTION_RANK[SYNCED_BLOCK_ITEM.key]
48
- }],
49
- component: () => {
50
- return /*#__PURE__*/React.createElement(CreateSyncedBlockItem, {
51
- api: api
52
- });
53
- }
54
32
  }];
55
33
  };