@atlaskit/editor-plugin-synced-block 5.1.6 → 5.1.8

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/editor-plugin-synced-block
2
2
 
3
+ ## 5.1.8
4
+
5
+ ### Patch Changes
6
+
7
+ - [`2f2aca53f492c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2f2aca53f492c) -
8
+ [ux] Remove 'copy synced block' from block menu
9
+ - Updated dependencies
10
+
11
+ ## 5.1.7
12
+
13
+ ### Patch Changes
14
+
15
+ - [`38c83ce57623b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/38c83ce57623b) -
16
+ [ux] [EDITOR-3853] Update copy for sync block placeholder and copy flag
17
+ - [`8b821f7771cc4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8b821f7771cc4) -
18
+ [ux] Only show delete option when reference sync block unsynced
19
+ - Updated dependencies
20
+
3
21
  ## 5.1.6
4
22
 
5
23
  ### Patch Changes
@@ -1,5 +1,5 @@
1
1
  {
2
- "extends": "../../../../tsconfig.entry-points.confluence.json",
2
+ "extends": "../../../../tsconfig.local-consumption.json",
3
3
  "compilerOptions": {
4
4
  "target": "es5",
5
5
  "outDir": "../../../../../confluence/tsDist/@atlaskit__editor-plugin-synced-block",
@@ -51,56 +51,24 @@ var CreateSyncedBlockDropdownItem = function CreateSyncedBlockDropdownItem(_ref)
51
51
  }),
52
52
  onClick: onClick,
53
53
  isDisabled: isOffline,
54
- testId: "create-synced-block-block-menu-btn",
54
+ testId: 'create-synced-block-block-menu-btn',
55
55
  elemAfter: /*#__PURE__*/_react.default.createElement(_lozenge.default, {
56
56
  appearance: "new"
57
57
  }, formatMessage(_messages.blockMenuMessages.newLozenge))
58
58
  }, formatMessage(_messages.blockMenuMessages.createSyncedBlock));
59
59
  };
60
- var CopySyncedBlockDropdownItem = function CopySyncedBlockDropdownItem(_ref2) {
61
- var api = _ref2.api;
62
- var _useIntl2 = (0, _reactIntlNext.useIntl)(),
63
- formatMessage = _useIntl2.formatMessage;
64
- var _useSharedPluginState2 = (0, _hooks.useSharedPluginStateWithSelector)(api, ['connectivity'], function (states) {
65
- var _states$connectivityS2;
66
- return {
67
- mode: (_states$connectivityS2 = states.connectivityState) === null || _states$connectivityS2 === void 0 ? void 0 : _states$connectivityS2.mode
68
- };
69
- }),
70
- mode = _useSharedPluginState2.mode;
71
- var onClick = function onClick() {
72
- var _api$core3, _api$core4, _api$blockControls2;
73
- api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(api === null || api === void 0 ? void 0 : api.syncedBlock.commands.copySyncedBlockReferenceToClipboard());
74
- api === null || api === void 0 || (_api$core4 = api.core) === null || _api$core4 === void 0 || _api$core4.actions.execute(api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.toggleBlockMenu({
75
- closeMenu: true
76
- }));
77
- };
78
- return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
79
- elemBefore: /*#__PURE__*/_react.default.createElement(_editorToolbar.SyncBlocksIcon, {
80
- label: ""
81
- }),
82
- onClick: onClick,
83
- isDisabled: (0, _editorPluginConnectivity.isOfflineMode)(mode),
84
- elemAfter: /*#__PURE__*/_react.default.createElement(_lozenge.default, {
85
- appearance: "new"
86
- }, formatMessage(_messages.blockMenuMessages.newLozenge))
87
- }, formatMessage(_messages.blockMenuMessages.copySyncedBlock));
88
- };
89
- var CreateOrCopySyncedBlockDropdownItem = exports.CreateOrCopySyncedBlockDropdownItem = function CreateOrCopySyncedBlockDropdownItem(_ref3) {
90
- var api = _ref3.api,
91
- enableSourceSyncedBlockCreation = _ref3.enableSourceSyncedBlockCreation;
92
- var _useSharedPluginState3 = (0, _hooks.useSharedPluginStateWithSelector)(api, ['blockControls'], function (states) {
60
+ var CreateOrCopySyncedBlockDropdownItem = exports.CreateOrCopySyncedBlockDropdownItem = function CreateOrCopySyncedBlockDropdownItem(_ref2) {
61
+ var _menuTriggerByNode$no;
62
+ var api = _ref2.api,
63
+ enableSourceSyncedBlockCreation = _ref2.enableSourceSyncedBlockCreation;
64
+ var _useSharedPluginState2 = (0, _hooks.useSharedPluginStateWithSelector)(api, ['blockControls'], function (states) {
93
65
  var _states$blockControls3, _states$blockControls4;
94
66
  return {
95
67
  menuTriggerByNode: (_states$blockControls3 = (_states$blockControls4 = states.blockControlsState) === null || _states$blockControls4 === void 0 ? void 0 : _states$blockControls4.menuTriggerByNode) !== null && _states$blockControls3 !== void 0 ? _states$blockControls3 : undefined
96
68
  };
97
69
  }),
98
- menuTriggerByNode = _useSharedPluginState3.menuTriggerByNode;
99
- if ((menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) === 'syncBlock' || (menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) === 'bodiedSyncBlock') {
100
- return /*#__PURE__*/_react.default.createElement(CopySyncedBlockDropdownItem, {
101
- api: api
102
- });
103
- } else if (enableSourceSyncedBlockCreation) {
70
+ menuTriggerByNode = _useSharedPluginState2.menuTriggerByNode;
71
+ if (!['syncBlock', 'bodiedSyncBlock'].includes((_menuTriggerByNode$no = menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) !== null && _menuTriggerByNode$no !== void 0 ? _menuTriggerByNode$no : '') && enableSourceSyncedBlockCreation) {
104
72
  return /*#__PURE__*/_react.default.createElement(CreateSyncedBlockDropdownItem, {
105
73
  api: api
106
74
  });
@@ -13,7 +13,7 @@ var _hooks = require("@atlaskit/editor-common/hooks");
13
13
  var _messages = require("@atlaskit/editor-common/messages");
14
14
  var _editorPluginConnectivity = require("@atlaskit/editor-plugin-connectivity");
15
15
  var _flag = _interopRequireWildcard(require("@atlaskit/flag"));
16
- var _image = _interopRequireDefault(require("@atlaskit/icon/core/image"));
16
+ var _statusSuccess = _interopRequireDefault(require("@atlaskit/icon/core/status-success"));
17
17
  var _statusWarning = _interopRequireDefault(require("@atlaskit/icon/core/status-warning"));
18
18
  var _main = require("../pm-plugins/main");
19
19
  var _types = require("../types");
@@ -38,8 +38,6 @@ var flagMap = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _d
38
38
  type: 'error'
39
39
  }), _types.FLAG_ID.SYNC_BLOCK_COPIED, {
40
40
  title: _messages.syncBlockMessages.syncBlockCopiedTitle,
41
- description: _messages.syncBlockMessages.syncBlockCopiedDescription,
42
- action: _messages.syncBlockMessages.syncBlockCopiedAction,
43
41
  type: 'info'
44
42
  });
45
43
  var Flag = exports.Flag = function Flag(_ref) {
@@ -110,7 +108,7 @@ var Flag = exports.Flag = function Flag(_ref) {
110
108
  return /*#__PURE__*/_react.default.createElement(_flag.FlagGroup, null, /*#__PURE__*/_react.default.createElement(FlagComponent, {
111
109
  onDismissed: onDismissed,
112
110
  title: formatMessage(title),
113
- description: formatMessage(description),
111
+ description: description ? formatMessage(description) : undefined,
114
112
  id: activeFlag.id,
115
113
  testId: activeFlag.id,
116
114
  icon: typeToIcon(type),
@@ -124,7 +122,8 @@ var typeToIcon = function typeToIcon(type) {
124
122
  color: "var(--ds-icon-warning, #E06C00)"
125
123
  });
126
124
  }
127
- return /*#__PURE__*/_react.default.createElement(_image.default, {
128
- label: ""
125
+ return /*#__PURE__*/_react.default.createElement(_statusSuccess.default, {
126
+ label: "",
127
+ color: "var(--ds-icon-success, #6A9A23)"
129
128
  });
130
129
  };
@@ -11,6 +11,7 @@ var _react = _interopRequireDefault(require("react"));
11
11
  var _messages = _interopRequireWildcard(require("@atlaskit/editor-common/messages"));
12
12
  var _utils = require("@atlaskit/editor-prosemirror/utils");
13
13
  var _consts = require("@atlaskit/editor-shared-styles/consts");
14
+ var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
14
15
  var _copy = _interopRequireDefault(require("@atlaskit/icon/core/copy"));
15
16
  var _delete = _interopRequireDefault(require("@atlaskit/icon/core/delete"));
16
17
  var _edit = _interopRequireDefault(require("@atlaskit/icon/core/edit"));
@@ -25,6 +26,8 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(stat
25
26
  if (!syncBlockObject) {
26
27
  return;
27
28
  }
29
+ var syncBlockInstance = syncBlockStore.referenceManager.getFromCache(syncBlockObject.node.attrs.resourceId);
30
+ var isUnsyncedBlock = (syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.error) === _editorSyncedBlockProvider.SyncBlockError.NotFound;
28
31
  var bodiedSyncBlock = state.schema.nodes.bodiedSyncBlock;
29
32
  var isBodiedSyncBlock = (0, _utils2.isBodiedSyncBlockNode)(syncBlockObject.node, bodiedSyncBlock);
30
33
  var formatMessage = intl.formatMessage;
@@ -39,48 +42,58 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(stat
39
42
  };
40
43
  };
41
44
  var items = [];
42
- var copyButton = _objectSpread({
43
- id: 'editor.syncedBlock.copy',
44
- type: 'button',
45
- appearance: 'subtle',
46
- icon: _copy.default,
47
- title: formatMessage(_messages.syncBlockMessages.copySyncBlockLabel),
48
- showTitle: false,
49
- tooltipContent: formatMessage(_messages.syncBlockMessages.copySyncBlockTooltip),
50
- onClick: (0, _editorCommands.copySyncedBlockReferenceToClipboard)(syncBlockStore, api)
51
- }, hoverDecorationProps(nodeType, _consts.akEditorSelectedNodeClassName));
52
- items.push(copyButton);
53
- var disabled = !syncBlockStore.referenceManager.getSyncBlockURL(syncBlockObject.node.attrs.resourceId);
54
- if (!isBodiedSyncBlock) {
55
- var editSourceButton = _objectSpread({
56
- id: 'editor.syncedBlock.editSource',
45
+ if (isUnsyncedBlock) {
46
+ var deleteButton = _objectSpread({
47
+ type: 'button',
48
+ title: formatMessage(_messages.default.delete),
49
+ onClick: (0, _editorCommands.removeSyncedBlock)(api),
50
+ icon: _delete.default
51
+ }, hoverDecorationProps(nodeType, _consts.akEditorSelectedNodeClassName));
52
+ items.push(deleteButton);
53
+ } else {
54
+ var copyButton = _objectSpread({
55
+ id: 'editor.syncedBlock.copy',
57
56
  type: 'button',
58
- disabled: disabled,
59
57
  appearance: 'subtle',
60
- icon: _edit.default,
61
- title: formatMessage(_messages.syncBlockMessages.editSourceLabel),
58
+ icon: _copy.default,
59
+ title: formatMessage(_messages.syncBlockMessages.copySyncBlockLabel),
62
60
  showTitle: false,
63
- tooltipContent: disabled ? formatMessage(_messages.syncBlockMessages.editSourceTooltipDisabled) : formatMessage(_messages.syncBlockMessages.editSourceTooltip),
64
- onClick: (0, _editorCommands.editSyncedBlockSource)(syncBlockStore, api)
61
+ tooltipContent: formatMessage(_messages.syncBlockMessages.copySyncBlockTooltip),
62
+ onClick: (0, _editorCommands.copySyncedBlockReferenceToClipboard)(syncBlockStore, api)
65
63
  }, hoverDecorationProps(nodeType, _consts.akEditorSelectedNodeClassName));
66
- items.push(editSourceButton);
67
- }
64
+ items.push(copyButton);
65
+ var disabled = !syncBlockStore.referenceManager.getSyncBlockURL(syncBlockObject.node.attrs.resourceId);
66
+ if (!isBodiedSyncBlock) {
67
+ var editSourceButton = _objectSpread({
68
+ id: 'editor.syncedBlock.editSource',
69
+ type: 'button',
70
+ disabled: disabled,
71
+ appearance: 'subtle',
72
+ icon: _edit.default,
73
+ title: formatMessage(_messages.syncBlockMessages.editSourceLabel),
74
+ showTitle: false,
75
+ tooltipContent: disabled ? formatMessage(_messages.syncBlockMessages.editSourceTooltipDisabled) : formatMessage(_messages.syncBlockMessages.editSourceTooltip),
76
+ onClick: (0, _editorCommands.editSyncedBlockSource)(syncBlockStore, api)
77
+ }, hoverDecorationProps(nodeType, _consts.akEditorSelectedNodeClassName));
78
+ items.push(editSourceButton);
79
+ }
68
80
 
69
- // testId is required to show focus on trigger button on ESC key press
70
- // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
71
- var testId = 'synced-block-overflow-dropdown-trigger';
72
- var overflowMenuConfig = [{
73
- type: 'overflow-dropdown',
74
- testId: testId,
75
- options: [_objectSpread({
76
- title: formatMessage(_messages.default.delete),
77
- onClick: (0, _editorCommands.removeSyncedBlock)(api),
78
- icon: /*#__PURE__*/_react.default.createElement(_delete.default, {
79
- label: ""
80
- })
81
- }, hoverDecorationProps(nodeType))]
82
- }];
83
- items.push.apply(items, overflowMenuConfig);
81
+ // testId is required to show focus on trigger button on ESC key press
82
+ // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
83
+ var testId = 'synced-block-overflow-dropdown-trigger';
84
+ var overflowMenuConfig = [{
85
+ type: 'overflow-dropdown',
86
+ testId: testId,
87
+ options: [_objectSpread({
88
+ title: formatMessage(_messages.default.delete),
89
+ onClick: (0, _editorCommands.removeSyncedBlock)(api),
90
+ icon: /*#__PURE__*/_react.default.createElement(_delete.default, {
91
+ label: ""
92
+ })
93
+ }, hoverDecorationProps(nodeType))]
94
+ }];
95
+ items.push.apply(items, overflowMenuConfig);
96
+ }
84
97
  var getDomRef = function getDomRef(editorView) {
85
98
  var domAtPos = editorView.domAtPos.bind(editorView);
86
99
  var element = (0, _utils.findDomRefAtPos)(syncBlockObject.pos, domAtPos);
@@ -43,48 +43,17 @@ const CreateSyncedBlockDropdownItem = ({
43
43
  }),
44
44
  onClick: onClick,
45
45
  isDisabled: isOffline,
46
- testId: "create-synced-block-block-menu-btn",
46
+ testId: 'create-synced-block-block-menu-btn',
47
47
  elemAfter: /*#__PURE__*/React.createElement(Lozenge, {
48
48
  appearance: "new"
49
49
  }, formatMessage(blockMenuMessages.newLozenge))
50
50
  }, formatMessage(blockMenuMessages.createSyncedBlock));
51
51
  };
52
- const CopySyncedBlockDropdownItem = ({
53
- api
54
- }) => {
55
- const {
56
- formatMessage
57
- } = useIntl();
58
- const {
59
- mode
60
- } = useSharedPluginStateWithSelector(api, ['connectivity'], states => {
61
- var _states$connectivityS2;
62
- return {
63
- mode: (_states$connectivityS2 = states.connectivityState) === null || _states$connectivityS2 === void 0 ? void 0 : _states$connectivityS2.mode
64
- };
65
- });
66
- const onClick = () => {
67
- var _api$core3, _api$core4, _api$blockControls2, _api$blockControls2$c;
68
- api === null || api === void 0 ? void 0 : (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(api === null || api === void 0 ? void 0 : api.syncedBlock.commands.copySyncedBlockReferenceToClipboard());
69
- api === null || api === void 0 ? void 0 : (_api$core4 = api.core) === null || _api$core4 === void 0 ? void 0 : _api$core4.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : (_api$blockControls2$c = _api$blockControls2.commands) === null || _api$blockControls2$c === void 0 ? void 0 : _api$blockControls2$c.toggleBlockMenu({
70
- closeMenu: true
71
- }));
72
- };
73
- return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
74
- elemBefore: /*#__PURE__*/React.createElement(SyncBlocksIcon, {
75
- label: ""
76
- }),
77
- onClick: onClick,
78
- isDisabled: isOfflineMode(mode),
79
- elemAfter: /*#__PURE__*/React.createElement(Lozenge, {
80
- appearance: "new"
81
- }, formatMessage(blockMenuMessages.newLozenge))
82
- }, formatMessage(blockMenuMessages.copySyncedBlock));
83
- };
84
52
  export const CreateOrCopySyncedBlockDropdownItem = ({
85
53
  api,
86
54
  enableSourceSyncedBlockCreation
87
55
  }) => {
56
+ var _menuTriggerByNode$no;
88
57
  const {
89
58
  menuTriggerByNode
90
59
  } = useSharedPluginStateWithSelector(api, ['blockControls'], states => {
@@ -93,11 +62,7 @@ export const CreateOrCopySyncedBlockDropdownItem = ({
93
62
  menuTriggerByNode: (_states$blockControls3 = (_states$blockControls4 = states.blockControlsState) === null || _states$blockControls4 === void 0 ? void 0 : _states$blockControls4.menuTriggerByNode) !== null && _states$blockControls3 !== void 0 ? _states$blockControls3 : undefined
94
63
  };
95
64
  });
96
- if ((menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) === 'syncBlock' || (menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) === 'bodiedSyncBlock') {
97
- return /*#__PURE__*/React.createElement(CopySyncedBlockDropdownItem, {
98
- api: api
99
- });
100
- } else if (enableSourceSyncedBlockCreation) {
65
+ if (!['syncBlock', 'bodiedSyncBlock'].includes((_menuTriggerByNode$no = menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) !== null && _menuTriggerByNode$no !== void 0 ? _menuTriggerByNode$no : '') && enableSourceSyncedBlockCreation) {
101
66
  return /*#__PURE__*/React.createElement(CreateSyncedBlockDropdownItem, {
102
67
  api: api
103
68
  });
@@ -4,7 +4,7 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
4
4
  import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
5
5
  import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity';
6
6
  import AkFlag, { AutoDismissFlag, FlagGroup } from '@atlaskit/flag';
7
- import ImageIcon from '@atlaskit/icon/core/image';
7
+ import StatusSuccessIcon from '@atlaskit/icon/core/status-success';
8
8
  import StatusWarningIcon from '@atlaskit/icon/core/status-warning';
9
9
  import { syncedBlockPluginKey } from '../pm-plugins/main';
10
10
  import { FLAG_ID } from '../types';
@@ -31,8 +31,6 @@ const flagMap = {
31
31
  },
32
32
  [FLAG_ID.SYNC_BLOCK_COPIED]: {
33
33
  title: messages.syncBlockCopiedTitle,
34
- description: messages.syncBlockCopiedDescription,
35
- action: messages.syncBlockCopiedAction,
36
34
  type: 'info'
37
35
  }
38
36
  };
@@ -113,7 +111,7 @@ export const Flag = ({
113
111
  return /*#__PURE__*/React.createElement(FlagGroup, null, /*#__PURE__*/React.createElement(FlagComponent, {
114
112
  onDismissed: onDismissed,
115
113
  title: formatMessage(title),
116
- description: formatMessage(description),
114
+ description: description ? formatMessage(description) : undefined,
117
115
  id: activeFlag.id,
118
116
  testId: activeFlag.id,
119
117
  icon: typeToIcon(type),
@@ -127,7 +125,8 @@ const typeToIcon = type => {
127
125
  color: "var(--ds-icon-warning, #E06C00)"
128
126
  });
129
127
  }
130
- return /*#__PURE__*/React.createElement(ImageIcon, {
131
- label: ""
128
+ return /*#__PURE__*/React.createElement(StatusSuccessIcon, {
129
+ label: "",
130
+ color: "var(--ds-icon-success, #6A9A23)"
132
131
  });
133
132
  };
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  import commonMessages, { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
3
3
  import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
4
4
  import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles/consts';
5
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
5
6
  import CopyIcon from '@atlaskit/icon/core/copy';
6
7
  import DeleteIcon from '@atlaskit/icon/core/delete';
7
8
  import EditIcon from '@atlaskit/icon/core/edit';
@@ -13,6 +14,8 @@ export const getToolbarConfig = (state, intl, api, syncBlockStore) => {
13
14
  if (!syncBlockObject) {
14
15
  return;
15
16
  }
17
+ const syncBlockInstance = syncBlockStore.referenceManager.getFromCache(syncBlockObject.node.attrs.resourceId);
18
+ const isUnsyncedBlock = (syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.error) === SyncBlockError.NotFound;
16
19
  const {
17
20
  schema: {
18
21
  nodes: {
@@ -33,51 +36,62 @@ export const getToolbarConfig = (state, intl, api, syncBlockStore) => {
33
36
  onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false, className)
34
37
  });
35
38
  const items = [];
36
- const copyButton = {
37
- id: 'editor.syncedBlock.copy',
38
- type: 'button',
39
- appearance: 'subtle',
40
- icon: CopyIcon,
41
- title: formatMessage(messages.copySyncBlockLabel),
42
- showTitle: false,
43
- tooltipContent: formatMessage(messages.copySyncBlockTooltip),
44
- onClick: copySyncedBlockReferenceToClipboard(syncBlockStore, api),
45
- ...hoverDecorationProps(nodeType, akEditorSelectedNodeClassName)
46
- };
47
- items.push(copyButton);
48
- const disabled = !syncBlockStore.referenceManager.getSyncBlockURL(syncBlockObject.node.attrs.resourceId);
49
- if (!isBodiedSyncBlock) {
50
- const editSourceButton = {
51
- id: 'editor.syncedBlock.editSource',
39
+ if (isUnsyncedBlock) {
40
+ const deleteButton = {
41
+ type: 'button',
42
+ title: formatMessage(commonMessages.delete),
43
+ onClick: removeSyncedBlock(api),
44
+ icon: DeleteIcon,
45
+ ...hoverDecorationProps(nodeType, akEditorSelectedNodeClassName)
46
+ };
47
+ items.push(deleteButton);
48
+ } else {
49
+ const copyButton = {
50
+ id: 'editor.syncedBlock.copy',
52
51
  type: 'button',
53
- disabled,
54
52
  appearance: 'subtle',
55
- icon: EditIcon,
56
- title: formatMessage(messages.editSourceLabel),
53
+ icon: CopyIcon,
54
+ title: formatMessage(messages.copySyncBlockLabel),
57
55
  showTitle: false,
58
- tooltipContent: disabled ? formatMessage(messages.editSourceTooltipDisabled) : formatMessage(messages.editSourceTooltip),
59
- onClick: editSyncedBlockSource(syncBlockStore, api),
56
+ tooltipContent: formatMessage(messages.copySyncBlockTooltip),
57
+ onClick: copySyncedBlockReferenceToClipboard(syncBlockStore, api),
60
58
  ...hoverDecorationProps(nodeType, akEditorSelectedNodeClassName)
61
59
  };
62
- items.push(editSourceButton);
63
- }
60
+ items.push(copyButton);
61
+ const disabled = !syncBlockStore.referenceManager.getSyncBlockURL(syncBlockObject.node.attrs.resourceId);
62
+ if (!isBodiedSyncBlock) {
63
+ const editSourceButton = {
64
+ id: 'editor.syncedBlock.editSource',
65
+ type: 'button',
66
+ disabled,
67
+ appearance: 'subtle',
68
+ icon: EditIcon,
69
+ title: formatMessage(messages.editSourceLabel),
70
+ showTitle: false,
71
+ tooltipContent: disabled ? formatMessage(messages.editSourceTooltipDisabled) : formatMessage(messages.editSourceTooltip),
72
+ onClick: editSyncedBlockSource(syncBlockStore, api),
73
+ ...hoverDecorationProps(nodeType, akEditorSelectedNodeClassName)
74
+ };
75
+ items.push(editSourceButton);
76
+ }
64
77
 
65
- // testId is required to show focus on trigger button on ESC key press
66
- // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
67
- const testId = 'synced-block-overflow-dropdown-trigger';
68
- const overflowMenuConfig = [{
69
- type: 'overflow-dropdown',
70
- testId,
71
- options: [{
72
- title: formatMessage(commonMessages.delete),
73
- onClick: removeSyncedBlock(api),
74
- icon: /*#__PURE__*/React.createElement(DeleteIcon, {
75
- label: ""
76
- }),
77
- ...hoverDecorationProps(nodeType)
78
- }]
79
- }];
80
- items.push(...overflowMenuConfig);
78
+ // testId is required to show focus on trigger button on ESC key press
79
+ // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
80
+ const testId = 'synced-block-overflow-dropdown-trigger';
81
+ const overflowMenuConfig = [{
82
+ type: 'overflow-dropdown',
83
+ testId,
84
+ options: [{
85
+ title: formatMessage(commonMessages.delete),
86
+ onClick: removeSyncedBlock(api),
87
+ icon: /*#__PURE__*/React.createElement(DeleteIcon, {
88
+ label: ""
89
+ }),
90
+ ...hoverDecorationProps(nodeType)
91
+ }]
92
+ }];
93
+ items.push(...overflowMenuConfig);
94
+ }
81
95
  const getDomRef = editorView => {
82
96
  const domAtPos = editorView.domAtPos.bind(editorView);
83
97
  const element = findDomRefAtPos(syncBlockObject.pos, domAtPos);
@@ -42,56 +42,24 @@ var CreateSyncedBlockDropdownItem = function CreateSyncedBlockDropdownItem(_ref)
42
42
  }),
43
43
  onClick: onClick,
44
44
  isDisabled: isOffline,
45
- testId: "create-synced-block-block-menu-btn",
45
+ testId: 'create-synced-block-block-menu-btn',
46
46
  elemAfter: /*#__PURE__*/React.createElement(Lozenge, {
47
47
  appearance: "new"
48
48
  }, formatMessage(blockMenuMessages.newLozenge))
49
49
  }, formatMessage(blockMenuMessages.createSyncedBlock));
50
50
  };
51
- var CopySyncedBlockDropdownItem = function CopySyncedBlockDropdownItem(_ref2) {
52
- var api = _ref2.api;
53
- var _useIntl2 = useIntl(),
54
- formatMessage = _useIntl2.formatMessage;
55
- var _useSharedPluginState2 = useSharedPluginStateWithSelector(api, ['connectivity'], function (states) {
56
- var _states$connectivityS2;
57
- return {
58
- mode: (_states$connectivityS2 = states.connectivityState) === null || _states$connectivityS2 === void 0 ? void 0 : _states$connectivityS2.mode
59
- };
60
- }),
61
- mode = _useSharedPluginState2.mode;
62
- var onClick = function onClick() {
63
- var _api$core3, _api$core4, _api$blockControls2;
64
- api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(api === null || api === void 0 ? void 0 : api.syncedBlock.commands.copySyncedBlockReferenceToClipboard());
65
- api === null || api === void 0 || (_api$core4 = api.core) === null || _api$core4 === void 0 || _api$core4.actions.execute(api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.toggleBlockMenu({
66
- closeMenu: true
67
- }));
68
- };
69
- return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
70
- elemBefore: /*#__PURE__*/React.createElement(SyncBlocksIcon, {
71
- label: ""
72
- }),
73
- onClick: onClick,
74
- isDisabled: isOfflineMode(mode),
75
- elemAfter: /*#__PURE__*/React.createElement(Lozenge, {
76
- appearance: "new"
77
- }, formatMessage(blockMenuMessages.newLozenge))
78
- }, formatMessage(blockMenuMessages.copySyncedBlock));
79
- };
80
- export var CreateOrCopySyncedBlockDropdownItem = function CreateOrCopySyncedBlockDropdownItem(_ref3) {
81
- var api = _ref3.api,
82
- enableSourceSyncedBlockCreation = _ref3.enableSourceSyncedBlockCreation;
83
- var _useSharedPluginState3 = useSharedPluginStateWithSelector(api, ['blockControls'], function (states) {
51
+ export var CreateOrCopySyncedBlockDropdownItem = function CreateOrCopySyncedBlockDropdownItem(_ref2) {
52
+ var _menuTriggerByNode$no;
53
+ var api = _ref2.api,
54
+ enableSourceSyncedBlockCreation = _ref2.enableSourceSyncedBlockCreation;
55
+ var _useSharedPluginState2 = useSharedPluginStateWithSelector(api, ['blockControls'], function (states) {
84
56
  var _states$blockControls3, _states$blockControls4;
85
57
  return {
86
58
  menuTriggerByNode: (_states$blockControls3 = (_states$blockControls4 = states.blockControlsState) === null || _states$blockControls4 === void 0 ? void 0 : _states$blockControls4.menuTriggerByNode) !== null && _states$blockControls3 !== void 0 ? _states$blockControls3 : undefined
87
59
  };
88
60
  }),
89
- menuTriggerByNode = _useSharedPluginState3.menuTriggerByNode;
90
- if ((menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) === 'syncBlock' || (menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) === 'bodiedSyncBlock') {
91
- return /*#__PURE__*/React.createElement(CopySyncedBlockDropdownItem, {
92
- api: api
93
- });
94
- } else if (enableSourceSyncedBlockCreation) {
61
+ menuTriggerByNode = _useSharedPluginState2.menuTriggerByNode;
62
+ if (!['syncBlock', 'bodiedSyncBlock'].includes((_menuTriggerByNode$no = menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) !== null && _menuTriggerByNode$no !== void 0 ? _menuTriggerByNode$no : '') && enableSourceSyncedBlockCreation) {
95
63
  return /*#__PURE__*/React.createElement(CreateSyncedBlockDropdownItem, {
96
64
  api: api
97
65
  });
@@ -7,7 +7,7 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
7
7
  import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
8
8
  import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity';
9
9
  import AkFlag, { AutoDismissFlag, FlagGroup } from '@atlaskit/flag';
10
- import ImageIcon from '@atlaskit/icon/core/image';
10
+ import StatusSuccessIcon from '@atlaskit/icon/core/status-success';
11
11
  import StatusWarningIcon from '@atlaskit/icon/core/status-warning';
12
12
  import { syncedBlockPluginKey } from '../pm-plugins/main';
13
13
  import { FLAG_ID } from '../types';
@@ -29,8 +29,6 @@ var flagMap = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_d
29
29
  type: 'error'
30
30
  }), FLAG_ID.SYNC_BLOCK_COPIED, {
31
31
  title: messages.syncBlockCopiedTitle,
32
- description: messages.syncBlockCopiedDescription,
33
- action: messages.syncBlockCopiedAction,
34
32
  type: 'info'
35
33
  });
36
34
  export var Flag = function Flag(_ref) {
@@ -101,7 +99,7 @@ export var Flag = function Flag(_ref) {
101
99
  return /*#__PURE__*/React.createElement(FlagGroup, null, /*#__PURE__*/React.createElement(FlagComponent, {
102
100
  onDismissed: onDismissed,
103
101
  title: formatMessage(title),
104
- description: formatMessage(description),
102
+ description: description ? formatMessage(description) : undefined,
105
103
  id: activeFlag.id,
106
104
  testId: activeFlag.id,
107
105
  icon: typeToIcon(type),
@@ -115,7 +113,8 @@ var typeToIcon = function typeToIcon(type) {
115
113
  color: "var(--ds-icon-warning, #E06C00)"
116
114
  });
117
115
  }
118
- return /*#__PURE__*/React.createElement(ImageIcon, {
119
- label: ""
116
+ return /*#__PURE__*/React.createElement(StatusSuccessIcon, {
117
+ label: "",
118
+ color: "var(--ds-icon-success, #6A9A23)"
120
119
  });
121
120
  };
@@ -5,6 +5,7 @@ import React from 'react';
5
5
  import commonMessages, { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
6
6
  import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
7
7
  import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles/consts';
8
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
8
9
  import CopyIcon from '@atlaskit/icon/core/copy';
9
10
  import DeleteIcon from '@atlaskit/icon/core/delete';
10
11
  import EditIcon from '@atlaskit/icon/core/edit';
@@ -16,6 +17,8 @@ export var getToolbarConfig = function getToolbarConfig(state, intl, api, syncBl
16
17
  if (!syncBlockObject) {
17
18
  return;
18
19
  }
20
+ var syncBlockInstance = syncBlockStore.referenceManager.getFromCache(syncBlockObject.node.attrs.resourceId);
21
+ var isUnsyncedBlock = (syncBlockInstance === null || syncBlockInstance === void 0 ? void 0 : syncBlockInstance.error) === SyncBlockError.NotFound;
19
22
  var bodiedSyncBlock = state.schema.nodes.bodiedSyncBlock;
20
23
  var isBodiedSyncBlock = isBodiedSyncBlockNode(syncBlockObject.node, bodiedSyncBlock);
21
24
  var formatMessage = intl.formatMessage;
@@ -30,48 +33,58 @@ export var getToolbarConfig = function getToolbarConfig(state, intl, api, syncBl
30
33
  };
31
34
  };
32
35
  var items = [];
33
- var copyButton = _objectSpread({
34
- id: 'editor.syncedBlock.copy',
35
- type: 'button',
36
- appearance: 'subtle',
37
- icon: CopyIcon,
38
- title: formatMessage(messages.copySyncBlockLabel),
39
- showTitle: false,
40
- tooltipContent: formatMessage(messages.copySyncBlockTooltip),
41
- onClick: copySyncedBlockReferenceToClipboard(syncBlockStore, api)
42
- }, hoverDecorationProps(nodeType, akEditorSelectedNodeClassName));
43
- items.push(copyButton);
44
- var disabled = !syncBlockStore.referenceManager.getSyncBlockURL(syncBlockObject.node.attrs.resourceId);
45
- if (!isBodiedSyncBlock) {
46
- var editSourceButton = _objectSpread({
47
- id: 'editor.syncedBlock.editSource',
36
+ if (isUnsyncedBlock) {
37
+ var deleteButton = _objectSpread({
38
+ type: 'button',
39
+ title: formatMessage(commonMessages.delete),
40
+ onClick: removeSyncedBlock(api),
41
+ icon: DeleteIcon
42
+ }, hoverDecorationProps(nodeType, akEditorSelectedNodeClassName));
43
+ items.push(deleteButton);
44
+ } else {
45
+ var copyButton = _objectSpread({
46
+ id: 'editor.syncedBlock.copy',
48
47
  type: 'button',
49
- disabled: disabled,
50
48
  appearance: 'subtle',
51
- icon: EditIcon,
52
- title: formatMessage(messages.editSourceLabel),
49
+ icon: CopyIcon,
50
+ title: formatMessage(messages.copySyncBlockLabel),
53
51
  showTitle: false,
54
- tooltipContent: disabled ? formatMessage(messages.editSourceTooltipDisabled) : formatMessage(messages.editSourceTooltip),
55
- onClick: editSyncedBlockSource(syncBlockStore, api)
52
+ tooltipContent: formatMessage(messages.copySyncBlockTooltip),
53
+ onClick: copySyncedBlockReferenceToClipboard(syncBlockStore, api)
56
54
  }, hoverDecorationProps(nodeType, akEditorSelectedNodeClassName));
57
- items.push(editSourceButton);
58
- }
55
+ items.push(copyButton);
56
+ var disabled = !syncBlockStore.referenceManager.getSyncBlockURL(syncBlockObject.node.attrs.resourceId);
57
+ if (!isBodiedSyncBlock) {
58
+ var editSourceButton = _objectSpread({
59
+ id: 'editor.syncedBlock.editSource',
60
+ type: 'button',
61
+ disabled: disabled,
62
+ appearance: 'subtle',
63
+ icon: EditIcon,
64
+ title: formatMessage(messages.editSourceLabel),
65
+ showTitle: false,
66
+ tooltipContent: disabled ? formatMessage(messages.editSourceTooltipDisabled) : formatMessage(messages.editSourceTooltip),
67
+ onClick: editSyncedBlockSource(syncBlockStore, api)
68
+ }, hoverDecorationProps(nodeType, akEditorSelectedNodeClassName));
69
+ items.push(editSourceButton);
70
+ }
59
71
 
60
- // testId is required to show focus on trigger button on ESC key press
61
- // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
62
- var testId = 'synced-block-overflow-dropdown-trigger';
63
- var overflowMenuConfig = [{
64
- type: 'overflow-dropdown',
65
- testId: testId,
66
- options: [_objectSpread({
67
- title: formatMessage(commonMessages.delete),
68
- onClick: removeSyncedBlock(api),
69
- icon: /*#__PURE__*/React.createElement(DeleteIcon, {
70
- label: ""
71
- })
72
- }, hoverDecorationProps(nodeType))]
73
- }];
74
- items.push.apply(items, overflowMenuConfig);
72
+ // testId is required to show focus on trigger button on ESC key press
73
+ // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
74
+ var testId = 'synced-block-overflow-dropdown-trigger';
75
+ var overflowMenuConfig = [{
76
+ type: 'overflow-dropdown',
77
+ testId: testId,
78
+ options: [_objectSpread({
79
+ title: formatMessage(commonMessages.delete),
80
+ onClick: removeSyncedBlock(api),
81
+ icon: /*#__PURE__*/React.createElement(DeleteIcon, {
82
+ label: ""
83
+ })
84
+ }, hoverDecorationProps(nodeType))]
85
+ }];
86
+ items.push.apply(items, overflowMenuConfig);
87
+ }
75
88
  var getDomRef = function getDomRef(editorView) {
76
89
  var domAtPos = editorView.domAtPos.bind(editorView);
77
90
  var element = findDomRefAtPos(syncBlockObject.pos, domAtPos);
@@ -1,6 +1,6 @@
1
1
  import type { IntlShape } from 'react-intl-next';
2
2
  import type { ExtractInjectionAPI, FloatingToolbarConfig } from '@atlaskit/editor-common/types';
3
3
  import type { EditorState } from '@atlaskit/editor-prosemirror/state';
4
- import type { SyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
4
+ import { type SyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
5
5
  import type { SyncedBlockPlugin } from '../syncedBlockPluginType';
6
6
  export declare const getToolbarConfig: (state: EditorState, intl: IntlShape, api: ExtractInjectionAPI<SyncedBlockPlugin> | undefined, syncBlockStore: SyncBlockStoreManager) => FloatingToolbarConfig | undefined;
@@ -1,6 +1,6 @@
1
1
  import type { IntlShape } from 'react-intl-next';
2
2
  import type { ExtractInjectionAPI, FloatingToolbarConfig } from '@atlaskit/editor-common/types';
3
3
  import type { EditorState } from '@atlaskit/editor-prosemirror/state';
4
- import type { SyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
4
+ import { type SyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
5
5
  import type { SyncedBlockPlugin } from '../syncedBlockPluginType';
6
6
  export declare const getToolbarConfig: (state: EditorState, intl: IntlShape, api: ExtractInjectionAPI<SyncedBlockPlugin> | undefined, syncBlockStore: SyncBlockStoreManager) => FloatingToolbarConfig | undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-synced-block",
3
- "version": "5.1.6",
3
+ "version": "5.1.8",
4
4
  "description": "SyncedBlock plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -49,9 +49,9 @@
49
49
  "@atlaskit/modal-dialog": "^14.9.0",
50
50
  "@atlaskit/platform-feature-flags": "^1.1.0",
51
51
  "@atlaskit/primitives": "^17.0.0",
52
- "@atlaskit/tmp-editor-statsig": "^16.12.0",
52
+ "@atlaskit/tmp-editor-statsig": "^16.15.0",
53
53
  "@atlaskit/tokens": "9.1.1",
54
- "@atlaskit/tooltip": "^20.12.0",
54
+ "@atlaskit/tooltip": "^20.14.0",
55
55
  "@atlaskit/visually-hidden": "^3.0.0",
56
56
  "@babel/runtime": "^7.0.0",
57
57
  "bind-event-listener": "^3.0.0",