@atlaskit/editor-plugin-synced-block 4.5.4 → 4.5.6

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,24 @@
1
1
  # @atlaskit/editor-plugin-synced-block
2
2
 
3
+ ## 4.5.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [`50cf7cca6bb76`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/50cf7cca6bb76) -
8
+ [ux] EDITOR-3896 update sync block border styles
9
+ - [`f5c8ad92df993`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f5c8ad92df993) -
10
+ [EDITOR-3950] Fix a bug where bodiedSyncBlock does not get inserted properly when cursor is within
11
+ the bodiedSyncBlock and inbetween content
12
+ - Updated dependencies
13
+
14
+ ## 4.5.5
15
+
16
+ ### Patch Changes
17
+
18
+ - [`851c90fb91330`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/851c90fb91330) -
19
+ [EDITOR-3951] Fix sync block flag shows up unexpectedly
20
+ - Updated dependencies
21
+
3
22
  ## 4.5.4
4
23
 
5
24
  ### Patch Changes
@@ -74,9 +74,6 @@
74
74
  {
75
75
  "path": "../../../design-system/icon-lab/afm-cc/tsconfig.json"
76
76
  },
77
- {
78
- "path": "../../../design-system/logo/afm-cc/tsconfig.json"
79
- },
80
77
  {
81
78
  "path": "../../../design-system/lozenge/afm-cc/tsconfig.json"
82
79
  },
@@ -74,9 +74,6 @@
74
74
  {
75
75
  "path": "../../../design-system/icon-lab/afm-jira/tsconfig.json"
76
76
  },
77
- {
78
- "path": "../../../design-system/logo/afm-jira/tsconfig.json"
79
- },
80
77
  {
81
78
  "path": "../../../design-system/lozenge/afm-jira/tsconfig.json"
82
79
  },
@@ -74,9 +74,6 @@
74
74
  {
75
75
  "path": "../../../design-system/icon-lab/afm-products/tsconfig.json"
76
76
  },
77
- {
78
- "path": "../../../design-system/logo/afm-products/tsconfig.json"
79
- },
80
77
  {
81
78
  "path": "../../../design-system/lozenge/afm-products/tsconfig.json"
82
79
  },
@@ -34,7 +34,7 @@ var createSyncedBlock = exports.createSyncedBlock = function createSyncedBlock(_
34
34
  if (typeAheadInsert) {
35
35
  tr = typeAheadInsert(newBodiedSyncBlockNode);
36
36
  } else {
37
- tr = tr.replaceSelectionWith(newBodiedSyncBlockNode).scrollIntoView();
37
+ tr = (0, _utils.safeInsert)(newBodiedSyncBlockNode)(tr);
38
38
  }
39
39
  } else {
40
40
  var conversionInfo = (0, _utils2.canBeConvertedToSyncBlock)(tr.selection);
@@ -26,10 +26,23 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
26
26
  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; }
27
27
  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; }
28
28
  var syncedBlockPluginKey = exports.syncedBlockPluginKey = new _state.PluginKey('syncedBlockPlugin');
29
+ var showCopiedFlag = function showCopiedFlag(api) {
30
+ // Use setTimeout to dispatch transaction in next tick and avoid re-entrant dispatch
31
+ setTimeout(function () {
32
+ api === null || api === void 0 || api.core.actions.execute(function (_ref) {
33
+ var tr = _ref.tr;
34
+ return tr.setMeta(syncedBlockPluginKey, {
35
+ activeFlag: {
36
+ id: _types.FLAG_ID.SYNC_BLOCK_COPIED
37
+ }
38
+ });
39
+ });
40
+ }, 0);
41
+ };
29
42
  var createPlugin = exports.createPlugin = function createPlugin(options, pmPluginFactoryParams, syncBlockStore, api) {
30
- var _ref = options || {},
31
- _ref$useLongPressSele = _ref.useLongPressSelection,
32
- useLongPressSelection = _ref$useLongPressSele === void 0 ? false : _ref$useLongPressSele;
43
+ var _ref2 = options || {},
44
+ _ref2$useLongPressSel = _ref2.useLongPressSelection,
45
+ useLongPressSelection = _ref2$useLongPressSel === void 0 ? false : _ref2$useLongPressSel;
33
46
  var confirmationTransactionRef = {
34
47
  current: undefined
35
48
  };
@@ -113,27 +126,21 @@ var createPlugin = exports.createPlugin = function createPlugin(options, pmPlugi
113
126
  return (0, _ignoreDomEvent.shouldIgnoreDomEvent)(view, event, api);
114
127
  }
115
128
  },
116
- transformCopied: function transformCopied(slice, _ref2) {
117
- var state = _ref2.state;
129
+ transformCopied: function transformCopied(slice, _ref3) {
130
+ var state = _ref3.state;
118
131
  var pluginState = syncedBlockPluginKey.getState(state);
119
132
  var syncBlockStore = pluginState === null || pluginState === void 0 ? void 0 : pluginState.syncBlockStore;
120
133
  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);
132
134
  if (!syncBlockStore) {
133
135
  return slice;
134
136
  }
135
137
  return (0, _utils.mapSlice)(slice, function (node) {
138
+ if (node.type.name === 'syncBlock') {
139
+ showCopiedFlag(api);
140
+ return node;
141
+ }
136
142
  if (node.type.name === 'bodiedSyncBlock' && node.attrs.resourceId) {
143
+ showCopiedFlag(api);
137
144
  var newResourceId = syncBlockStore.referenceManager.generateResourceIdForReference(node.attrs.resourceId);
138
145
  // Convert bodiedSyncBlock to syncBlock
139
146
  // The paste transformation will regenrate the localId
@@ -9,7 +9,7 @@ var _react = _interopRequireDefault(require("react"));
9
9
  var _reactIntlNext = require("react-intl-next");
10
10
  var _messages = require("@atlaskit/editor-common/messages");
11
11
  var _syncBlock = require("@atlaskit/editor-common/sync-block");
12
- var _logo = require("@atlaskit/logo");
12
+ var _blockSynced = _interopRequireDefault(require("@atlaskit/icon-lab/core/block-synced"));
13
13
  var _compiled = require("@atlaskit/primitives/compiled");
14
14
  var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
15
15
  var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
@@ -39,15 +39,17 @@ var SyncBlockLabelComponent = function SyncBlockLabelComponent(_ref) {
39
39
  ,
40
40
  className: _syncBlock.SyncBlockLabelSharedCssClassName.labelClassName,
41
41
  "aria-describedby": ariaDescribedById
42
- }, /*#__PURE__*/_react.default.createElement(_logo.ConfluenceIcon, {
43
- size: "xsmall",
44
- appearance: "neutral",
45
- shouldUseNewLogoDesign: true
42
+ }, /*#__PURE__*/_react.default.createElement(_blockSynced.default, {
43
+ color: "var(--ds-icon-subtle, #505258)",
44
+ size: "small",
45
+ label: ""
46
46
  }), isSource || !title ? /*#__PURE__*/_react.default.createElement(_compiled.Text, {
47
- size: "small"
47
+ size: "small",
48
+ color: "color.text.subtle"
48
49
  }, formatMessage(_messages.syncBlockMessages.syncedBlockLabel)) : /*#__PURE__*/_react.default.createElement(_compiled.Text, {
49
50
  maxLines: 1,
50
- size: "small"
51
+ size: "small",
52
+ color: "color.text.subtle"
51
53
  }, title)), /*#__PURE__*/_react.default.createElement(_visuallyHidden.default, {
52
54
  id: ariaDescribedById
53
55
  }, tooltipContent));
@@ -1,7 +1,7 @@
1
1
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
2
2
  import { copyDomNode, toDOM } from '@atlaskit/editor-common/copy-button';
3
3
  import { TextSelection } from '@atlaskit/editor-prosemirror/state';
4
- import { findSelectedNodeOfType, removeParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
4
+ import { findSelectedNodeOfType, removeParentNodeOfType, removeSelectedNode, safeInsert } from '@atlaskit/editor-prosemirror/utils';
5
5
  import { syncedBlockPluginKey } from '../pm-plugins/main';
6
6
  import { canBeConvertedToSyncBlock, findSyncBlock, findSyncBlockOrBodiedSyncBlock, isBodiedSyncBlockNode } from '../pm-plugins/utils/utils';
7
7
  import { FLAG_ID } from '../types';
@@ -34,7 +34,7 @@ export const createSyncedBlock = ({
34
34
  if (typeAheadInsert) {
35
35
  tr = typeAheadInsert(newBodiedSyncBlockNode);
36
36
  } else {
37
- tr = tr.replaceSelectionWith(newBodiedSyncBlockNode).scrollIntoView();
37
+ tr = safeInsert(newBodiedSyncBlockNode)(tr);
38
38
  }
39
39
  } else {
40
40
  const conversionInfo = canBeConvertedToSyncBlock(tr.selection);
@@ -13,6 +13,20 @@ import { shouldIgnoreDomEvent } from './utils/ignore-dom-event';
13
13
  import { calculateDecorations } from './utils/selection-decorations';
14
14
  import { hasEditInSyncBlock, trackSyncBlocks } from './utils/track-sync-blocks';
15
15
  export const syncedBlockPluginKey = new PluginKey('syncedBlockPlugin');
16
+ const showCopiedFlag = api => {
17
+ // Use setTimeout to dispatch transaction in next tick and avoid re-entrant dispatch
18
+ setTimeout(() => {
19
+ api === null || api === void 0 ? void 0 : api.core.actions.execute(({
20
+ tr
21
+ }) => {
22
+ return tr.setMeta(syncedBlockPluginKey, {
23
+ activeFlag: {
24
+ id: FLAG_ID.SYNC_BLOCK_COPIED
25
+ }
26
+ });
27
+ });
28
+ }, 0);
29
+ };
16
30
  export const createPlugin = (options, pmPluginFactoryParams, syncBlockStore, api) => {
17
31
  const {
18
32
  useLongPressSelection = false
@@ -108,23 +122,16 @@ export const createPlugin = (options, pmPluginFactoryParams, syncBlockStore, api
108
122
  const {
109
123
  schema
110
124
  } = 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);
123
125
  if (!syncBlockStore) {
124
126
  return slice;
125
127
  }
126
128
  return mapSlice(slice, node => {
129
+ if (node.type.name === 'syncBlock') {
130
+ showCopiedFlag(api);
131
+ return node;
132
+ }
127
133
  if (node.type.name === 'bodiedSyncBlock' && node.attrs.resourceId) {
134
+ showCopiedFlag(api);
128
135
  const newResourceId = syncBlockStore.referenceManager.generateResourceIdForReference(node.attrs.resourceId);
129
136
  // Convert bodiedSyncBlock to syncBlock
130
137
  // The paste transformation will regenrate the localId
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { useIntl } from 'react-intl-next';
3
3
  import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
4
4
  import { SyncBlockLabelSharedCssClassName } from '@atlaskit/editor-common/sync-block';
5
- import { ConfluenceIcon } from '@atlaskit/logo';
5
+ import BlockSyncedIcon from '@atlaskit/icon-lab/core/block-synced';
6
6
  import { Text } from '@atlaskit/primitives/compiled';
7
7
  import Tooltip from '@atlaskit/tooltip';
8
8
  import VisuallyHidden from '@atlaskit/visually-hidden';
@@ -34,15 +34,17 @@ const SyncBlockLabelComponent = ({
34
34
  ,
35
35
  className: SyncBlockLabelSharedCssClassName.labelClassName,
36
36
  "aria-describedby": ariaDescribedById
37
- }, /*#__PURE__*/React.createElement(ConfluenceIcon, {
38
- size: "xsmall",
39
- appearance: "neutral",
40
- shouldUseNewLogoDesign: true
37
+ }, /*#__PURE__*/React.createElement(BlockSyncedIcon, {
38
+ color: "var(--ds-icon-subtle, #505258)",
39
+ size: "small",
40
+ label: ""
41
41
  }), isSource || !title ? /*#__PURE__*/React.createElement(Text, {
42
- size: "small"
42
+ size: "small",
43
+ color: "color.text.subtle"
43
44
  }, formatMessage(messages.syncedBlockLabel)) : /*#__PURE__*/React.createElement(Text, {
44
45
  maxLines: 1,
45
- size: "small"
46
+ size: "small",
47
+ color: "color.text.subtle"
46
48
  }, title)), /*#__PURE__*/React.createElement(VisuallyHidden, {
47
49
  id: ariaDescribedById
48
50
  }, tooltipContent));
@@ -1,7 +1,7 @@
1
1
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
2
2
  import { copyDomNode, toDOM } from '@atlaskit/editor-common/copy-button';
3
3
  import { TextSelection } from '@atlaskit/editor-prosemirror/state';
4
- import { findSelectedNodeOfType, removeParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
4
+ import { findSelectedNodeOfType, removeParentNodeOfType, removeSelectedNode, safeInsert } from '@atlaskit/editor-prosemirror/utils';
5
5
  import { syncedBlockPluginKey } from '../pm-plugins/main';
6
6
  import { canBeConvertedToSyncBlock, findSyncBlock, findSyncBlockOrBodiedSyncBlock, isBodiedSyncBlockNode } from '../pm-plugins/utils/utils';
7
7
  import { FLAG_ID } from '../types';
@@ -28,7 +28,7 @@ export var createSyncedBlock = function createSyncedBlock(_ref) {
28
28
  if (typeAheadInsert) {
29
29
  tr = typeAheadInsert(newBodiedSyncBlockNode);
30
30
  } else {
31
- tr = tr.replaceSelectionWith(newBodiedSyncBlockNode).scrollIntoView();
31
+ tr = safeInsert(newBodiedSyncBlockNode)(tr);
32
32
  }
33
33
  } else {
34
34
  var conversionInfo = canBeConvertedToSyncBlock(tr.selection);
@@ -19,10 +19,23 @@ import { shouldIgnoreDomEvent } from './utils/ignore-dom-event';
19
19
  import { calculateDecorations } from './utils/selection-decorations';
20
20
  import { hasEditInSyncBlock, trackSyncBlocks } from './utils/track-sync-blocks';
21
21
  export var syncedBlockPluginKey = new PluginKey('syncedBlockPlugin');
22
+ var showCopiedFlag = function showCopiedFlag(api) {
23
+ // Use setTimeout to dispatch transaction in next tick and avoid re-entrant dispatch
24
+ setTimeout(function () {
25
+ api === null || api === void 0 || api.core.actions.execute(function (_ref) {
26
+ var tr = _ref.tr;
27
+ return tr.setMeta(syncedBlockPluginKey, {
28
+ activeFlag: {
29
+ id: FLAG_ID.SYNC_BLOCK_COPIED
30
+ }
31
+ });
32
+ });
33
+ }, 0);
34
+ };
22
35
  export var createPlugin = function createPlugin(options, pmPluginFactoryParams, syncBlockStore, api) {
23
- var _ref = options || {},
24
- _ref$useLongPressSele = _ref.useLongPressSelection,
25
- useLongPressSelection = _ref$useLongPressSele === void 0 ? false : _ref$useLongPressSele;
36
+ var _ref2 = options || {},
37
+ _ref2$useLongPressSel = _ref2.useLongPressSelection,
38
+ useLongPressSelection = _ref2$useLongPressSel === void 0 ? false : _ref2$useLongPressSel;
26
39
  var confirmationTransactionRef = {
27
40
  current: undefined
28
41
  };
@@ -106,27 +119,21 @@ export var createPlugin = function createPlugin(options, pmPluginFactoryParams,
106
119
  return shouldIgnoreDomEvent(view, event, api);
107
120
  }
108
121
  },
109
- transformCopied: function transformCopied(slice, _ref2) {
110
- var state = _ref2.state;
122
+ transformCopied: function transformCopied(slice, _ref3) {
123
+ var state = _ref3.state;
111
124
  var pluginState = syncedBlockPluginKey.getState(state);
112
125
  var syncBlockStore = pluginState === null || pluginState === void 0 ? void 0 : pluginState.syncBlockStore;
113
126
  var schema = state.schema;
114
- // Use setTimeout to dispatch transaction in next tick and avoid re-entrant dispatch
115
- setTimeout(function () {
116
- api === null || api === void 0 || api.core.actions.execute(function (_ref3) {
117
- var tr = _ref3.tr;
118
- return tr.setMeta(syncedBlockPluginKey, {
119
- activeFlag: {
120
- id: FLAG_ID.SYNC_BLOCK_COPIED
121
- }
122
- });
123
- });
124
- }, 0);
125
127
  if (!syncBlockStore) {
126
128
  return slice;
127
129
  }
128
130
  return mapSlice(slice, function (node) {
131
+ if (node.type.name === 'syncBlock') {
132
+ showCopiedFlag(api);
133
+ return node;
134
+ }
129
135
  if (node.type.name === 'bodiedSyncBlock' && node.attrs.resourceId) {
136
+ showCopiedFlag(api);
130
137
  var newResourceId = syncBlockStore.referenceManager.generateResourceIdForReference(node.attrs.resourceId);
131
138
  // Convert bodiedSyncBlock to syncBlock
132
139
  // The paste transformation will regenrate the localId
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { useIntl } from 'react-intl-next';
3
3
  import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
4
4
  import { SyncBlockLabelSharedCssClassName } from '@atlaskit/editor-common/sync-block';
5
- import { ConfluenceIcon } from '@atlaskit/logo';
5
+ import BlockSyncedIcon from '@atlaskit/icon-lab/core/block-synced';
6
6
  import { Text } from '@atlaskit/primitives/compiled';
7
7
  import Tooltip from '@atlaskit/tooltip';
8
8
  import VisuallyHidden from '@atlaskit/visually-hidden';
@@ -32,15 +32,17 @@ var SyncBlockLabelComponent = function SyncBlockLabelComponent(_ref) {
32
32
  ,
33
33
  className: SyncBlockLabelSharedCssClassName.labelClassName,
34
34
  "aria-describedby": ariaDescribedById
35
- }, /*#__PURE__*/React.createElement(ConfluenceIcon, {
36
- size: "xsmall",
37
- appearance: "neutral",
38
- shouldUseNewLogoDesign: true
35
+ }, /*#__PURE__*/React.createElement(BlockSyncedIcon, {
36
+ color: "var(--ds-icon-subtle, #505258)",
37
+ size: "small",
38
+ label: ""
39
39
  }), isSource || !title ? /*#__PURE__*/React.createElement(Text, {
40
- size: "small"
40
+ size: "small",
41
+ color: "color.text.subtle"
41
42
  }, formatMessage(messages.syncedBlockLabel)) : /*#__PURE__*/React.createElement(Text, {
42
43
  maxLines: 1,
43
- size: "small"
44
+ size: "small",
45
+ color: "color.text.subtle"
44
46
  }, title)), /*#__PURE__*/React.createElement(VisuallyHidden, {
45
47
  id: ariaDescribedById
46
48
  }, tooltipContent));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-synced-block",
3
- "version": "4.5.4",
3
+ "version": "4.5.6",
4
4
  "description": "SyncedBlock plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -45,11 +45,10 @@
45
45
  "@atlaskit/flag": "^17.6.0",
46
46
  "@atlaskit/icon": "29.1.0",
47
47
  "@atlaskit/icon-lab": "^5.12.0",
48
- "@atlaskit/logo": "^19.9.0",
49
48
  "@atlaskit/lozenge": "^13.1.0",
50
49
  "@atlaskit/modal-dialog": "^14.9.0",
51
50
  "@atlaskit/primitives": "^16.4.0",
52
- "@atlaskit/tmp-editor-statsig": "^15.10.0",
51
+ "@atlaskit/tmp-editor-statsig": "^15.12.0",
53
52
  "@atlaskit/tokens": "8.5.0",
54
53
  "@atlaskit/tooltip": "^20.11.0",
55
54
  "@atlaskit/visually-hidden": "^3.0.0",
@@ -57,7 +56,7 @@
57
56
  "react-intl-next": "npm:react-intl@^5.18.1"
58
57
  },
59
58
  "peerDependencies": {
60
- "@atlaskit/editor-common": "^110.43.0",
59
+ "@atlaskit/editor-common": "^110.44.0",
61
60
  "react": "^18.2.0"
62
61
  },
63
62
  "devDependencies": {