@atlaskit/editor-plugin-synced-block 12.0.5 → 12.0.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 +8 -0
- package/dist/cjs/editor-commands/index.js +8 -18
- package/dist/cjs/nodeviews/bodiedSyncedBlock.js +3 -7
- package/dist/cjs/nodeviews/syncedBlock.js +9 -15
- package/dist/cjs/pm-plugins/main.js +14 -42
- package/dist/cjs/pm-plugins/utils/handle-bodied-sync-block-removal.js +36 -54
- package/dist/cjs/syncedBlockPlugin.js +1 -4
- package/dist/cjs/ui/CreateSyncedBlockButton.js +23 -35
- package/dist/cjs/ui/CreateSyncedBlockDropdownItem.js +36 -47
- package/dist/cjs/ui/SyncBlockLabel.js +2 -13
- package/dist/cjs/ui/SyncBlockRendererWrapper.js +7 -9
- package/dist/cjs/ui/SyncedLocationDropdown.js +53 -116
- package/dist/cjs/ui/floating-toolbar.js +1 -2
- package/dist/es2019/editor-commands/index.js +8 -18
- package/dist/es2019/nodeviews/bodiedSyncedBlock.js +3 -7
- package/dist/es2019/nodeviews/syncedBlock.js +9 -15
- package/dist/es2019/pm-plugins/main.js +16 -41
- package/dist/es2019/pm-plugins/utils/handle-bodied-sync-block-removal.js +33 -51
- package/dist/es2019/syncedBlockPlugin.js +1 -4
- package/dist/es2019/ui/CreateSyncedBlockButton.js +25 -36
- package/dist/es2019/ui/CreateSyncedBlockDropdownItem.js +36 -47
- package/dist/es2019/ui/SyncBlockLabel.js +2 -13
- package/dist/es2019/ui/SyncBlockRendererWrapper.js +7 -9
- package/dist/es2019/ui/SyncedLocationDropdown.js +1 -58
- package/dist/es2019/ui/floating-toolbar.js +1 -2
- package/dist/esm/editor-commands/index.js +8 -18
- package/dist/esm/nodeviews/bodiedSyncedBlock.js +3 -7
- package/dist/esm/nodeviews/syncedBlock.js +9 -15
- package/dist/esm/pm-plugins/main.js +15 -43
- package/dist/esm/pm-plugins/utils/handle-bodied-sync-block-removal.js +36 -54
- package/dist/esm/syncedBlockPlugin.js +1 -4
- package/dist/esm/ui/CreateSyncedBlockButton.js +23 -35
- package/dist/esm/ui/CreateSyncedBlockDropdownItem.js +36 -47
- package/dist/esm/ui/SyncBlockLabel.js +2 -13
- package/dist/esm/ui/SyncBlockRendererWrapper.js +7 -9
- package/dist/esm/ui/SyncedLocationDropdown.js +53 -116
- package/dist/esm/ui/floating-toolbar.js +1 -2
- package/dist/types/pm-plugins/main.d.ts +2 -4
- package/package.json +1 -10
|
@@ -12,7 +12,6 @@ var _reactIntl = require("react-intl");
|
|
|
12
12
|
var _messages = require("@atlaskit/editor-common/messages");
|
|
13
13
|
var _syncBlock = require("@atlaskit/editor-common/sync-block");
|
|
14
14
|
var _blockSynced = _interopRequireDefault(require("@atlaskit/icon-lab/core/block-synced"));
|
|
15
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
16
15
|
var _compiled = require("@atlaskit/primitives/compiled");
|
|
17
16
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
18
17
|
var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
|
|
@@ -42,7 +41,7 @@ var SyncBlockLabelComponent = function SyncBlockLabelComponent(_ref) {
|
|
|
42
41
|
var tooltipContent = tooltipMessage;
|
|
43
42
|
if (contentUpdatedAt) {
|
|
44
43
|
var elapsedTime = (0, _time.formatElapsedTime)(contentUpdatedAt, intl);
|
|
45
|
-
tooltipContent =
|
|
44
|
+
tooltipContent = /*#__PURE__*/_react.default.createElement("div", null, title ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_compiled.Text, {
|
|
46
45
|
size: "small",
|
|
47
46
|
color: "color.text.inverse",
|
|
48
47
|
weight: "bold"
|
|
@@ -59,17 +58,7 @@ var SyncBlockLabelComponent = function SyncBlockLabelComponent(_ref) {
|
|
|
59
58
|
}, formatMessage(_messages.syncBlockMessages.referenceSyncBlockLastEdited)), /*#__PURE__*/_react.default.createElement(_compiled.Text, {
|
|
60
59
|
size: "small",
|
|
61
60
|
color: "color.text.inverse"
|
|
62
|
-
}, ' ', elapsedTime))
|
|
63
|
-
size: "small",
|
|
64
|
-
color: "color.text.inverse"
|
|
65
|
-
}, tooltipMessage), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_compiled.Text, {
|
|
66
|
-
size: "small",
|
|
67
|
-
color: "color.text.inverse",
|
|
68
|
-
weight: "bold"
|
|
69
|
-
}, formatMessage(_messages.syncBlockMessages.referenceSyncBlockLastEdited)), /*#__PURE__*/_react.default.createElement(_compiled.Text, {
|
|
70
|
-
size: "small",
|
|
71
|
-
color: "color.text.inverse"
|
|
72
|
-
}, elapsedTime));
|
|
61
|
+
}, ' ', elapsedTime));
|
|
73
62
|
}
|
|
74
63
|
setTooltipContent(tooltipContent);
|
|
75
64
|
}, [contentUpdatedAt, formatMessage, intl, title, tooltipMessage]);
|
|
@@ -9,7 +9,6 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
9
9
|
var _bindEventListener = require("bind-event-listener");
|
|
10
10
|
var _syncBlock = require("@atlaskit/editor-common/sync-block");
|
|
11
11
|
var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
|
|
12
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
13
12
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
14
13
|
var _SyncBlockLabel = require("./SyncBlockLabel");
|
|
15
14
|
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); }
|
|
@@ -27,7 +26,6 @@ var SyncBlockRendererWrapperComponent = function SyncBlockRendererWrapperCompone
|
|
|
27
26
|
var contentUpdatedAt = syncBlockFetchResult === null || syncBlockFetchResult === void 0 || (_syncBlockFetchResult = syncBlockFetchResult.syncBlockInstance) === null || _syncBlockFetchResult === void 0 || (_syncBlockFetchResult = _syncBlockFetchResult.data) === null || _syncBlockFetchResult === void 0 ? void 0 : _syncBlockFetchResult.contentUpdatedAt;
|
|
28
27
|
var isUnpublishedBlock = ((_syncBlockFetchResult2 = syncBlockFetchResult.syncBlockInstance) === null || _syncBlockFetchResult2 === void 0 || (_syncBlockFetchResult2 = _syncBlockFetchResult2.data) === null || _syncBlockFetchResult2 === void 0 ? void 0 : _syncBlockFetchResult2.status) === 'unpublished';
|
|
29
28
|
var isUnsyncedBlock = isUnpublishedBlock || (syncBlockFetchResult === null || syncBlockFetchResult === void 0 || (_syncBlockFetchResult3 = syncBlockFetchResult.syncBlockInstance) === null || _syncBlockFetchResult3 === void 0 || (_syncBlockFetchResult3 = _syncBlockFetchResult3.error) === null || _syncBlockFetchResult3 === void 0 ? void 0 : _syncBlockFetchResult3.type) === _editorSyncedBlockProvider.SyncBlockError.NotFound;
|
|
30
|
-
var isTextSelectionEnabled = (0, _platformFeatureFlags.fg)('platform_synced_block_patch_14');
|
|
31
29
|
|
|
32
30
|
// Evaluated unconditionally so the experiment exposure is tracked correctly
|
|
33
31
|
// (recorded on every render, not lazily on first click).
|
|
@@ -50,7 +48,7 @@ var SyncBlockRendererWrapperComponent = function SyncBlockRendererWrapperCompone
|
|
|
50
48
|
var rendererRef = (0, _react.useRef)(null);
|
|
51
49
|
(0, _react.useEffect)(function () {
|
|
52
50
|
var containerEl = rendererRef.current;
|
|
53
|
-
if (!containerEl || !
|
|
51
|
+
if (!containerEl || !isSyncBlockActivationEnabled) {
|
|
54
52
|
return;
|
|
55
53
|
}
|
|
56
54
|
var unbind = (0, _bindEventListener.bind)(containerEl, {
|
|
@@ -70,25 +68,25 @@ var SyncBlockRendererWrapperComponent = function SyncBlockRendererWrapperCompone
|
|
|
70
68
|
}
|
|
71
69
|
});
|
|
72
70
|
return unbind;
|
|
73
|
-
}, [
|
|
71
|
+
}, [isSyncBlockActivationEnabled]);
|
|
74
72
|
return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
|
|
75
73
|
ref: rendererRef,
|
|
76
74
|
"data-testid": SyncBlockRendererWrapperDataId
|
|
77
75
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
|
|
78
76
|
,
|
|
79
77
|
className: _syncBlock.SyncBlockSharedCssClassName.renderer,
|
|
80
|
-
contentEditable:
|
|
78
|
+
contentEditable: true,
|
|
81
79
|
suppressContentEditableWarning: true
|
|
82
80
|
// Prevent the contentEditable div from being keyboard-focusable.
|
|
83
81
|
// It is only used to enable text selection, not as an input target.
|
|
84
82
|
// eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
|
|
85
83
|
,
|
|
86
|
-
tabIndex:
|
|
87
|
-
onBeforeInput:
|
|
88
|
-
onPaste:
|
|
84
|
+
tabIndex: -1,
|
|
85
|
+
onBeforeInput: preventInput,
|
|
86
|
+
onPaste: preventInput
|
|
89
87
|
// eslint-disable-next-line @atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop
|
|
90
88
|
,
|
|
91
|
-
onDrop:
|
|
89
|
+
onDrop: preventInput
|
|
92
90
|
}, syncedBlockRenderer({
|
|
93
91
|
syncBlockFetchResult: syncBlockFetchResult,
|
|
94
92
|
api: api
|
|
@@ -13,11 +13,9 @@ var React = _react;
|
|
|
13
13
|
var _runtime = require("@compiled/react/runtime");
|
|
14
14
|
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
15
15
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
16
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
17
|
-
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
18
16
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
19
17
|
var _react2 = require("@compiled/react");
|
|
20
|
-
var _dropdownMenu =
|
|
18
|
+
var _dropdownMenu = require("@atlaskit/dropdown-menu");
|
|
21
19
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
22
20
|
var _messages = require("@atlaskit/editor-common/messages");
|
|
23
21
|
var _syncBlock = require("@atlaskit/editor-common/sync-block");
|
|
@@ -37,7 +35,6 @@ var _subtasks = _interopRequireDefault(require("@atlaskit/icon/core/subtasks"));
|
|
|
37
35
|
var _task = _interopRequireDefault(require("@atlaskit/icon/core/task"));
|
|
38
36
|
var _logo = require("@atlaskit/logo");
|
|
39
37
|
var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
|
|
40
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
41
38
|
var _compiled = require("@atlaskit/primitives/compiled");
|
|
42
39
|
var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
|
|
43
40
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
@@ -45,7 +42,6 @@ var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equa
|
|
|
45
42
|
var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
|
|
46
43
|
var _types = require("../types");
|
|
47
44
|
var _SyncedLocationsEmptyStateIllustration = require("./assets/SyncedLocationsEmptyStateIllustration");
|
|
48
|
-
var _excluded = ["triggerRef"];
|
|
49
45
|
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); }
|
|
50
46
|
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
|
|
51
47
|
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
@@ -317,16 +313,6 @@ var SyncedLocationDropdown = exports.SyncedLocationDropdown = function SyncedLoc
|
|
|
317
313
|
localId = _ref4.localId,
|
|
318
314
|
api = _ref4.api,
|
|
319
315
|
floatingToolbarRenderContext = _ref4.floatingToolbarRenderContext;
|
|
320
|
-
if (!(0, _platformFeatureFlags.fg)('platform_synced_block_patch_13')) {
|
|
321
|
-
return /*#__PURE__*/React.createElement(LegacySyncedLocationDropdown, {
|
|
322
|
-
syncBlockStore: syncBlockStore,
|
|
323
|
-
resourceId: resourceId,
|
|
324
|
-
intl: intl,
|
|
325
|
-
isSource: isSource,
|
|
326
|
-
localId: localId,
|
|
327
|
-
api: api
|
|
328
|
-
});
|
|
329
|
-
}
|
|
330
316
|
return /*#__PURE__*/React.createElement(EditorPositionedSyncedLocationDropdown, {
|
|
331
317
|
syncBlockStore: syncBlockStore,
|
|
332
318
|
resourceId: resourceId,
|
|
@@ -407,67 +393,18 @@ var EditorPositionedSyncedLocationDropdown = function EditorPositionedSyncedLoca
|
|
|
407
393
|
}
|
|
408
394
|
}, content);
|
|
409
395
|
};
|
|
410
|
-
var
|
|
396
|
+
var SyncedLocationDropdownWithCount = exports.SyncedLocationDropdownWithCount = function SyncedLocationDropdownWithCount(_ref6) {
|
|
411
397
|
var syncBlockStore = _ref6.syncBlockStore,
|
|
412
398
|
resourceId = _ref6.resourceId,
|
|
413
399
|
intl = _ref6.intl,
|
|
414
400
|
isSource = _ref6.isSource,
|
|
415
401
|
localId = _ref6.localId,
|
|
416
|
-
api = _ref6.api
|
|
417
|
-
|
|
402
|
+
api = _ref6.api,
|
|
403
|
+
floatingToolbarRenderContext = _ref6.floatingToolbarRenderContext;
|
|
418
404
|
var _useState3 = (0, _react.useState)(false),
|
|
419
405
|
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
420
406
|
isOpen = _useState4[0],
|
|
421
407
|
setIsOpen = _useState4[1];
|
|
422
|
-
var content = isOpen ? /*#__PURE__*/React.createElement(DropdownContent, {
|
|
423
|
-
syncBlockStore: syncBlockStore,
|
|
424
|
-
resourceId: resourceId,
|
|
425
|
-
intl: intl,
|
|
426
|
-
isSource: isSource,
|
|
427
|
-
localId: localId,
|
|
428
|
-
api: api
|
|
429
|
-
}) : null;
|
|
430
|
-
return /*#__PURE__*/React.createElement(_dropdownMenu.default, {
|
|
431
|
-
isOpen: isOpen
|
|
432
|
-
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
|
|
433
|
-
,
|
|
434
|
-
onOpenChange: function onOpenChange(_ref7) {
|
|
435
|
-
var isOpen = _ref7.isOpen;
|
|
436
|
-
return setIsOpen(isOpen);
|
|
437
|
-
},
|
|
438
|
-
testId: SYNCED_LOCATIONS_DROPDOWN_TEST_ID
|
|
439
|
-
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
|
|
440
|
-
,
|
|
441
|
-
trigger: function trigger(_ref8) {
|
|
442
|
-
var triggerRef = _ref8.triggerRef,
|
|
443
|
-
triggerProps = (0, _objectWithoutProperties2.default)(_ref8, _excluded);
|
|
444
|
-
return /*#__PURE__*/React.createElement(_ui.FloatingToolbarButton, (0, _extends2.default)({
|
|
445
|
-
ref: triggerRef,
|
|
446
|
-
areAnyNewToolbarFlagsEnabled: true,
|
|
447
|
-
selected: isOpen,
|
|
448
|
-
iconAfter: /*#__PURE__*/React.createElement(_chevronDown.default, {
|
|
449
|
-
color: "currentColor",
|
|
450
|
-
spacing: "spacious",
|
|
451
|
-
label: "",
|
|
452
|
-
size: "small"
|
|
453
|
-
})
|
|
454
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
455
|
-
}, triggerProps), triggerTitle);
|
|
456
|
-
}
|
|
457
|
-
}, content);
|
|
458
|
-
};
|
|
459
|
-
var SyncedLocationDropdownWithCount = exports.SyncedLocationDropdownWithCount = function SyncedLocationDropdownWithCount(_ref9) {
|
|
460
|
-
var syncBlockStore = _ref9.syncBlockStore,
|
|
461
|
-
resourceId = _ref9.resourceId,
|
|
462
|
-
intl = _ref9.intl,
|
|
463
|
-
isSource = _ref9.isSource,
|
|
464
|
-
localId = _ref9.localId,
|
|
465
|
-
api = _ref9.api,
|
|
466
|
-
floatingToolbarRenderContext = _ref9.floatingToolbarRenderContext;
|
|
467
|
-
var _useState5 = (0, _react.useState)(false),
|
|
468
|
-
_useState6 = (0, _slicedToArray2.default)(_useState5, 2),
|
|
469
|
-
isOpen = _useState6[0],
|
|
470
|
-
setIsOpen = _useState6[1];
|
|
471
408
|
var _useReferenceData = useReferenceData({
|
|
472
409
|
intl: intl,
|
|
473
410
|
isSource: isSource,
|
|
@@ -478,8 +415,8 @@ var SyncedLocationDropdownWithCount = exports.SyncedLocationDropdownWithCount =
|
|
|
478
415
|
fetchStatus = _useReferenceData.fetchStatus,
|
|
479
416
|
referenceData = _useReferenceData.referenceData;
|
|
480
417
|
var referenceCount = (0, _react.useMemo)(function () {
|
|
481
|
-
return referenceData.filter(function (
|
|
482
|
-
var isSourceItem =
|
|
418
|
+
return referenceData.filter(function (_ref7) {
|
|
419
|
+
var isSourceItem = _ref7.isSource;
|
|
483
420
|
return !isSourceItem;
|
|
484
421
|
}).length;
|
|
485
422
|
}, [referenceData]);
|
|
@@ -547,25 +484,25 @@ var SyncedLocationDropdownWithCount = exports.SyncedLocationDropdownWithCount =
|
|
|
547
484
|
}
|
|
548
485
|
}, content);
|
|
549
486
|
};
|
|
550
|
-
var DropdownContent = function DropdownContent(
|
|
551
|
-
var syncBlockStore =
|
|
552
|
-
resourceId =
|
|
553
|
-
intl =
|
|
554
|
-
isSource =
|
|
555
|
-
localId =
|
|
556
|
-
api =
|
|
557
|
-
var
|
|
487
|
+
var DropdownContent = function DropdownContent(_ref8) {
|
|
488
|
+
var syncBlockStore = _ref8.syncBlockStore,
|
|
489
|
+
resourceId = _ref8.resourceId,
|
|
490
|
+
intl = _ref8.intl,
|
|
491
|
+
isSource = _ref8.isSource,
|
|
492
|
+
localId = _ref8.localId,
|
|
493
|
+
api = _ref8.api;
|
|
494
|
+
var _useState5 = (0, _react.useState)('none'),
|
|
495
|
+
_useState6 = (0, _slicedToArray2.default)(_useState5, 2),
|
|
496
|
+
fetchStatus = _useState6[0],
|
|
497
|
+
setFetchStatus = _useState6[1];
|
|
498
|
+
var _useState7 = (0, _react.useState)([]),
|
|
558
499
|
_useState8 = (0, _slicedToArray2.default)(_useState7, 2),
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
var _useState9 = (0, _react.useState)([]),
|
|
562
|
-
_useState0 = (0, _slicedToArray2.default)(_useState9, 2),
|
|
563
|
-
referenceData = _useState0[0],
|
|
564
|
-
setReferenceData = _useState0[1];
|
|
500
|
+
referenceData = _useState8[0],
|
|
501
|
+
setReferenceData = _useState8[1];
|
|
565
502
|
(0, _react.useEffect)(function () {
|
|
566
503
|
setFetchStatus('loading');
|
|
567
504
|
var getReferenceData = /*#__PURE__*/function () {
|
|
568
|
-
var
|
|
505
|
+
var _ref9 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
|
|
569
506
|
var response;
|
|
570
507
|
return _regenerator.default.wrap(function (_context) {
|
|
571
508
|
while (1) switch (_context.prev = _context.next) {
|
|
@@ -590,7 +527,7 @@ var DropdownContent = function DropdownContent(_ref1) {
|
|
|
590
527
|
}, _callee);
|
|
591
528
|
}));
|
|
592
529
|
return function getReferenceData() {
|
|
593
|
-
return
|
|
530
|
+
return _ref9.apply(this, arguments);
|
|
594
531
|
};
|
|
595
532
|
}();
|
|
596
533
|
void getReferenceData();
|
|
@@ -603,26 +540,26 @@ var DropdownContent = function DropdownContent(_ref1) {
|
|
|
603
540
|
referenceData: referenceData
|
|
604
541
|
});
|
|
605
542
|
};
|
|
606
|
-
var useReferenceData = function useReferenceData(
|
|
607
|
-
var syncBlockStore =
|
|
608
|
-
resourceId =
|
|
609
|
-
intl =
|
|
610
|
-
isSource =
|
|
611
|
-
localId =
|
|
612
|
-
var
|
|
543
|
+
var useReferenceData = function useReferenceData(_ref0) {
|
|
544
|
+
var syncBlockStore = _ref0.syncBlockStore,
|
|
545
|
+
resourceId = _ref0.resourceId,
|
|
546
|
+
intl = _ref0.intl,
|
|
547
|
+
isSource = _ref0.isSource,
|
|
548
|
+
localId = _ref0.localId;
|
|
549
|
+
var _useState9 = (0, _react.useState)(function () {
|
|
613
550
|
return isSource && syncBlockStore.sourceManager.isNewSourceBlock(resourceId);
|
|
614
551
|
}),
|
|
615
|
-
|
|
616
|
-
isNewSourceBlock =
|
|
617
|
-
var
|
|
552
|
+
_useState0 = (0, _slicedToArray2.default)(_useState9, 1),
|
|
553
|
+
isNewSourceBlock = _useState0[0];
|
|
554
|
+
var _useState1 = (0, _react.useState)(function () {
|
|
618
555
|
return {
|
|
619
556
|
fetchStatus: isNewSourceBlock ? 'success' : 'loading',
|
|
620
557
|
referenceData: []
|
|
621
558
|
};
|
|
622
559
|
}),
|
|
623
|
-
|
|
624
|
-
state =
|
|
625
|
-
setState =
|
|
560
|
+
_useState10 = (0, _slicedToArray2.default)(_useState1, 2),
|
|
561
|
+
state = _useState10[0],
|
|
562
|
+
setState = _useState10[1];
|
|
626
563
|
(0, _react.useEffect)(function () {
|
|
627
564
|
var isCurrentRequest = true;
|
|
628
565
|
setState({
|
|
@@ -630,7 +567,7 @@ var useReferenceData = function useReferenceData(_ref11) {
|
|
|
630
567
|
referenceData: []
|
|
631
568
|
});
|
|
632
569
|
var getReferenceData = /*#__PURE__*/function () {
|
|
633
|
-
var
|
|
570
|
+
var _ref1 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
|
|
634
571
|
var response;
|
|
635
572
|
return _regenerator.default.wrap(function (_context2) {
|
|
636
573
|
while (1) switch (_context2.prev = _context2.next) {
|
|
@@ -669,7 +606,7 @@ var useReferenceData = function useReferenceData(_ref11) {
|
|
|
669
606
|
}, _callee2);
|
|
670
607
|
}));
|
|
671
608
|
return function getReferenceData() {
|
|
672
|
-
return
|
|
609
|
+
return _ref1.apply(this, arguments);
|
|
673
610
|
};
|
|
674
611
|
}();
|
|
675
612
|
void getReferenceData();
|
|
@@ -682,10 +619,10 @@ var useReferenceData = function useReferenceData(_ref11) {
|
|
|
682
619
|
referenceData: state.referenceData
|
|
683
620
|
};
|
|
684
621
|
};
|
|
685
|
-
var SyncedLocationTriggerContent = function SyncedLocationTriggerContent(
|
|
686
|
-
var intl =
|
|
687
|
-
fetchStatus =
|
|
688
|
-
referenceCount =
|
|
622
|
+
var SyncedLocationTriggerContent = function SyncedLocationTriggerContent(_ref10) {
|
|
623
|
+
var intl = _ref10.intl,
|
|
624
|
+
fetchStatus = _ref10.fetchStatus,
|
|
625
|
+
referenceCount = _ref10.referenceCount;
|
|
689
626
|
var formatMessage = intl.formatMessage;
|
|
690
627
|
var triggerTitle = formatMessage(_messages.syncBlockMessages.syncedLocationDropdownTitle);
|
|
691
628
|
var syncedLocationCount = referenceCount === 0 ? 0 : referenceCount + 1;
|
|
@@ -710,12 +647,12 @@ var SyncedLocationTriggerContent = function SyncedLocationTriggerContent(_ref13)
|
|
|
710
647
|
return triggerTitle;
|
|
711
648
|
}
|
|
712
649
|
};
|
|
713
|
-
var DropdownContentWithReferenceData = function DropdownContentWithReferenceData(
|
|
714
|
-
var resourceId =
|
|
715
|
-
intl =
|
|
716
|
-
api =
|
|
717
|
-
fetchStatus =
|
|
718
|
-
referenceData =
|
|
650
|
+
var DropdownContentWithReferenceData = function DropdownContentWithReferenceData(_ref11) {
|
|
651
|
+
var resourceId = _ref11.resourceId,
|
|
652
|
+
intl = _ref11.intl,
|
|
653
|
+
api = _ref11.api,
|
|
654
|
+
fetchStatus = _ref11.fetchStatus,
|
|
655
|
+
referenceData = _ref11.referenceData;
|
|
719
656
|
var formatMessage = intl.formatMessage;
|
|
720
657
|
var handleLocationClick = function handleLocationClick() {
|
|
721
658
|
var _api$analytics;
|
|
@@ -789,14 +726,14 @@ var DropdownContentWithReferenceData = function DropdownContentWithReferenceData
|
|
|
789
726
|
xcss: (0, _react2.cx)(styles.dropdownContent, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_sync_block_activation', 'isEnabled', true) && fetchStatus === 'success' && referenceData.length === 0 && styles.activationDropdownContent, shouldApplyMinHeight(fetchStatus, referenceData.length) && styles.containerWithMinHeight)
|
|
790
727
|
}, content());
|
|
791
728
|
};
|
|
792
|
-
var LoadingScreen = function LoadingScreen(
|
|
793
|
-
var formatMessage =
|
|
729
|
+
var LoadingScreen = function LoadingScreen(_ref12) {
|
|
730
|
+
var formatMessage = _ref12.formatMessage;
|
|
794
731
|
return /*#__PURE__*/React.createElement(_compiled.Box, null, /*#__PURE__*/React.createElement(_spinner.default, {
|
|
795
732
|
label: formatMessage(_messages.syncBlockMessages.syncedLocationDropdownLoading)
|
|
796
733
|
}));
|
|
797
734
|
};
|
|
798
|
-
var ErrorScreen = function ErrorScreen(
|
|
799
|
-
var formatMessage =
|
|
735
|
+
var ErrorScreen = function ErrorScreen(_ref13) {
|
|
736
|
+
var formatMessage = _ref13.formatMessage;
|
|
800
737
|
return /*#__PURE__*/React.createElement(_compiled.Box, {
|
|
801
738
|
xcss: styles.errorContainer,
|
|
802
739
|
testId: "synced-locations-dropdown-content-error"
|
|
@@ -812,8 +749,8 @@ var ErrorScreen = function ErrorScreen(_ref16) {
|
|
|
812
749
|
size: "medium"
|
|
813
750
|
}, formatMessage(_messages.syncBlockMessages.syncedLocationDropdownError)));
|
|
814
751
|
};
|
|
815
|
-
var NoResultScreen = function NoResultScreen(
|
|
816
|
-
var formatMessage =
|
|
752
|
+
var NoResultScreen = function NoResultScreen(_ref14) {
|
|
753
|
+
var formatMessage = _ref14.formatMessage;
|
|
817
754
|
return (0, _expValEquals.expValEquals)('platform_editor_sync_block_activation', 'isEnabled', true) ? /*#__PURE__*/React.createElement(_compiled.Box, {
|
|
818
755
|
xcss: styles.activationNoResultsContainer,
|
|
819
756
|
testId: "synced-locations-dropdown-content-no-results"
|
|
@@ -21,7 +21,6 @@ var _delete = _interopRequireDefault(require("@atlaskit/icon/core/delete"));
|
|
|
21
21
|
var _edit = _interopRequireDefault(require("@atlaskit/icon/core/edit"));
|
|
22
22
|
var _linkBroken = _interopRequireDefault(require("@atlaskit/icon/core/link-broken"));
|
|
23
23
|
var _megaphone = _interopRequireDefault(require("@atlaskit/icon/core/megaphone"));
|
|
24
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
25
24
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
26
25
|
var _editorCommands = require("../editor-commands");
|
|
27
26
|
var _utils2 = require("../pm-plugins/utils/utils");
|
|
@@ -163,7 +162,7 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(stat
|
|
|
163
162
|
}, hoverDecorationProps(nodeType, _consts.akEditorSelectedNodeClassName));
|
|
164
163
|
items.push(editSourceButton);
|
|
165
164
|
}
|
|
166
|
-
if (!isSyncBlockActivationEnabled
|
|
165
|
+
if (!isSyncBlockActivationEnabled) {
|
|
167
166
|
var separator = {
|
|
168
167
|
type: 'separator'
|
|
169
168
|
};
|
|
@@ -5,7 +5,6 @@ import { DOMSerializer, Fragment } from '@atlaskit/editor-prosemirror/model';
|
|
|
5
5
|
import { NodeSelection, Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
|
|
6
6
|
import { findSelectedNodeOfType, removeParentNodeOfType, removeSelectedNode, safeInsert } from '@atlaskit/editor-prosemirror/utils';
|
|
7
7
|
import { getSourceProductFromResourceIdSafe } from '@atlaskit/editor-synced-block-provider/utils';
|
|
8
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
9
8
|
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
10
9
|
import { creationMetaKey, deleteMechanismMetaKey, syncedBlockPluginKey } from '../pm-plugins/main';
|
|
11
10
|
import { canBeConvertedToSyncBlock, deferDispatch, findSyncBlock, findSyncBlockOrBodiedSyncBlock, isBodiedSyncBlockNode } from '../pm-plugins/utils/utils';
|
|
@@ -111,9 +110,7 @@ export const createSyncedBlock = ({
|
|
|
111
110
|
// safeInsert does not move the selection into the new block, so place the
|
|
112
111
|
// caret inside the block's empty paragraph so typing continues inside the
|
|
113
112
|
// synced block (EDITOR-7949).
|
|
114
|
-
|
|
115
|
-
tr = placeCaretInsideBodiedSyncBlock(tr, newBodiedSyncBlockNode.attrs.localId);
|
|
116
|
-
}
|
|
113
|
+
tr = placeCaretInsideBodiedSyncBlock(tr, newBodiedSyncBlockNode.attrs.localId);
|
|
117
114
|
}
|
|
118
115
|
} else {
|
|
119
116
|
const conversionInfo = canBeConvertedToSyncBlock(tr.selection);
|
|
@@ -144,14 +141,10 @@ export const createSyncedBlock = ({
|
|
|
144
141
|
return false;
|
|
145
142
|
}
|
|
146
143
|
tr.replaceWith(conversionInfo.from, conversionInfo.to, newBodiedSyncBlockNode).scrollIntoView();
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
} else {
|
|
152
|
-
// set selection to the start of the previous selection for the position taken up by the start of the new synced block
|
|
153
|
-
tr.setSelection(TextSelection.create(tr.doc, conversionInfo.from));
|
|
154
|
-
}
|
|
144
|
+
|
|
145
|
+
// Place the caret on the first editable position inside the converted
|
|
146
|
+
// content so typing continues inside the synced block (EDITOR-7949).
|
|
147
|
+
tr = placeCaretInsideBodiedSyncBlock(tr, newBodiedSyncBlockNode.attrs.localId);
|
|
155
148
|
}
|
|
156
149
|
|
|
157
150
|
// Stash creation-type signals on the final transaction (after any typeahead
|
|
@@ -255,7 +248,7 @@ const copySyncedBlockReferenceToClipboardInternal = (schema, selection, syncBloc
|
|
|
255
248
|
attributes: {
|
|
256
249
|
resourceId: referenceSyncBlockNode.attrs.resourceId,
|
|
257
250
|
inputMethod,
|
|
258
|
-
...(sourceJoinKey &&
|
|
251
|
+
...(sourceJoinKey && {
|
|
259
252
|
blockInstanceId: sourceJoinKey
|
|
260
253
|
})
|
|
261
254
|
}
|
|
@@ -340,11 +333,8 @@ export const removeSyncedBlock = api => (state, dispatch, _view) => {
|
|
|
340
333
|
}
|
|
341
334
|
|
|
342
335
|
// Tag the transaction so analytics can report this as `deleteButton` rather
|
|
343
|
-
// than a keyboard delete (both produce a plain ReplaceStep).
|
|
344
|
-
|
|
345
|
-
if (fg('platform_editor_blocks_patch_4')) {
|
|
346
|
-
removeTr.setMeta(deleteMechanismMetaKey, 'deleteButton');
|
|
347
|
-
}
|
|
336
|
+
// than a keyboard delete (both produce a plain ReplaceStep).
|
|
337
|
+
removeTr.setMeta(deleteMechanismMetaKey, 'deleteButton');
|
|
348
338
|
dispatch(removeTr);
|
|
349
339
|
api === null || api === void 0 ? void 0 : api.core.actions.focus();
|
|
350
340
|
return true;
|
|
@@ -5,7 +5,6 @@ import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
|
|
|
5
5
|
import { BodiedSyncBlockSharedCssClassName } from '@atlaskit/editor-common/sync-block';
|
|
6
6
|
import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity';
|
|
7
7
|
import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
|
|
8
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
9
8
|
import { SyncBlockLabel } from '../ui/SyncBlockLabel';
|
|
10
9
|
import { isEmptySourceSyncBlock } from './isEmptySourceSyncBlock';
|
|
11
10
|
const toDOM = node => ['div', {
|
|
@@ -39,15 +38,12 @@ export class BodiedSyncBlock {
|
|
|
39
38
|
// eslint-disable-next-line @atlaskit/platform/no-direct-document-usage -- NodeView DOM must be created against active runtime document
|
|
40
39
|
labelContainer = document.createElement('div');
|
|
41
40
|
this.dom.appendChild(labelContainer);
|
|
42
|
-
} else
|
|
43
|
-
// Render the label into a separate container
|
|
44
|
-
//
|
|
45
|
-
// the ProseMirror contentDOM.
|
|
41
|
+
} else {
|
|
42
|
+
// Render the label into a separate container so portal implementations
|
|
43
|
+
// that write directly into the target do not clobber contentDOM.
|
|
46
44
|
// eslint-disable-next-line @atlaskit/platform/no-direct-document-usage -- NodeView DOM must be created against active runtime document
|
|
47
45
|
labelContainer = document.createElement('div');
|
|
48
46
|
this.dom.appendChild(labelContainer);
|
|
49
|
-
} else {
|
|
50
|
-
labelContainer = this.dom;
|
|
51
47
|
}
|
|
52
48
|
this.labelKey = crypto.randomUUID();
|
|
53
49
|
this.nodeViewPortalProviderAPI.render(() => {
|
|
@@ -5,7 +5,6 @@ import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
|
|
|
5
5
|
import ReactNodeView from '@atlaskit/editor-common/react-node-view';
|
|
6
6
|
import { SyncBlockSharedCssClassName, SyncBlockLabelSharedCssClassName, SyncBlockActionsProvider } from '@atlaskit/editor-common/sync-block';
|
|
7
7
|
import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
|
|
8
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
9
8
|
import { removeSyncedBlockAtPos } from '../editor-commands';
|
|
10
9
|
import { SyncBlockRendererWrapper } from '../ui/SyncBlockRendererWrapper';
|
|
11
10
|
import { SyncBlockSSRReactContextsProvider } from '../ui/SyncBlockSSRReactContextsProvider';
|
|
@@ -46,17 +45,15 @@ export class SyncBlock extends ReactNodeView {
|
|
|
46
45
|
// eslint-disable-next-line @atlaskit/platform/no-direct-document-usage -- NodeView DOM must be created against active runtime document
|
|
47
46
|
const domRef = document.createElement('div');
|
|
48
47
|
domRef.classList.add(SyncBlockSharedCssClassName.prefix);
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
domRef.addEventListener('dragstart', this.dragStartHandler);
|
|
59
|
-
}
|
|
48
|
+
// Prevent native browser drag on the contentEditable="false" wrapper.
|
|
49
|
+
// Without this, clicking in empty space (outside the contentEditable
|
|
50
|
+
// renderer but inside the domRef) initiates a native element drag.
|
|
51
|
+
domRef.draggable = false;
|
|
52
|
+
this.dragStartHandler = e => {
|
|
53
|
+
e.preventDefault();
|
|
54
|
+
};
|
|
55
|
+
// eslint-disable-next-line @atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop, @repo/internal/dom-events/no-unsafe-event-listeners
|
|
56
|
+
domRef.addEventListener('dragstart', this.dragStartHandler);
|
|
60
57
|
return domRef;
|
|
61
58
|
}
|
|
62
59
|
|
|
@@ -87,9 +84,6 @@ export class SyncBlock extends ReactNodeView {
|
|
|
87
84
|
* native text selection and preventing browser drag behaviour.
|
|
88
85
|
*/
|
|
89
86
|
stopEvent(event) {
|
|
90
|
-
if (!fg('platform_synced_block_patch_14')) {
|
|
91
|
-
return false;
|
|
92
|
-
}
|
|
93
87
|
const target = event.target;
|
|
94
88
|
if (!(target instanceof Element)) {
|
|
95
89
|
return false;
|