@atlaskit/editor-plugin-insert-block 8.7.14 → 9.0.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.
- package/CHANGELOG.md +12 -0
- package/dist/cjs/pm-plugins/experiences/toolbar-action-experiences.js +13 -15
- package/dist/cjs/pm-plugins/experiences/toolbar-experience-utils.js +2 -69
- package/dist/cjs/ui/ElementBrowser/InsertMenu.js +1 -1
- package/dist/cjs/ui/ToolbarInsertBlock/dropdown-button.js +1 -1
- package/dist/cjs/ui/ToolbarInsertBlock/index.js +4 -3
- package/dist/es2019/pm-plugins/experiences/toolbar-action-experiences.js +15 -17
- package/dist/es2019/pm-plugins/experiences/toolbar-experience-utils.js +1 -62
- package/dist/es2019/ui/ElementBrowser/InsertMenu.js +1 -1
- package/dist/es2019/ui/ToolbarInsertBlock/dropdown-button.js +1 -1
- package/dist/es2019/ui/ToolbarInsertBlock/index.js +5 -2
- package/dist/esm/pm-plugins/experiences/toolbar-action-experiences.js +14 -17
- package/dist/esm/pm-plugins/experiences/toolbar-experience-utils.js +1 -68
- package/dist/esm/ui/ElementBrowser/InsertMenu.js +1 -1
- package/dist/esm/ui/ToolbarInsertBlock/dropdown-button.js +1 -1
- package/dist/esm/ui/ToolbarInsertBlock/index.js +5 -2
- package/dist/types/pm-plugins/experiences/toolbar-action-experiences.d.ts +1 -1
- package/dist/types/pm-plugins/experiences/toolbar-experience-utils.d.ts +0 -12
- package/dist/types/ui/ElementRail/useInsertMenuRailItems.d.ts +2 -1
- package/dist/types/ui/ToolbarInsertBlock/create-items.d.ts +2 -1
- package/dist/types/ui/ToolbarInsertBlock/index.d.ts +5 -5
- package/dist/types/ui/toolbar-components/hooks/useEmojiPickerPopup.d.ts +3 -3
- package/dist/types/ui/toolbar-components/hooks/useTableSelectorPopup.d.ts +3 -3
- package/dist/types-ts4.5/pm-plugins/experiences/toolbar-action-experiences.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/experiences/toolbar-experience-utils.d.ts +0 -12
- package/dist/types-ts4.5/ui/ElementRail/useInsertMenuRailItems.d.ts +2 -1
- package/dist/types-ts4.5/ui/ToolbarInsertBlock/create-items.d.ts +2 -1
- package/dist/types-ts4.5/ui/ToolbarInsertBlock/index.d.ts +5 -5
- package/dist/types-ts4.5/ui/toolbar-components/hooks/useEmojiPickerPopup.d.ts +3 -3
- package/dist/types-ts4.5/ui/toolbar-components/hooks/useTableSelectorPopup.d.ts +3 -3
- package/package.json +30 -30
package/CHANGELOG.md
CHANGED
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
3
4
|
Object.defineProperty(exports, "__esModule", {
|
|
4
5
|
value: true
|
|
5
6
|
});
|
|
6
7
|
exports.getToolbarActionExperiencesPlugin = void 0;
|
|
8
|
+
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
7
9
|
var _bindEventListener = require("bind-event-listener");
|
|
8
10
|
var _browserApis = require("@atlaskit/browser-apis");
|
|
9
11
|
var _experiences = require("@atlaskit/editor-common/experiences");
|
|
@@ -36,22 +38,21 @@ var getToolbarActionExperiencesPlugin = exports.getToolbarActionExperiencesPlugi
|
|
|
36
38
|
}
|
|
37
39
|
return (_lastClickedToolbarBu = lastClickedToolbarButton.closest('[data-toolbar-component="button-group"]')) !== null && _lastClickedToolbarBu !== void 0 ? _lastClickedToolbarBu : lastClickedToolbarButton;
|
|
38
40
|
};
|
|
39
|
-
var
|
|
40
|
-
var
|
|
41
|
-
|
|
42
|
-
|
|
41
|
+
var observeConfigs = function observeConfigs() {
|
|
42
|
+
var narrowTarget = (0, _experiences.getSelectionAncestorDOM)(editorView);
|
|
43
|
+
var editorDom = getEditorDom();
|
|
44
|
+
return [].concat((0, _toConsumableArray2.default)(narrowTarget ? [{
|
|
45
|
+
target: narrowTarget,
|
|
43
46
|
options: {
|
|
44
|
-
childList: true
|
|
47
|
+
childList: true,
|
|
48
|
+
subtree: true
|
|
45
49
|
}
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
var rootObserveConfig = function rootObserveConfig() {
|
|
49
|
-
return {
|
|
50
|
-
target: getEditorDom(),
|
|
50
|
+
}] : []), (0, _toConsumableArray2.default)(editorDom ? [{
|
|
51
|
+
target: editorDom,
|
|
51
52
|
options: {
|
|
52
53
|
childList: true
|
|
53
54
|
}
|
|
54
|
-
};
|
|
55
|
+
}] : []));
|
|
55
56
|
};
|
|
56
57
|
var createNodeInsertExperience = function createNodeInsertExperience(action) {
|
|
57
58
|
return new _experiences.Experience(_experiences.EXPERIENCE_ID.TOOLBAR_ACTION, {
|
|
@@ -62,10 +63,7 @@ var getToolbarActionExperiencesPlugin = exports.getToolbarActionExperiencesPlugi
|
|
|
62
63
|
durationMs: TIMEOUT_DURATION
|
|
63
64
|
}), new _experiences.ExperienceCheckDomMutation({
|
|
64
65
|
onDomMutation: _toolbarExperienceUtils.handleEditorNodeInsertDomMutation,
|
|
65
|
-
observeConfig:
|
|
66
|
-
}), new _experiences.ExperienceCheckDomMutation({
|
|
67
|
-
onDomMutation: _toolbarExperienceUtils.handleEditorNodeInsertDomMutation,
|
|
68
|
-
observeConfig: rootObserveConfig
|
|
66
|
+
observeConfig: observeConfigs
|
|
69
67
|
})]
|
|
70
68
|
});
|
|
71
69
|
};
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.isToolbarButtonClick = exports.handleEditorNodeInsertDomMutation = exports.
|
|
6
|
+
exports.isToolbarButtonClick = exports.handleEditorNodeInsertDomMutation = exports.NODE_INSERT_MARKERS = void 0;
|
|
7
7
|
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; } } }; }
|
|
8
8
|
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; } }
|
|
9
9
|
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
@@ -28,58 +28,6 @@ var isToolbarButtonClick = exports.isToolbarButtonClick = function isToolbarButt
|
|
|
28
28
|
return !button.disabled && button.getAttribute('aria-disabled') !== 'true';
|
|
29
29
|
};
|
|
30
30
|
|
|
31
|
-
/**
|
|
32
|
-
* Returns the narrow parent DOM element at the current selection, suitable
|
|
33
|
-
* for observing with `{ childList: true }` (no subtree).
|
|
34
|
-
*
|
|
35
|
-
* Uses the resolved position's depth to find the block node at the cursor
|
|
36
|
-
* via `nodeDOM`, then returns its `parentElement` — the container whose
|
|
37
|
-
* direct children change when content is inserted at this position.
|
|
38
|
-
*
|
|
39
|
-
* Falls back to `domAtPos` if `nodeDOM` is unavailable.
|
|
40
|
-
*/
|
|
41
|
-
var getParentDOMAtSelection = exports.getParentDOMAtSelection = function getParentDOMAtSelection(editorView) {
|
|
42
|
-
if (!editorView) {
|
|
43
|
-
return null;
|
|
44
|
-
}
|
|
45
|
-
try {
|
|
46
|
-
var selection = editorView.state.selection;
|
|
47
|
-
var $from = selection.$from;
|
|
48
|
-
var parentDepth = Math.max(1, $from.depth);
|
|
49
|
-
var parentPos = $from.before(parentDepth);
|
|
50
|
-
var parentDom = editorView.nodeDOM(parentPos);
|
|
51
|
-
if (parentDom instanceof HTMLElement && parentDom.parentElement) {
|
|
52
|
-
return parentDom.parentElement;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
// Fallback: use domAtPos
|
|
56
|
-
var _editorView$domAtPos = editorView.domAtPos(selection.from),
|
|
57
|
-
node = _editorView$domAtPos.node;
|
|
58
|
-
var element = null;
|
|
59
|
-
if (node instanceof HTMLElement) {
|
|
60
|
-
element = node;
|
|
61
|
-
} else if (node instanceof Text) {
|
|
62
|
-
element = node.parentElement;
|
|
63
|
-
}
|
|
64
|
-
if (!element) {
|
|
65
|
-
return null;
|
|
66
|
-
}
|
|
67
|
-
var proseMirrorRoot = editorView.dom;
|
|
68
|
-
if (!(proseMirrorRoot instanceof HTMLElement)) {
|
|
69
|
-
return null;
|
|
70
|
-
}
|
|
71
|
-
if (element === proseMirrorRoot) {
|
|
72
|
-
return proseMirrorRoot;
|
|
73
|
-
}
|
|
74
|
-
if (element.parentElement && proseMirrorRoot.contains(element.parentElement)) {
|
|
75
|
-
return element.parentElement;
|
|
76
|
-
}
|
|
77
|
-
return proseMirrorRoot;
|
|
78
|
-
} catch (_unused) {
|
|
79
|
-
return null;
|
|
80
|
-
}
|
|
81
|
-
};
|
|
82
|
-
|
|
83
31
|
/**
|
|
84
32
|
* Checks whether a DOM node matches any known node insert marker,
|
|
85
33
|
* either directly or via a nested element (e.g. breakout mark wrapper).
|
|
@@ -101,7 +49,6 @@ var matchesNodeInsertMarker = function matchesNodeInsertMarker(node) {
|
|
|
101
49
|
var handleEditorNodeInsertDomMutation = exports.handleEditorNodeInsertDomMutation = function handleEditorNodeInsertDomMutation(_ref) {
|
|
102
50
|
var mutations = _ref.mutations;
|
|
103
51
|
var hasAddedElement = false;
|
|
104
|
-
var hasRemovedElement = false;
|
|
105
52
|
var _iterator = _createForOfIteratorHelper(mutations),
|
|
106
53
|
_step;
|
|
107
54
|
try {
|
|
@@ -129,27 +76,13 @@ var handleEditorNodeInsertDomMutation = exports.handleEditorNodeInsertDomMutatio
|
|
|
129
76
|
} finally {
|
|
130
77
|
_iterator2.f();
|
|
131
78
|
}
|
|
132
|
-
var _iterator3 = _createForOfIteratorHelper(mutation.removedNodes),
|
|
133
|
-
_step3;
|
|
134
|
-
try {
|
|
135
|
-
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
|
|
136
|
-
var _node = _step3.value;
|
|
137
|
-
if (_node instanceof HTMLElement) {
|
|
138
|
-
hasRemovedElement = true;
|
|
139
|
-
}
|
|
140
|
-
}
|
|
141
|
-
} catch (err) {
|
|
142
|
-
_iterator3.e(err);
|
|
143
|
-
} finally {
|
|
144
|
-
_iterator3.f();
|
|
145
|
-
}
|
|
146
79
|
}
|
|
147
80
|
} catch (err) {
|
|
148
81
|
_iterator.e(err);
|
|
149
82
|
} finally {
|
|
150
83
|
_iterator.f();
|
|
151
84
|
}
|
|
152
|
-
if (hasAddedElement
|
|
85
|
+
if (hasAddedElement) {
|
|
153
86
|
return {
|
|
154
87
|
status: 'success'
|
|
155
88
|
};
|
|
@@ -27,7 +27,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
|
|
|
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
|
* @jsxRuntime classic
|
|
29
29
|
* @jsx jsx
|
|
30
|
-
*/ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
30
|
+
*/ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
|
|
31
31
|
var DEFAULT_HEIGHT = exports.DEFAULT_HEIGHT = 560;
|
|
32
32
|
|
|
33
33
|
/**
|
|
@@ -17,7 +17,7 @@ var _styles = require("./styles");
|
|
|
17
17
|
* @jsx jsx
|
|
18
18
|
*/
|
|
19
19
|
|
|
20
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
20
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
|
|
21
21
|
|
|
22
22
|
var DropDownButtonIcon = /*#__PURE__*/_react.default.memo(function (props) {
|
|
23
23
|
return (
|
|
@@ -37,7 +37,7 @@ var _templateObject;
|
|
|
37
37
|
* @jsxRuntime classic
|
|
38
38
|
* @jsx jsx
|
|
39
39
|
*/
|
|
40
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
40
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
|
|
41
41
|
// Ignored via go/ees005
|
|
42
42
|
// eslint-disable-next-line import/no-namespace
|
|
43
43
|
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; } } }; }
|
|
@@ -846,5 +846,6 @@ var ToolbarInsertBlock = exports.ToolbarInsertBlock = /*#__PURE__*/function (_Re
|
|
|
846
846
|
});
|
|
847
847
|
}
|
|
848
848
|
}]);
|
|
849
|
-
}(_react.default.PureComponent);
|
|
850
|
-
var
|
|
849
|
+
}(_react.default.PureComponent); // eslint-disable-next-line @typescript-eslint/ban-types
|
|
850
|
+
var _default_1 = (0, _reactIntlNext.injectIntl)(ToolbarInsertBlock);
|
|
851
|
+
var _default = exports.default = _default_1;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { bind } from 'bind-event-listener';
|
|
2
2
|
import { getDocument } from '@atlaskit/browser-apis';
|
|
3
|
-
import { Experience, EXPERIENCE_ID, ExperienceCheckDomMutation, ExperienceCheckPopupMutation, ExperienceCheckTimeout } from '@atlaskit/editor-common/experiences';
|
|
3
|
+
import { Experience, EXPERIENCE_ID, ExperienceCheckDomMutation, ExperienceCheckPopupMutation, ExperienceCheckTimeout, getSelectionAncestorDOM } from '@atlaskit/editor-common/experiences';
|
|
4
4
|
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
5
5
|
import { TOOLBAR_BUTTON_TEST_ID } from '@atlaskit/editor-common/toolbar';
|
|
6
6
|
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
7
|
-
import {
|
|
7
|
+
import { handleEditorNodeInsertDomMutation, isToolbarButtonClick } from './toolbar-experience-utils';
|
|
8
8
|
const pluginKey = new PluginKey('toolbarActionExperiences');
|
|
9
9
|
const TIMEOUT_DURATION = 1000;
|
|
10
10
|
const PRIMARY_TOOLBAR = 'primaryToolbar';
|
|
@@ -31,21 +31,22 @@ export const getToolbarActionExperiencesPlugin = ({
|
|
|
31
31
|
}
|
|
32
32
|
return (_lastClickedToolbarBu = lastClickedToolbarButton.closest('[data-toolbar-component="button-group"]')) !== null && _lastClickedToolbarBu !== void 0 ? _lastClickedToolbarBu : lastClickedToolbarButton;
|
|
33
33
|
};
|
|
34
|
-
const
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
34
|
+
const observeConfigs = () => {
|
|
35
|
+
const narrowTarget = getSelectionAncestorDOM(editorView);
|
|
36
|
+
const editorDom = getEditorDom();
|
|
37
|
+
return [...(narrowTarget ? [{
|
|
38
|
+
target: narrowTarget,
|
|
39
|
+
options: {
|
|
40
|
+
childList: true,
|
|
41
|
+
subtree: true
|
|
42
|
+
}
|
|
43
|
+
}] : []), ...(editorDom ? [{
|
|
44
|
+
target: editorDom,
|
|
38
45
|
options: {
|
|
39
46
|
childList: true
|
|
40
47
|
}
|
|
41
|
-
};
|
|
48
|
+
}] : [])];
|
|
42
49
|
};
|
|
43
|
-
const rootObserveConfig = () => ({
|
|
44
|
-
target: getEditorDom(),
|
|
45
|
-
options: {
|
|
46
|
-
childList: true
|
|
47
|
-
}
|
|
48
|
-
});
|
|
49
50
|
const createNodeInsertExperience = action => new Experience(EXPERIENCE_ID.TOOLBAR_ACTION, {
|
|
50
51
|
action,
|
|
51
52
|
actionSubjectId: PRIMARY_TOOLBAR,
|
|
@@ -54,10 +55,7 @@ export const getToolbarActionExperiencesPlugin = ({
|
|
|
54
55
|
durationMs: TIMEOUT_DURATION
|
|
55
56
|
}), new ExperienceCheckDomMutation({
|
|
56
57
|
onDomMutation: handleEditorNodeInsertDomMutation,
|
|
57
|
-
observeConfig:
|
|
58
|
-
}), new ExperienceCheckDomMutation({
|
|
59
|
-
onDomMutation: handleEditorNodeInsertDomMutation,
|
|
60
|
-
observeConfig: rootObserveConfig
|
|
58
|
+
observeConfig: observeConfigs
|
|
61
59
|
})]
|
|
62
60
|
});
|
|
63
61
|
const buildPopupMutationConfig = (popupSelector, type) => {
|
|
@@ -19,61 +19,6 @@ export const isToolbarButtonClick = (target, testId) => {
|
|
|
19
19
|
return !button.disabled && button.getAttribute('aria-disabled') !== 'true';
|
|
20
20
|
};
|
|
21
21
|
|
|
22
|
-
/**
|
|
23
|
-
* Returns the narrow parent DOM element at the current selection, suitable
|
|
24
|
-
* for observing with `{ childList: true }` (no subtree).
|
|
25
|
-
*
|
|
26
|
-
* Uses the resolved position's depth to find the block node at the cursor
|
|
27
|
-
* via `nodeDOM`, then returns its `parentElement` — the container whose
|
|
28
|
-
* direct children change when content is inserted at this position.
|
|
29
|
-
*
|
|
30
|
-
* Falls back to `domAtPos` if `nodeDOM` is unavailable.
|
|
31
|
-
*/
|
|
32
|
-
export const getParentDOMAtSelection = editorView => {
|
|
33
|
-
if (!editorView) {
|
|
34
|
-
return null;
|
|
35
|
-
}
|
|
36
|
-
try {
|
|
37
|
-
const {
|
|
38
|
-
selection
|
|
39
|
-
} = editorView.state;
|
|
40
|
-
const $from = selection.$from;
|
|
41
|
-
const parentDepth = Math.max(1, $from.depth);
|
|
42
|
-
const parentPos = $from.before(parentDepth);
|
|
43
|
-
const parentDom = editorView.nodeDOM(parentPos);
|
|
44
|
-
if (parentDom instanceof HTMLElement && parentDom.parentElement) {
|
|
45
|
-
return parentDom.parentElement;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
// Fallback: use domAtPos
|
|
49
|
-
const {
|
|
50
|
-
node
|
|
51
|
-
} = editorView.domAtPos(selection.from);
|
|
52
|
-
let element = null;
|
|
53
|
-
if (node instanceof HTMLElement) {
|
|
54
|
-
element = node;
|
|
55
|
-
} else if (node instanceof Text) {
|
|
56
|
-
element = node.parentElement;
|
|
57
|
-
}
|
|
58
|
-
if (!element) {
|
|
59
|
-
return null;
|
|
60
|
-
}
|
|
61
|
-
const proseMirrorRoot = editorView.dom;
|
|
62
|
-
if (!(proseMirrorRoot instanceof HTMLElement)) {
|
|
63
|
-
return null;
|
|
64
|
-
}
|
|
65
|
-
if (element === proseMirrorRoot) {
|
|
66
|
-
return proseMirrorRoot;
|
|
67
|
-
}
|
|
68
|
-
if (element.parentElement && proseMirrorRoot.contains(element.parentElement)) {
|
|
69
|
-
return element.parentElement;
|
|
70
|
-
}
|
|
71
|
-
return proseMirrorRoot;
|
|
72
|
-
} catch {
|
|
73
|
-
return null;
|
|
74
|
-
}
|
|
75
|
-
};
|
|
76
|
-
|
|
77
22
|
/**
|
|
78
23
|
* Checks whether a DOM node matches any known node insert marker,
|
|
79
24
|
* either directly or via a nested element (e.g. breakout mark wrapper).
|
|
@@ -96,7 +41,6 @@ export const handleEditorNodeInsertDomMutation = ({
|
|
|
96
41
|
mutations
|
|
97
42
|
}) => {
|
|
98
43
|
let hasAddedElement = false;
|
|
99
|
-
let hasRemovedElement = false;
|
|
100
44
|
for (const mutation of mutations) {
|
|
101
45
|
if (mutation.type !== 'childList') {
|
|
102
46
|
continue;
|
|
@@ -111,13 +55,8 @@ export const handleEditorNodeInsertDomMutation = ({
|
|
|
111
55
|
hasAddedElement = true;
|
|
112
56
|
}
|
|
113
57
|
}
|
|
114
|
-
for (const node of mutation.removedNodes) {
|
|
115
|
-
if (node instanceof HTMLElement) {
|
|
116
|
-
hasRemovedElement = true;
|
|
117
|
-
}
|
|
118
|
-
}
|
|
119
58
|
}
|
|
120
|
-
if (hasAddedElement
|
|
59
|
+
if (hasAddedElement) {
|
|
121
60
|
return {
|
|
122
61
|
status: 'success'
|
|
123
62
|
};
|
|
@@ -6,7 +6,7 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
6
6
|
|
|
7
7
|
import { useCallback, useContext, useLayoutEffect, useMemo, useState } from 'react';
|
|
8
8
|
|
|
9
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
9
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
|
|
10
10
|
import { css, jsx } from '@emotion/react';
|
|
11
11
|
import { useIntl } from 'react-intl-next';
|
|
12
12
|
import { CellMeasurerCache } from 'react-virtualized/dist/commonjs/CellMeasurer';
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
*/
|
|
5
5
|
import React from 'react';
|
|
6
6
|
|
|
7
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
7
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
|
|
8
8
|
import { jsx } from '@emotion/react';
|
|
9
9
|
import { ToolTipContent } from '@atlaskit/editor-common/keymaps';
|
|
10
10
|
import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
|
|
@@ -7,7 +7,7 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
7
7
|
*/
|
|
8
8
|
import React from 'react';
|
|
9
9
|
|
|
10
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
10
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
|
|
11
11
|
import { css, jsx } from '@emotion/react';
|
|
12
12
|
import { injectIntl } from 'react-intl-next';
|
|
13
13
|
import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
@@ -841,4 +841,7 @@ export class ToolbarInsertBlock extends React.PureComponent {
|
|
|
841
841
|
}));
|
|
842
842
|
}
|
|
843
843
|
}
|
|
844
|
-
|
|
844
|
+
|
|
845
|
+
// eslint-disable-next-line @typescript-eslint/ban-types
|
|
846
|
+
const _default_1 = injectIntl(ToolbarInsertBlock);
|
|
847
|
+
export default _default_1;
|
|
@@ -1,10 +1,11 @@
|
|
|
1
|
+
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
1
2
|
import { bind } from 'bind-event-listener';
|
|
2
3
|
import { getDocument } from '@atlaskit/browser-apis';
|
|
3
|
-
import { Experience, EXPERIENCE_ID, ExperienceCheckDomMutation, ExperienceCheckPopupMutation, ExperienceCheckTimeout } from '@atlaskit/editor-common/experiences';
|
|
4
|
+
import { Experience, EXPERIENCE_ID, ExperienceCheckDomMutation, ExperienceCheckPopupMutation, ExperienceCheckTimeout, getSelectionAncestorDOM } from '@atlaskit/editor-common/experiences';
|
|
4
5
|
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
5
6
|
import { TOOLBAR_BUTTON_TEST_ID } from '@atlaskit/editor-common/toolbar';
|
|
6
7
|
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
7
|
-
import {
|
|
8
|
+
import { handleEditorNodeInsertDomMutation, isToolbarButtonClick } from './toolbar-experience-utils';
|
|
8
9
|
var pluginKey = new PluginKey('toolbarActionExperiences');
|
|
9
10
|
var TIMEOUT_DURATION = 1000;
|
|
10
11
|
var PRIMARY_TOOLBAR = 'primaryToolbar';
|
|
@@ -30,22 +31,21 @@ export var getToolbarActionExperiencesPlugin = function getToolbarActionExperien
|
|
|
30
31
|
}
|
|
31
32
|
return (_lastClickedToolbarBu = lastClickedToolbarButton.closest('[data-toolbar-component="button-group"]')) !== null && _lastClickedToolbarBu !== void 0 ? _lastClickedToolbarBu : lastClickedToolbarButton;
|
|
32
33
|
};
|
|
33
|
-
var
|
|
34
|
-
var
|
|
35
|
-
|
|
36
|
-
|
|
34
|
+
var observeConfigs = function observeConfigs() {
|
|
35
|
+
var narrowTarget = getSelectionAncestorDOM(editorView);
|
|
36
|
+
var editorDom = getEditorDom();
|
|
37
|
+
return [].concat(_toConsumableArray(narrowTarget ? [{
|
|
38
|
+
target: narrowTarget,
|
|
37
39
|
options: {
|
|
38
|
-
childList: true
|
|
40
|
+
childList: true,
|
|
41
|
+
subtree: true
|
|
39
42
|
}
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
var rootObserveConfig = function rootObserveConfig() {
|
|
43
|
-
return {
|
|
44
|
-
target: getEditorDom(),
|
|
43
|
+
}] : []), _toConsumableArray(editorDom ? [{
|
|
44
|
+
target: editorDom,
|
|
45
45
|
options: {
|
|
46
46
|
childList: true
|
|
47
47
|
}
|
|
48
|
-
};
|
|
48
|
+
}] : []));
|
|
49
49
|
};
|
|
50
50
|
var createNodeInsertExperience = function createNodeInsertExperience(action) {
|
|
51
51
|
return new Experience(EXPERIENCE_ID.TOOLBAR_ACTION, {
|
|
@@ -56,10 +56,7 @@ export var getToolbarActionExperiencesPlugin = function getToolbarActionExperien
|
|
|
56
56
|
durationMs: TIMEOUT_DURATION
|
|
57
57
|
}), new ExperienceCheckDomMutation({
|
|
58
58
|
onDomMutation: handleEditorNodeInsertDomMutation,
|
|
59
|
-
observeConfig:
|
|
60
|
-
}), new ExperienceCheckDomMutation({
|
|
61
|
-
onDomMutation: handleEditorNodeInsertDomMutation,
|
|
62
|
-
observeConfig: rootObserveConfig
|
|
59
|
+
observeConfig: observeConfigs
|
|
63
60
|
})]
|
|
64
61
|
});
|
|
65
62
|
};
|
|
@@ -22,58 +22,6 @@ export var isToolbarButtonClick = function isToolbarButtonClick(target, testId)
|
|
|
22
22
|
return !button.disabled && button.getAttribute('aria-disabled') !== 'true';
|
|
23
23
|
};
|
|
24
24
|
|
|
25
|
-
/**
|
|
26
|
-
* Returns the narrow parent DOM element at the current selection, suitable
|
|
27
|
-
* for observing with `{ childList: true }` (no subtree).
|
|
28
|
-
*
|
|
29
|
-
* Uses the resolved position's depth to find the block node at the cursor
|
|
30
|
-
* via `nodeDOM`, then returns its `parentElement` — the container whose
|
|
31
|
-
* direct children change when content is inserted at this position.
|
|
32
|
-
*
|
|
33
|
-
* Falls back to `domAtPos` if `nodeDOM` is unavailable.
|
|
34
|
-
*/
|
|
35
|
-
export var getParentDOMAtSelection = function getParentDOMAtSelection(editorView) {
|
|
36
|
-
if (!editorView) {
|
|
37
|
-
return null;
|
|
38
|
-
}
|
|
39
|
-
try {
|
|
40
|
-
var selection = editorView.state.selection;
|
|
41
|
-
var $from = selection.$from;
|
|
42
|
-
var parentDepth = Math.max(1, $from.depth);
|
|
43
|
-
var parentPos = $from.before(parentDepth);
|
|
44
|
-
var parentDom = editorView.nodeDOM(parentPos);
|
|
45
|
-
if (parentDom instanceof HTMLElement && parentDom.parentElement) {
|
|
46
|
-
return parentDom.parentElement;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
// Fallback: use domAtPos
|
|
50
|
-
var _editorView$domAtPos = editorView.domAtPos(selection.from),
|
|
51
|
-
node = _editorView$domAtPos.node;
|
|
52
|
-
var element = null;
|
|
53
|
-
if (node instanceof HTMLElement) {
|
|
54
|
-
element = node;
|
|
55
|
-
} else if (node instanceof Text) {
|
|
56
|
-
element = node.parentElement;
|
|
57
|
-
}
|
|
58
|
-
if (!element) {
|
|
59
|
-
return null;
|
|
60
|
-
}
|
|
61
|
-
var proseMirrorRoot = editorView.dom;
|
|
62
|
-
if (!(proseMirrorRoot instanceof HTMLElement)) {
|
|
63
|
-
return null;
|
|
64
|
-
}
|
|
65
|
-
if (element === proseMirrorRoot) {
|
|
66
|
-
return proseMirrorRoot;
|
|
67
|
-
}
|
|
68
|
-
if (element.parentElement && proseMirrorRoot.contains(element.parentElement)) {
|
|
69
|
-
return element.parentElement;
|
|
70
|
-
}
|
|
71
|
-
return proseMirrorRoot;
|
|
72
|
-
} catch (_unused) {
|
|
73
|
-
return null;
|
|
74
|
-
}
|
|
75
|
-
};
|
|
76
|
-
|
|
77
25
|
/**
|
|
78
26
|
* Checks whether a DOM node matches any known node insert marker,
|
|
79
27
|
* either directly or via a nested element (e.g. breakout mark wrapper).
|
|
@@ -95,7 +43,6 @@ var matchesNodeInsertMarker = function matchesNodeInsertMarker(node) {
|
|
|
95
43
|
export var handleEditorNodeInsertDomMutation = function handleEditorNodeInsertDomMutation(_ref) {
|
|
96
44
|
var mutations = _ref.mutations;
|
|
97
45
|
var hasAddedElement = false;
|
|
98
|
-
var hasRemovedElement = false;
|
|
99
46
|
var _iterator = _createForOfIteratorHelper(mutations),
|
|
100
47
|
_step;
|
|
101
48
|
try {
|
|
@@ -123,27 +70,13 @@ export var handleEditorNodeInsertDomMutation = function handleEditorNodeInsertDo
|
|
|
123
70
|
} finally {
|
|
124
71
|
_iterator2.f();
|
|
125
72
|
}
|
|
126
|
-
var _iterator3 = _createForOfIteratorHelper(mutation.removedNodes),
|
|
127
|
-
_step3;
|
|
128
|
-
try {
|
|
129
|
-
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
|
|
130
|
-
var _node = _step3.value;
|
|
131
|
-
if (_node instanceof HTMLElement) {
|
|
132
|
-
hasRemovedElement = true;
|
|
133
|
-
}
|
|
134
|
-
}
|
|
135
|
-
} catch (err) {
|
|
136
|
-
_iterator3.e(err);
|
|
137
|
-
} finally {
|
|
138
|
-
_iterator3.f();
|
|
139
|
-
}
|
|
140
73
|
}
|
|
141
74
|
} catch (err) {
|
|
142
75
|
_iterator.e(err);
|
|
143
76
|
} finally {
|
|
144
77
|
_iterator.f();
|
|
145
78
|
}
|
|
146
|
-
if (hasAddedElement
|
|
79
|
+
if (hasAddedElement) {
|
|
147
80
|
return {
|
|
148
81
|
status: 'success'
|
|
149
82
|
};
|
|
@@ -13,7 +13,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
13
13
|
|
|
14
14
|
import { useCallback, useContext, useLayoutEffect, useMemo, useState } from 'react';
|
|
15
15
|
|
|
16
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
16
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
|
|
17
17
|
import { css, jsx } from '@emotion/react';
|
|
18
18
|
import { useIntl } from 'react-intl-next';
|
|
19
19
|
import { CellMeasurerCache } from 'react-virtualized/dist/commonjs/CellMeasurer';
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
*/
|
|
5
5
|
import React from 'react';
|
|
6
6
|
|
|
7
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
7
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
|
|
8
8
|
import { jsx } from '@emotion/react';
|
|
9
9
|
import { ToolTipContent } from '@atlaskit/editor-common/keymaps';
|
|
10
10
|
import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
|
|
@@ -22,7 +22,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
|
|
|
22
22
|
*/
|
|
23
23
|
import React from 'react';
|
|
24
24
|
|
|
25
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
25
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
|
|
26
26
|
import { css, jsx } from '@emotion/react';
|
|
27
27
|
import { injectIntl } from 'react-intl-next';
|
|
28
28
|
import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
@@ -841,4 +841,7 @@ export var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
841
841
|
}
|
|
842
842
|
}]);
|
|
843
843
|
}(React.PureComponent);
|
|
844
|
-
|
|
844
|
+
|
|
845
|
+
// eslint-disable-next-line @typescript-eslint/ban-types
|
|
846
|
+
var _default_1 = injectIntl(ToolbarInsertBlock);
|
|
847
|
+
export default _default_1;
|
|
@@ -3,5 +3,5 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
|
3
3
|
type ToolbarActionExperienceOptions = {
|
|
4
4
|
dispatchAnalyticsEvent: DispatchAnalyticsEvent;
|
|
5
5
|
};
|
|
6
|
-
export declare const getToolbarActionExperiencesPlugin: ({ dispatchAnalyticsEvent, }: ToolbarActionExperienceOptions) => SafePlugin
|
|
6
|
+
export declare const getToolbarActionExperiencesPlugin: ({ dispatchAnalyticsEvent, }: ToolbarActionExperienceOptions) => SafePlugin;
|
|
7
7
|
export {};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import type { ExperienceCheckResult } from '@atlaskit/editor-common/experiences';
|
|
2
|
-
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
3
2
|
/**
|
|
4
3
|
* DOM marker selectors for node types inserted via toolbar actions.
|
|
5
4
|
* Matches outermost wrapper elements set synchronously by ReactNodeView
|
|
@@ -13,17 +12,6 @@ export declare const NODE_INSERT_MARKERS: {
|
|
|
13
12
|
readonly TASK_ITEM: ".taskItemView-content-wrap";
|
|
14
13
|
};
|
|
15
14
|
export declare const isToolbarButtonClick: (target: HTMLElement, testId: string) => boolean;
|
|
16
|
-
/**
|
|
17
|
-
* Returns the narrow parent DOM element at the current selection, suitable
|
|
18
|
-
* for observing with `{ childList: true }` (no subtree).
|
|
19
|
-
*
|
|
20
|
-
* Uses the resolved position's depth to find the block node at the cursor
|
|
21
|
-
* via `nodeDOM`, then returns its `parentElement` — the container whose
|
|
22
|
-
* direct children change when content is inserted at this position.
|
|
23
|
-
*
|
|
24
|
-
* Falls back to `domAtPos` if `nodeDOM` is unavailable.
|
|
25
|
-
*/
|
|
26
|
-
export declare const getParentDOMAtSelection: (editorView?: EditorView) => HTMLElement | null;
|
|
27
15
|
/**
|
|
28
16
|
* Evaluates DOM mutations to detect a node insert action.
|
|
29
17
|
*
|
|
@@ -2,4 +2,5 @@ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
|
2
2
|
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
3
3
|
import type { insertBlockPlugin } from '../../insertBlockPlugin';
|
|
4
4
|
import type { InsertBlockOptions } from '../../types';
|
|
5
|
-
|
|
5
|
+
import { type BlockMenuItem } from '../ToolbarInsertBlock/create-items';
|
|
6
|
+
export declare const useInsertMenuRailItems: (editorView: EditorView, options: InsertBlockOptions, api?: ExtractInjectionAPI<typeof insertBlockPlugin>) => BlockMenuItem[];
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { type MemoizedFn } from 'memoize-one';
|
|
1
2
|
import type { WrappedComponentProps } from 'react-intl-next';
|
|
2
3
|
import type { MenuItem } from '@atlaskit/editor-common/ui-menu';
|
|
3
4
|
import type { BlockType } from '@atlaskit/editor-plugin-block-type';
|
|
@@ -40,4 +41,4 @@ export interface CreateItemsConfig {
|
|
|
40
41
|
export interface BlockMenuItem extends MenuItem {
|
|
41
42
|
title: JSX.Element | null;
|
|
42
43
|
}
|
|
43
|
-
export declare const createItems:
|
|
44
|
+
export declare const createItems: MemoizedFn<(config: CreateItemsConfig) => Readonly<[BlockMenuItem[], BlockMenuItem[]]>>;
|
|
@@ -3,13 +3,13 @@
|
|
|
3
3
|
* @jsx jsx
|
|
4
4
|
*/
|
|
5
5
|
import React from 'react';
|
|
6
|
-
import { jsx } from '@emotion/react';
|
|
7
|
-
import type { WrappedComponentProps } from 'react-intl-next';
|
|
6
|
+
import { jsx, type SerializedStyles } from '@emotion/react';
|
|
7
|
+
import type { WithIntlProps, WrappedComponentProps } from 'react-intl-next';
|
|
8
8
|
import type { Props, State } from './types';
|
|
9
9
|
export declare const tableButtonWrapper: ({ isTableSelectorOpen, isButtonDisabled, }: {
|
|
10
10
|
isButtonDisabled: boolean | undefined;
|
|
11
11
|
isTableSelectorOpen: boolean;
|
|
12
|
-
}) =>
|
|
12
|
+
}) => SerializedStyles;
|
|
13
13
|
export declare class ToolbarInsertBlock extends React.PureComponent<Props & WrappedComponentProps, State> {
|
|
14
14
|
private dropdownButtonRef?;
|
|
15
15
|
private emojiButtonRef?;
|
|
@@ -57,7 +57,7 @@ export declare class ToolbarInsertBlock extends React.PureComponent<Props & Wrap
|
|
|
57
57
|
private insertToolbarMenuItem;
|
|
58
58
|
private insertInsertMenuItem;
|
|
59
59
|
}
|
|
60
|
-
declare const
|
|
60
|
+
declare const _default_1: React.FC<WithIntlProps<Props & WrappedComponentProps>> & {
|
|
61
61
|
WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
|
|
62
62
|
};
|
|
63
|
-
export default
|
|
63
|
+
export default _default_1;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
2
|
-
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { ExtractInjectionAPI, TOOLBAR_MENU_TYPE } from '@atlaskit/editor-common/types';
|
|
3
3
|
import type { EmojiId } from '@atlaskit/emoji/types';
|
|
4
4
|
import type { InsertBlockPlugin } from '../../../insertBlockPluginType';
|
|
5
5
|
interface UseEmojiPickerPopupProps {
|
|
6
6
|
api?: ExtractInjectionAPI<InsertBlockPlugin>;
|
|
7
7
|
buttonRef: React.RefObject<HTMLElement>;
|
|
8
8
|
}
|
|
9
|
-
export declare const useEmojiPickerPopup: ({ api, buttonRef }: UseEmojiPickerPopupProps) => {
|
|
9
|
+
export declare const useEmojiPickerPopup: ({ api, buttonRef, }: UseEmojiPickerPopupProps) => {
|
|
10
10
|
handleSelectedEmoji: (emojiId: EmojiId) => true;
|
|
11
11
|
onPopupUnmount: () => void;
|
|
12
12
|
isOpen: boolean;
|
|
13
13
|
isOpenedByKeyboard: boolean;
|
|
14
|
-
toggle: (inputMethod?:
|
|
14
|
+
toggle: (inputMethod?: TOOLBAR_MENU_TYPE | INPUT_METHOD) => void;
|
|
15
15
|
close: () => void;
|
|
16
16
|
handleEscapeKeydown: () => void;
|
|
17
17
|
handleClickOutside: (e: MouseEvent) => void;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
2
|
-
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { ExtractInjectionAPI, TOOLBAR_MENU_TYPE } from '@atlaskit/editor-common/types';
|
|
3
3
|
import type { InsertBlockPlugin } from '../../../insertBlockPluginType';
|
|
4
4
|
interface UseTableSelectorPopupProps {
|
|
5
5
|
api?: ExtractInjectionAPI<InsertBlockPlugin>;
|
|
6
6
|
buttonRef: React.RefObject<HTMLElement>;
|
|
7
7
|
}
|
|
8
|
-
export declare const useTableSelectorPopup: ({ api, buttonRef }: UseTableSelectorPopupProps) => {
|
|
8
|
+
export declare const useTableSelectorPopup: ({ api, buttonRef, }: UseTableSelectorPopupProps) => {
|
|
9
9
|
handleSelectedTableSize: (rowsCount: number, colsCount: number) => void;
|
|
10
10
|
onPopupUnmount: () => void;
|
|
11
11
|
isOpen: boolean;
|
|
12
12
|
isOpenedByKeyboard: boolean;
|
|
13
|
-
toggle: (inputMethod?:
|
|
13
|
+
toggle: (inputMethod?: TOOLBAR_MENU_TYPE | INPUT_METHOD) => void;
|
|
14
14
|
close: () => void;
|
|
15
15
|
handleEscapeKeydown: () => void;
|
|
16
16
|
handleClickOutside: (e: MouseEvent) => void;
|
|
@@ -3,5 +3,5 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
|
3
3
|
type ToolbarActionExperienceOptions = {
|
|
4
4
|
dispatchAnalyticsEvent: DispatchAnalyticsEvent;
|
|
5
5
|
};
|
|
6
|
-
export declare const getToolbarActionExperiencesPlugin: ({ dispatchAnalyticsEvent, }: ToolbarActionExperienceOptions) => SafePlugin
|
|
6
|
+
export declare const getToolbarActionExperiencesPlugin: ({ dispatchAnalyticsEvent, }: ToolbarActionExperienceOptions) => SafePlugin;
|
|
7
7
|
export {};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import type { ExperienceCheckResult } from '@atlaskit/editor-common/experiences';
|
|
2
|
-
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
3
2
|
/**
|
|
4
3
|
* DOM marker selectors for node types inserted via toolbar actions.
|
|
5
4
|
* Matches outermost wrapper elements set synchronously by ReactNodeView
|
|
@@ -13,17 +12,6 @@ export declare const NODE_INSERT_MARKERS: {
|
|
|
13
12
|
readonly TASK_ITEM: ".taskItemView-content-wrap";
|
|
14
13
|
};
|
|
15
14
|
export declare const isToolbarButtonClick: (target: HTMLElement, testId: string) => boolean;
|
|
16
|
-
/**
|
|
17
|
-
* Returns the narrow parent DOM element at the current selection, suitable
|
|
18
|
-
* for observing with `{ childList: true }` (no subtree).
|
|
19
|
-
*
|
|
20
|
-
* Uses the resolved position's depth to find the block node at the cursor
|
|
21
|
-
* via `nodeDOM`, then returns its `parentElement` — the container whose
|
|
22
|
-
* direct children change when content is inserted at this position.
|
|
23
|
-
*
|
|
24
|
-
* Falls back to `domAtPos` if `nodeDOM` is unavailable.
|
|
25
|
-
*/
|
|
26
|
-
export declare const getParentDOMAtSelection: (editorView?: EditorView) => HTMLElement | null;
|
|
27
15
|
/**
|
|
28
16
|
* Evaluates DOM mutations to detect a node insert action.
|
|
29
17
|
*
|
|
@@ -2,4 +2,5 @@ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
|
2
2
|
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
3
3
|
import type { insertBlockPlugin } from '../../insertBlockPlugin';
|
|
4
4
|
import type { InsertBlockOptions } from '../../types';
|
|
5
|
-
|
|
5
|
+
import { type BlockMenuItem } from '../ToolbarInsertBlock/create-items';
|
|
6
|
+
export declare const useInsertMenuRailItems: (editorView: EditorView, options: InsertBlockOptions, api?: ExtractInjectionAPI<typeof insertBlockPlugin>) => BlockMenuItem[];
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { type MemoizedFn } from 'memoize-one';
|
|
1
2
|
import type { WrappedComponentProps } from 'react-intl-next';
|
|
2
3
|
import type { MenuItem } from '@atlaskit/editor-common/ui-menu';
|
|
3
4
|
import type { BlockType } from '@atlaskit/editor-plugin-block-type';
|
|
@@ -40,7 +41,7 @@ export interface CreateItemsConfig {
|
|
|
40
41
|
export interface BlockMenuItem extends MenuItem {
|
|
41
42
|
title: JSX.Element | null;
|
|
42
43
|
}
|
|
43
|
-
export declare const createItems:
|
|
44
|
+
export declare const createItems: MemoizedFn<(config: CreateItemsConfig) => Readonly<[
|
|
44
45
|
BlockMenuItem[],
|
|
45
46
|
BlockMenuItem[]
|
|
46
47
|
]>>;
|
|
@@ -3,13 +3,13 @@
|
|
|
3
3
|
* @jsx jsx
|
|
4
4
|
*/
|
|
5
5
|
import React from 'react';
|
|
6
|
-
import { jsx } from '@emotion/react';
|
|
7
|
-
import type { WrappedComponentProps } from 'react-intl-next';
|
|
6
|
+
import { jsx, type SerializedStyles } from '@emotion/react';
|
|
7
|
+
import type { WithIntlProps, WrappedComponentProps } from 'react-intl-next';
|
|
8
8
|
import type { Props, State } from './types';
|
|
9
9
|
export declare const tableButtonWrapper: ({ isTableSelectorOpen, isButtonDisabled, }: {
|
|
10
10
|
isButtonDisabled: boolean | undefined;
|
|
11
11
|
isTableSelectorOpen: boolean;
|
|
12
|
-
}) =>
|
|
12
|
+
}) => SerializedStyles;
|
|
13
13
|
export declare class ToolbarInsertBlock extends React.PureComponent<Props & WrappedComponentProps, State> {
|
|
14
14
|
private dropdownButtonRef?;
|
|
15
15
|
private emojiButtonRef?;
|
|
@@ -57,7 +57,7 @@ export declare class ToolbarInsertBlock extends React.PureComponent<Props & Wrap
|
|
|
57
57
|
private insertToolbarMenuItem;
|
|
58
58
|
private insertInsertMenuItem;
|
|
59
59
|
}
|
|
60
|
-
declare const
|
|
60
|
+
declare const _default_1: React.FC<WithIntlProps<Props & WrappedComponentProps>> & {
|
|
61
61
|
WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
|
|
62
62
|
};
|
|
63
|
-
export default
|
|
63
|
+
export default _default_1;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
2
|
-
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { ExtractInjectionAPI, TOOLBAR_MENU_TYPE } from '@atlaskit/editor-common/types';
|
|
3
3
|
import type { EmojiId } from '@atlaskit/emoji/types';
|
|
4
4
|
import type { InsertBlockPlugin } from '../../../insertBlockPluginType';
|
|
5
5
|
interface UseEmojiPickerPopupProps {
|
|
6
6
|
api?: ExtractInjectionAPI<InsertBlockPlugin>;
|
|
7
7
|
buttonRef: React.RefObject<HTMLElement>;
|
|
8
8
|
}
|
|
9
|
-
export declare const useEmojiPickerPopup: ({ api, buttonRef }: UseEmojiPickerPopupProps) => {
|
|
9
|
+
export declare const useEmojiPickerPopup: ({ api, buttonRef, }: UseEmojiPickerPopupProps) => {
|
|
10
10
|
handleSelectedEmoji: (emojiId: EmojiId) => true;
|
|
11
11
|
onPopupUnmount: () => void;
|
|
12
12
|
isOpen: boolean;
|
|
13
13
|
isOpenedByKeyboard: boolean;
|
|
14
|
-
toggle: (inputMethod?:
|
|
14
|
+
toggle: (inputMethod?: TOOLBAR_MENU_TYPE | INPUT_METHOD) => void;
|
|
15
15
|
close: () => void;
|
|
16
16
|
handleEscapeKeydown: () => void;
|
|
17
17
|
handleClickOutside: (e: MouseEvent) => void;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
2
|
-
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { ExtractInjectionAPI, TOOLBAR_MENU_TYPE } from '@atlaskit/editor-common/types';
|
|
3
3
|
import type { InsertBlockPlugin } from '../../../insertBlockPluginType';
|
|
4
4
|
interface UseTableSelectorPopupProps {
|
|
5
5
|
api?: ExtractInjectionAPI<InsertBlockPlugin>;
|
|
6
6
|
buttonRef: React.RefObject<HTMLElement>;
|
|
7
7
|
}
|
|
8
|
-
export declare const useTableSelectorPopup: ({ api, buttonRef }: UseTableSelectorPopupProps) => {
|
|
8
|
+
export declare const useTableSelectorPopup: ({ api, buttonRef, }: UseTableSelectorPopupProps) => {
|
|
9
9
|
handleSelectedTableSize: (rowsCount: number, colsCount: number) => void;
|
|
10
10
|
onPopupUnmount: () => void;
|
|
11
11
|
isOpen: boolean;
|
|
12
12
|
isOpenedByKeyboard: boolean;
|
|
13
|
-
toggle: (inputMethod?:
|
|
13
|
+
toggle: (inputMethod?: TOOLBAR_MENU_TYPE | INPUT_METHOD) => void;
|
|
14
14
|
close: () => void;
|
|
15
15
|
handleEscapeKeydown: () => void;
|
|
16
16
|
handleClickOutside: (e: MouseEvent) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-insert-block",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "9.0.1",
|
|
4
4
|
"description": "Insert block plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -30,32 +30,32 @@
|
|
|
30
30
|
"atlaskit:src": "src/index.ts",
|
|
31
31
|
"dependencies": {
|
|
32
32
|
"@atlaskit/browser-apis": "^0.0.1",
|
|
33
|
-
"@atlaskit/editor-plugin-analytics": "^
|
|
34
|
-
"@atlaskit/editor-plugin-block-type": "^
|
|
35
|
-
"@atlaskit/editor-plugin-code-block": "^
|
|
36
|
-
"@atlaskit/editor-plugin-connectivity": "^
|
|
37
|
-
"@atlaskit/editor-plugin-date": "^
|
|
38
|
-
"@atlaskit/editor-plugin-emoji": "^
|
|
39
|
-
"@atlaskit/editor-plugin-expand": "^
|
|
40
|
-
"@atlaskit/editor-plugin-extension": "^
|
|
41
|
-
"@atlaskit/editor-plugin-feature-flags": "^
|
|
42
|
-
"@atlaskit/editor-plugin-hyperlink": "^
|
|
43
|
-
"@atlaskit/editor-plugin-image-upload": "^
|
|
44
|
-
"@atlaskit/editor-plugin-layout": "^
|
|
45
|
-
"@atlaskit/editor-plugin-media": "^
|
|
46
|
-
"@atlaskit/editor-plugin-media-insert": "^
|
|
47
|
-
"@atlaskit/editor-plugin-mentions": "^
|
|
48
|
-
"@atlaskit/editor-plugin-metrics": "^
|
|
49
|
-
"@atlaskit/editor-plugin-panel": "^
|
|
50
|
-
"@atlaskit/editor-plugin-placeholder-text": "^
|
|
51
|
-
"@atlaskit/editor-plugin-primary-toolbar": "^
|
|
52
|
-
"@atlaskit/editor-plugin-quick-insert": "^
|
|
53
|
-
"@atlaskit/editor-plugin-rule": "^
|
|
54
|
-
"@atlaskit/editor-plugin-status": "^
|
|
55
|
-
"@atlaskit/editor-plugin-table": "^
|
|
56
|
-
"@atlaskit/editor-plugin-tasks-and-decisions": "^
|
|
57
|
-
"@atlaskit/editor-plugin-toolbar": "^
|
|
58
|
-
"@atlaskit/editor-plugin-type-ahead": "^
|
|
33
|
+
"@atlaskit/editor-plugin-analytics": "^8.0.0",
|
|
34
|
+
"@atlaskit/editor-plugin-block-type": "^12.0.0",
|
|
35
|
+
"@atlaskit/editor-plugin-code-block": "^10.0.0",
|
|
36
|
+
"@atlaskit/editor-plugin-connectivity": "^8.0.0",
|
|
37
|
+
"@atlaskit/editor-plugin-date": "^10.0.0",
|
|
38
|
+
"@atlaskit/editor-plugin-emoji": "^9.0.0",
|
|
39
|
+
"@atlaskit/editor-plugin-expand": "^9.0.0",
|
|
40
|
+
"@atlaskit/editor-plugin-extension": "^11.0.0",
|
|
41
|
+
"@atlaskit/editor-plugin-feature-flags": "^7.0.0",
|
|
42
|
+
"@atlaskit/editor-plugin-hyperlink": "^10.0.0",
|
|
43
|
+
"@atlaskit/editor-plugin-image-upload": "^8.0.0",
|
|
44
|
+
"@atlaskit/editor-plugin-layout": "^8.0.0",
|
|
45
|
+
"@atlaskit/editor-plugin-media": "^10.0.0",
|
|
46
|
+
"@atlaskit/editor-plugin-media-insert": "^19.0.0",
|
|
47
|
+
"@atlaskit/editor-plugin-mentions": "^10.0.0",
|
|
48
|
+
"@atlaskit/editor-plugin-metrics": "^9.0.0",
|
|
49
|
+
"@atlaskit/editor-plugin-panel": "^10.0.0",
|
|
50
|
+
"@atlaskit/editor-plugin-placeholder-text": "^9.0.0",
|
|
51
|
+
"@atlaskit/editor-plugin-primary-toolbar": "^9.0.0",
|
|
52
|
+
"@atlaskit/editor-plugin-quick-insert": "^8.0.0",
|
|
53
|
+
"@atlaskit/editor-plugin-rule": "^8.0.0",
|
|
54
|
+
"@atlaskit/editor-plugin-status": "^9.0.0",
|
|
55
|
+
"@atlaskit/editor-plugin-table": "^18.0.0",
|
|
56
|
+
"@atlaskit/editor-plugin-tasks-and-decisions": "^11.0.0",
|
|
57
|
+
"@atlaskit/editor-plugin-toolbar": "^5.0.0",
|
|
58
|
+
"@atlaskit/editor-plugin-type-ahead": "^8.0.0",
|
|
59
59
|
"@atlaskit/editor-prosemirror": "^7.3.0",
|
|
60
60
|
"@atlaskit/editor-shared-styles": "^3.10.0",
|
|
61
61
|
"@atlaskit/editor-toolbar": "^0.19.0",
|
|
@@ -65,8 +65,8 @@
|
|
|
65
65
|
"@atlaskit/icon-lab": "^5.17.0",
|
|
66
66
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
67
67
|
"@atlaskit/theme": "^22.0.0",
|
|
68
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
69
|
-
"@atlaskit/tokens": "^11.
|
|
68
|
+
"@atlaskit/tmp-editor-statsig": "^36.0.0",
|
|
69
|
+
"@atlaskit/tokens": "^11.1.0",
|
|
70
70
|
"@babel/runtime": "^7.0.0",
|
|
71
71
|
"@emotion/react": "^11.7.1",
|
|
72
72
|
"bind-event-listener": "^3.0.0",
|
|
@@ -75,7 +75,7 @@
|
|
|
75
75
|
"react-virtualized": "^9.22.6"
|
|
76
76
|
},
|
|
77
77
|
"peerDependencies": {
|
|
78
|
-
"@atlaskit/editor-common": "^
|
|
78
|
+
"@atlaskit/editor-common": "^112.0.0",
|
|
79
79
|
"react": "^18.2.0",
|
|
80
80
|
"react-dom": "^18.2.0",
|
|
81
81
|
"react-intl-next": "npm:react-intl@^5.18.1"
|