@atlaskit/editor-core 189.1.15 → 189.2.0
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/composable-editor/editor-internal.js +22 -1
- package/dist/cjs/create-editor/feature-flags-from-props.js +4 -5
- package/dist/cjs/plugins/index.js +0 -7
- package/dist/cjs/presets/universal.js +3 -2
- package/dist/cjs/ui/Appearance/FullPage/FullPageToolbar.js +10 -8
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/composable-editor/editor-internal.js +25 -2
- package/dist/es2019/create-editor/feature-flags-from-props.js +4 -5
- package/dist/es2019/plugins/index.js +0 -1
- package/dist/es2019/presets/universal.js +3 -2
- package/dist/es2019/ui/Appearance/FullPage/FullPageToolbar.js +10 -8
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/composable-editor/editor-internal.js +23 -2
- package/dist/esm/create-editor/feature-flags-from-props.js +4 -5
- package/dist/esm/plugins/index.js +0 -1
- package/dist/esm/presets/universal.js +3 -2
- package/dist/esm/ui/Appearance/FullPage/FullPageToolbar.js +10 -8
- package/dist/esm/version-wrapper.js +1 -1
- package/dist/types/create-editor/get-ui-component.d.ts +1 -1
- package/dist/types/plugins/index.d.ts +0 -1
- package/dist/types/plugins/insert-block/types.d.ts +1 -1
- package/dist/types/types/editor-props.d.ts +1 -1
- package/dist/types-ts4.5/create-editor/get-ui-component.d.ts +1 -1
- package/dist/types-ts4.5/plugins/index.d.ts +0 -1
- package/dist/types-ts4.5/plugins/insert-block/types.d.ts +1 -1
- package/dist/types-ts4.5/types/editor-props.d.ts +1 -1
- package/package.json +5 -4
- package/report.api.md +1 -8
- package/tmp/api-report-tmp.d.ts +1 -8
- package/dist/cjs/plugins/panel/actions.js +0 -125
- package/dist/cjs/plugins/panel/index.js +0 -215
- package/dist/cjs/plugins/panel/message.js +0 -44
- package/dist/cjs/plugins/panel/nodeviews/panel.js +0 -94
- package/dist/cjs/plugins/panel/pm-plugins/keymaps.js +0 -81
- package/dist/cjs/plugins/panel/pm-plugins/main.js +0 -28
- package/dist/cjs/plugins/panel/toolbar.js +0 -293
- package/dist/cjs/plugins/panel/types.js +0 -8
- package/dist/cjs/plugins/panel/utils.js +0 -53
- package/dist/es2019/plugins/panel/actions.js +0 -116
- package/dist/es2019/plugins/panel/index.js +0 -192
- package/dist/es2019/plugins/panel/message.js +0 -38
- package/dist/es2019/plugins/panel/nodeviews/panel.js +0 -82
- package/dist/es2019/plugins/panel/pm-plugins/keymaps.js +0 -82
- package/dist/es2019/plugins/panel/pm-plugins/main.js +0 -21
- package/dist/es2019/plugins/panel/toolbar.js +0 -279
- package/dist/es2019/plugins/panel/types.js +0 -2
- package/dist/es2019/plugins/panel/utils.js +0 -48
- package/dist/esm/plugins/panel/actions.js +0 -116
- package/dist/esm/plugins/panel/index.js +0 -209
- package/dist/esm/plugins/panel/message.js +0 -38
- package/dist/esm/plugins/panel/nodeviews/panel.js +0 -87
- package/dist/esm/plugins/panel/pm-plugins/keymaps.js +0 -74
- package/dist/esm/plugins/panel/pm-plugins/main.js +0 -22
- package/dist/esm/plugins/panel/toolbar.js +0 -286
- package/dist/esm/plugins/panel/types.js +0 -2
- package/dist/esm/plugins/panel/utils.js +0 -46
- package/dist/types/plugins/panel/actions.d.ts +0 -12
- package/dist/types/plugins/panel/index.d.ts +0 -17
- package/dist/types/plugins/panel/message.d.ts +0 -37
- package/dist/types/plugins/panel/nodeviews/panel.d.ts +0 -36
- package/dist/types/plugins/panel/pm-plugins/keymaps.d.ts +0 -3
- package/dist/types/plugins/panel/pm-plugins/main.d.ts +0 -11
- package/dist/types/plugins/panel/toolbar.d.ts +0 -15
- package/dist/types/plugins/panel/types.d.ts +0 -21
- package/dist/types/plugins/panel/utils.d.ts +0 -5
- package/dist/types-ts4.5/plugins/panel/actions.d.ts +0 -12
- package/dist/types-ts4.5/plugins/panel/index.d.ts +0 -17
- package/dist/types-ts4.5/plugins/panel/message.d.ts +0 -37
- package/dist/types-ts4.5/plugins/panel/nodeviews/panel.d.ts +0 -36
- package/dist/types-ts4.5/plugins/panel/pm-plugins/keymaps.d.ts +0 -3
- package/dist/types-ts4.5/plugins/panel/pm-plugins/main.d.ts +0 -11
- package/dist/types-ts4.5/plugins/panel/toolbar.d.ts +0 -15
- package/dist/types-ts4.5/plugins/panel/types.d.ts +0 -21
- package/dist/types-ts4.5/plugins/panel/utils.d.ts +0 -5
|
@@ -1,81 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
exports.keymapPlugin = keymapPlugin;
|
|
8
|
-
var _utils = require("@atlaskit/editor-common/utils");
|
|
9
|
-
var _keymap = require("@atlaskit/editor-prosemirror/keymap");
|
|
10
|
-
var _utils2 = require("@atlaskit/editor-prosemirror/utils");
|
|
11
|
-
function findParentNode(selection, nodeType) {
|
|
12
|
-
var parentPosition = (0, _utils2.findParentNodeOfType)(nodeType)(selection);
|
|
13
|
-
if (parentPosition) {
|
|
14
|
-
return parentPosition.node;
|
|
15
|
-
}
|
|
16
|
-
return null;
|
|
17
|
-
}
|
|
18
|
-
function isInsideAnEmptyNode(selection, nodeType, schema) {
|
|
19
|
-
var parentNode = findParentNode(selection, nodeType);
|
|
20
|
-
return parentNode && (0, _utils.isEmptyNode)(schema)(parentNode);
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
// Somewhat broken and subverted: https://product-fabric.atlassian.net/browse/ED-6504
|
|
24
|
-
function keymapPlugin() {
|
|
25
|
-
var deleteCurrentItem = function deleteCurrentItem($from, tr) {
|
|
26
|
-
return tr.delete($from.before($from.depth) - 1, $from.end($from.depth) + 1);
|
|
27
|
-
};
|
|
28
|
-
var keymaps = {
|
|
29
|
-
Backspace: function Backspace(state, dispatch) {
|
|
30
|
-
var _nodeBeforePanel$type;
|
|
31
|
-
var selection = state.selection,
|
|
32
|
-
nodes = state.schema.nodes,
|
|
33
|
-
tr = state.tr;
|
|
34
|
-
var panel = nodes.panel,
|
|
35
|
-
blockquote = nodes.blockquote;
|
|
36
|
-
var $from = selection.$from,
|
|
37
|
-
$to = selection.$to;
|
|
38
|
-
// Don't do anything if selection is a range
|
|
39
|
-
if ($from.pos !== $to.pos) {
|
|
40
|
-
return false;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
// If not at the start of a panel, no joining will happen so allow default behaviour (backspacing characters etc..)
|
|
44
|
-
if ($from.parentOffset !== 0) {
|
|
45
|
-
return false;
|
|
46
|
-
}
|
|
47
|
-
var $previousPos = tr.doc.resolve(Math.max(0, $from.before($from.depth) - 1));
|
|
48
|
-
var previousNodeType = $previousPos.pos > 0 && $previousPos.parent && $previousPos.parent.type;
|
|
49
|
-
var parentNodeType = $from.parent.type;
|
|
50
|
-
var isPreviousNodeAPanel = previousNodeType === panel;
|
|
51
|
-
var isParentNodeAPanel = parentNodeType === panel;
|
|
52
|
-
var nodeBeforePanel = $previousPos === null || $previousPos === void 0 ? void 0 : $previousPos.nodeBefore;
|
|
53
|
-
|
|
54
|
-
// Stops merging panels when deleting empty paragraph in between
|
|
55
|
-
// Stops merging blockquotes with panels when deleting from start of blockquote
|
|
56
|
-
|
|
57
|
-
if (isPreviousNodeAPanel && !isParentNodeAPanel || isInsideAnEmptyNode(selection, panel, state.schema) || (0, _utils2.hasParentNodeOfType)(blockquote)(selection) ||
|
|
58
|
-
// Lift line of panel content up and out of the panel, when backspacing
|
|
59
|
-
// at the start of a panel, if the node before the panel is an 'isolating' node
|
|
60
|
-
// (for e.g. a table, or an expand), otherwise the default prosemirror backspace
|
|
61
|
-
// behaviour will fallback to 'select node backward' logic because the node
|
|
62
|
-
// before is an isolating node.
|
|
63
|
-
nodeBeforePanel !== null && nodeBeforePanel !== void 0 && (_nodeBeforePanel$type = nodeBeforePanel.type) !== null && _nodeBeforePanel$type !== void 0 && (_nodeBeforePanel$type = _nodeBeforePanel$type.spec) !== null && _nodeBeforePanel$type !== void 0 && _nodeBeforePanel$type.isolating && (0, _utils2.hasParentNodeOfType)(panel)(selection)) {
|
|
64
|
-
var content = $from.node($from.depth).content;
|
|
65
|
-
var insertPos = $previousPos.pos;
|
|
66
|
-
deleteCurrentItem($from, tr).insert(insertPos, content);
|
|
67
|
-
if (dispatch) {
|
|
68
|
-
dispatch((0, _utils2.setTextSelection)(insertPos)(tr).scrollIntoView());
|
|
69
|
-
}
|
|
70
|
-
return true;
|
|
71
|
-
}
|
|
72
|
-
var nodeType = $from.node().type;
|
|
73
|
-
if (nodeType !== panel) {
|
|
74
|
-
return false;
|
|
75
|
-
}
|
|
76
|
-
return true;
|
|
77
|
-
}
|
|
78
|
-
};
|
|
79
|
-
return (0, _keymap.keymap)(keymaps);
|
|
80
|
-
}
|
|
81
|
-
var _default = exports.default = keymapPlugin;
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.createPlugin = void 0;
|
|
7
|
-
var _panel = require("@atlaskit/editor-common/panel");
|
|
8
|
-
var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
|
|
9
|
-
var _selection = require("@atlaskit/editor-common/selection");
|
|
10
|
-
var _panel2 = require("../nodeviews/panel");
|
|
11
|
-
var _types = require("../types");
|
|
12
|
-
var createPlugin = exports.createPlugin = function createPlugin(dispatch, providerFactory, pluginOptions) {
|
|
13
|
-
var _pluginOptions$useLon = pluginOptions.useLongPressSelection,
|
|
14
|
-
useLongPressSelection = _pluginOptions$useLon === void 0 ? false : _pluginOptions$useLon;
|
|
15
|
-
return new _safePlugin.SafePlugin({
|
|
16
|
-
key: _types.pluginKey,
|
|
17
|
-
props: {
|
|
18
|
-
nodeViews: {
|
|
19
|
-
panel: (0, _panel2.getPanelNodeView)(pluginOptions, providerFactory)
|
|
20
|
-
},
|
|
21
|
-
handleClickOn: (0, _selection.createSelectionClickHandler)(['panel'], function (target) {
|
|
22
|
-
return !!target.closest(".".concat(_panel.PanelSharedCssClassName.prefix));
|
|
23
|
-
}, {
|
|
24
|
-
useLongPressSelection: useLongPressSelection
|
|
25
|
-
})
|
|
26
|
-
}
|
|
27
|
-
});
|
|
28
|
-
};
|
|
@@ -1,293 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.panelIconMap = exports.getToolbarItems = exports.getToolbarConfig = void 0;
|
|
8
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
-
var _adfSchema = require("@atlaskit/adf-schema");
|
|
10
|
-
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
11
|
-
var _editorAnalytics = require("@atlaskit/editor-common/editor-analytics");
|
|
12
|
-
var _messages = _interopRequireDefault(require("@atlaskit/editor-common/messages"));
|
|
13
|
-
var _panel = require("@atlaskit/editor-common/panel");
|
|
14
|
-
var _uiColor = require("@atlaskit/editor-common/ui-color");
|
|
15
|
-
var _utils = require("@atlaskit/editor-prosemirror/utils");
|
|
16
|
-
var _error = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/error"));
|
|
17
|
-
var _info = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/info"));
|
|
18
|
-
var _note = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/note"));
|
|
19
|
-
var _remove = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/remove"));
|
|
20
|
-
var _removeEmoji = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/remove-emoji"));
|
|
21
|
-
var _success = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/success"));
|
|
22
|
-
var _warning = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/warning"));
|
|
23
|
-
var _actions = require("./actions");
|
|
24
|
-
var _message = require("./message");
|
|
25
|
-
var _utils2 = require("./utils");
|
|
26
|
-
var _panelIconMap;
|
|
27
|
-
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; }
|
|
28
|
-
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; }
|
|
29
|
-
var panelIconMap = exports.panelIconMap = (_panelIconMap = {}, (0, _defineProperty2.default)(_panelIconMap, _adfSchema.PanelType.INFO, {
|
|
30
|
-
shortName: ':info:',
|
|
31
|
-
id: 'atlassian-info'
|
|
32
|
-
}), (0, _defineProperty2.default)(_panelIconMap, _adfSchema.PanelType.NOTE, {
|
|
33
|
-
shortName: ':note:',
|
|
34
|
-
id: 'atlassian-note'
|
|
35
|
-
}), (0, _defineProperty2.default)(_panelIconMap, _adfSchema.PanelType.WARNING, {
|
|
36
|
-
shortName: ':warning:',
|
|
37
|
-
id: 'atlassian-warning'
|
|
38
|
-
}), (0, _defineProperty2.default)(_panelIconMap, _adfSchema.PanelType.ERROR, {
|
|
39
|
-
shortName: ':cross_mark:',
|
|
40
|
-
id: 'atlassian-cross_mark'
|
|
41
|
-
}), (0, _defineProperty2.default)(_panelIconMap, _adfSchema.PanelType.SUCCESS, {
|
|
42
|
-
shortName: ':check_mark:',
|
|
43
|
-
id: 'atlassian-check_mark'
|
|
44
|
-
}), (0, _defineProperty2.default)(_panelIconMap, _adfSchema.PanelType.TIP, {
|
|
45
|
-
shortName: ':tip:',
|
|
46
|
-
id: 'atlassian-tip'
|
|
47
|
-
}), _panelIconMap);
|
|
48
|
-
var getToolbarItems = exports.getToolbarItems = function getToolbarItems(formatMessage, panelNodeType, isCustomPanelEnabled, isCustomPanelEditable, providerFactory, hoverDecoration, editorAnalyticsAPI, activePanelType, activePanelColor, activePanelIcon, state) {
|
|
49
|
-
// TODO: ED-14403 investigate why these titles are not getting translated for the tooltips
|
|
50
|
-
var items = [{
|
|
51
|
-
id: 'editor.panel.info',
|
|
52
|
-
type: 'button',
|
|
53
|
-
icon: _info.default,
|
|
54
|
-
onClick: (0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.INFO),
|
|
55
|
-
selected: activePanelType === _adfSchema.PanelType.INFO,
|
|
56
|
-
title: formatMessage(_message.messages.info),
|
|
57
|
-
tabIndex: null
|
|
58
|
-
}, {
|
|
59
|
-
id: 'editor.panel.note',
|
|
60
|
-
type: 'button',
|
|
61
|
-
icon: _note.default,
|
|
62
|
-
onClick: (0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.NOTE),
|
|
63
|
-
selected: activePanelType === _adfSchema.PanelType.NOTE,
|
|
64
|
-
title: formatMessage(_message.messages.note),
|
|
65
|
-
tabIndex: null
|
|
66
|
-
}, {
|
|
67
|
-
id: 'editor.panel.success',
|
|
68
|
-
type: 'button',
|
|
69
|
-
icon: _success.default,
|
|
70
|
-
onClick: (0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.SUCCESS),
|
|
71
|
-
selected: activePanelType === _adfSchema.PanelType.SUCCESS,
|
|
72
|
-
title: formatMessage(_message.messages.success),
|
|
73
|
-
tabIndex: null
|
|
74
|
-
}, {
|
|
75
|
-
id: 'editor.panel.warning',
|
|
76
|
-
type: 'button',
|
|
77
|
-
icon: _warning.default,
|
|
78
|
-
onClick: (0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.WARNING),
|
|
79
|
-
selected: activePanelType === _adfSchema.PanelType.WARNING,
|
|
80
|
-
title: formatMessage(_message.messages.warning),
|
|
81
|
-
tabIndex: null
|
|
82
|
-
}, {
|
|
83
|
-
id: 'editor.panel.error',
|
|
84
|
-
type: 'button',
|
|
85
|
-
icon: _error.default,
|
|
86
|
-
onClick: (0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.ERROR),
|
|
87
|
-
selected: activePanelType === _adfSchema.PanelType.ERROR,
|
|
88
|
-
title: formatMessage(_message.messages.error),
|
|
89
|
-
tabIndex: null
|
|
90
|
-
}];
|
|
91
|
-
if (isCustomPanelEnabled) {
|
|
92
|
-
var changeColor = function changeColor(color) {
|
|
93
|
-
return function (state, dispatch) {
|
|
94
|
-
var panelNode = (0, _utils2.findPanel)(state);
|
|
95
|
-
if (panelNode === undefined) {
|
|
96
|
-
return false;
|
|
97
|
-
}
|
|
98
|
-
var previousColor = panelNode.node.attrs.panelType === 'custom' ? panelNode.node.attrs.panelColor || 'none' : (0, _panel.getPanelTypeBackgroundNoTokens)(panelNode.node.attrs.panelType);
|
|
99
|
-
var emojiInfo = panelNode.node.attrs.panelType;
|
|
100
|
-
var panelEmoji = panelIconMap[emojiInfo];
|
|
101
|
-
var previousEmoji = panelEmoji ? {
|
|
102
|
-
emoji: panelEmoji.shortName,
|
|
103
|
-
emojiId: panelEmoji.id
|
|
104
|
-
} : {};
|
|
105
|
-
if (previousColor === color) {
|
|
106
|
-
(0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.CUSTOM, _objectSpread({
|
|
107
|
-
color: color
|
|
108
|
-
}, previousEmoji), isCustomPanelEnabled)(state, dispatch);
|
|
109
|
-
return false;
|
|
110
|
-
}
|
|
111
|
-
var payload = {
|
|
112
|
-
action: _analytics.ACTION.CHANGED_BACKGROUND_COLOR,
|
|
113
|
-
actionSubject: _analytics.ACTION_SUBJECT.PANEL,
|
|
114
|
-
actionSubjectId: _analytics.ACTION_SUBJECT_ID.PANEL,
|
|
115
|
-
attributes: {
|
|
116
|
-
newColor: color,
|
|
117
|
-
previousColor: previousColor
|
|
118
|
-
},
|
|
119
|
-
eventType: _analytics.EVENT_TYPE.TRACK
|
|
120
|
-
};
|
|
121
|
-
(0, _editorAnalytics.withAnalytics)(editorAnalyticsAPI, payload)((0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.CUSTOM, _objectSpread({
|
|
122
|
-
color: color
|
|
123
|
-
}, previousEmoji), isCustomPanelEnabled))(state, dispatch);
|
|
124
|
-
return false;
|
|
125
|
-
};
|
|
126
|
-
};
|
|
127
|
-
var changeEmoji = function changeEmoji(emoji) {
|
|
128
|
-
return function (state, dispatch) {
|
|
129
|
-
var panelNode = (0, _utils2.findPanel)(state);
|
|
130
|
-
if (panelNode === undefined) {
|
|
131
|
-
return false;
|
|
132
|
-
}
|
|
133
|
-
var previousIcon = panelNode.node.attrs.panelIcon || '';
|
|
134
|
-
if (previousIcon === emoji.shortName) {
|
|
135
|
-
(0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.CUSTOM, {
|
|
136
|
-
emoji: emoji.shortName,
|
|
137
|
-
emojiId: emoji.id,
|
|
138
|
-
emojiText: emoji.fallback
|
|
139
|
-
}, true)(state, dispatch);
|
|
140
|
-
return false;
|
|
141
|
-
}
|
|
142
|
-
var payload = {
|
|
143
|
-
action: _analytics.ACTION.CHANGED_ICON,
|
|
144
|
-
actionSubject: _analytics.ACTION_SUBJECT.PANEL,
|
|
145
|
-
actionSubjectId: _analytics.ACTION_SUBJECT_ID.PANEL,
|
|
146
|
-
attributes: {
|
|
147
|
-
newIcon: emoji.shortName,
|
|
148
|
-
previousIcon: previousIcon
|
|
149
|
-
},
|
|
150
|
-
eventType: _analytics.EVENT_TYPE.TRACK
|
|
151
|
-
};
|
|
152
|
-
(0, _editorAnalytics.withAnalytics)(editorAnalyticsAPI, payload)((0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.CUSTOM, {
|
|
153
|
-
emoji: emoji.shortName,
|
|
154
|
-
emojiId: emoji.id,
|
|
155
|
-
emojiText: emoji.fallback
|
|
156
|
-
}, true))(state, dispatch);
|
|
157
|
-
return false;
|
|
158
|
-
};
|
|
159
|
-
};
|
|
160
|
-
var removeEmoji = function removeEmoji() {
|
|
161
|
-
return function (state, dispatch) {
|
|
162
|
-
var panelNode = (0, _utils2.findPanel)(state);
|
|
163
|
-
if (activePanelType === _adfSchema.PanelType.CUSTOM && !activePanelIcon) {
|
|
164
|
-
return false;
|
|
165
|
-
}
|
|
166
|
-
if (panelNode === undefined) {
|
|
167
|
-
return false;
|
|
168
|
-
}
|
|
169
|
-
var payload = {
|
|
170
|
-
action: _analytics.ACTION.REMOVE_ICON,
|
|
171
|
-
actionSubject: _analytics.ACTION_SUBJECT.PANEL,
|
|
172
|
-
actionSubjectId: _analytics.ACTION_SUBJECT_ID.PANEL,
|
|
173
|
-
attributes: {
|
|
174
|
-
icon: panelNode.node.attrs.panelIcon
|
|
175
|
-
},
|
|
176
|
-
eventType: _analytics.EVENT_TYPE.TRACK
|
|
177
|
-
};
|
|
178
|
-
(0, _editorAnalytics.withAnalytics)(editorAnalyticsAPI, payload)((0, _actions.changePanelType)(editorAnalyticsAPI)(_adfSchema.PanelType.CUSTOM, {
|
|
179
|
-
emoji: undefined,
|
|
180
|
-
emojiId: undefined,
|
|
181
|
-
emojiText: undefined
|
|
182
|
-
}, isCustomPanelEnabled))(state, dispatch);
|
|
183
|
-
return false;
|
|
184
|
-
};
|
|
185
|
-
};
|
|
186
|
-
var panelColor = activePanelType === _adfSchema.PanelType.CUSTOM ? activePanelColor || (0, _panel.getPanelTypeBackgroundNoTokens)(_adfSchema.PanelType.INFO) : (0, _panel.getPanelTypeBackgroundNoTokens)(activePanelType);
|
|
187
|
-
var defaultPalette = _uiColor.panelBackgroundPalette.find(function (item) {
|
|
188
|
-
return item.value === panelColor;
|
|
189
|
-
}) || {
|
|
190
|
-
label: 'Custom',
|
|
191
|
-
value: panelColor,
|
|
192
|
-
border: _uiColor.DEFAULT_BORDER_COLOR
|
|
193
|
-
};
|
|
194
|
-
if (isCustomPanelEditable) {
|
|
195
|
-
var colorPicker = {
|
|
196
|
-
id: 'editor.panel.colorPicker',
|
|
197
|
-
title: formatMessage(_message.messages.backgroundColor),
|
|
198
|
-
type: 'select',
|
|
199
|
-
selectType: 'color',
|
|
200
|
-
defaultValue: defaultPalette,
|
|
201
|
-
options: _uiColor.panelBackgroundPalette,
|
|
202
|
-
onChange: function onChange(option) {
|
|
203
|
-
return changeColor(option.value);
|
|
204
|
-
}
|
|
205
|
-
};
|
|
206
|
-
var emojiPicker = {
|
|
207
|
-
id: 'editor.panel.emojiPicker',
|
|
208
|
-
title: formatMessage(_message.messages.emoji),
|
|
209
|
-
type: 'select',
|
|
210
|
-
selectType: 'emoji',
|
|
211
|
-
options: [],
|
|
212
|
-
selected: activePanelType === _adfSchema.PanelType.CUSTOM && !!activePanelIcon,
|
|
213
|
-
onChange: function onChange(emoji) {
|
|
214
|
-
return changeEmoji(emoji);
|
|
215
|
-
}
|
|
216
|
-
};
|
|
217
|
-
var removeEmojiButton = {
|
|
218
|
-
id: 'editor.panel.removeEmoji',
|
|
219
|
-
type: 'button',
|
|
220
|
-
icon: _removeEmoji.default,
|
|
221
|
-
onClick: removeEmoji(),
|
|
222
|
-
title: formatMessage(_messages.default.removeEmoji),
|
|
223
|
-
disabled: activePanelIcon ? false : true
|
|
224
|
-
};
|
|
225
|
-
items.push(emojiPicker, removeEmojiButton, {
|
|
226
|
-
type: 'separator'
|
|
227
|
-
}, colorPicker);
|
|
228
|
-
}
|
|
229
|
-
}
|
|
230
|
-
if (state) {
|
|
231
|
-
items.push({
|
|
232
|
-
type: 'copy-button',
|
|
233
|
-
items: [{
|
|
234
|
-
type: 'separator'
|
|
235
|
-
}, {
|
|
236
|
-
state: state,
|
|
237
|
-
formatMessage: formatMessage,
|
|
238
|
-
nodeType: panelNodeType
|
|
239
|
-
}]
|
|
240
|
-
});
|
|
241
|
-
}
|
|
242
|
-
items.push({
|
|
243
|
-
type: 'separator'
|
|
244
|
-
}, {
|
|
245
|
-
id: 'editor.panel.delete',
|
|
246
|
-
type: 'button',
|
|
247
|
-
appearance: 'danger',
|
|
248
|
-
focusEditoronEnter: true,
|
|
249
|
-
icon: _remove.default,
|
|
250
|
-
onClick: (0, _actions.removePanel)(editorAnalyticsAPI),
|
|
251
|
-
onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(panelNodeType, true),
|
|
252
|
-
onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(panelNodeType, false),
|
|
253
|
-
onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(panelNodeType, true),
|
|
254
|
-
onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(panelNodeType, false),
|
|
255
|
-
title: formatMessage(_messages.default.remove),
|
|
256
|
-
tabIndex: null
|
|
257
|
-
});
|
|
258
|
-
return items;
|
|
259
|
-
};
|
|
260
|
-
var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(state, intl) {
|
|
261
|
-
var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
262
|
-
var providerFactory = arguments.length > 3 ? arguments[3] : undefined;
|
|
263
|
-
var api = arguments.length > 4 ? arguments[4] : undefined;
|
|
264
|
-
var formatMessage = intl.formatMessage;
|
|
265
|
-
var panelObject = (0, _utils2.findPanel)(state);
|
|
266
|
-
if (panelObject) {
|
|
267
|
-
var _api$analytics;
|
|
268
|
-
var nodeType = state.schema.nodes.panel;
|
|
269
|
-
var _panelObject$node$att = panelObject.node.attrs,
|
|
270
|
-
panelType = _panelObject$node$att.panelType,
|
|
271
|
-
panelColor = _panelObject$node$att.panelColor,
|
|
272
|
-
panelIcon = _panelObject$node$att.panelIcon;
|
|
273
|
-
var isStandardPanel = function isStandardPanel(panelType) {
|
|
274
|
-
return panelType !== _adfSchema.PanelType.CUSTOM ? panelType : undefined;
|
|
275
|
-
};
|
|
276
|
-
|
|
277
|
-
// force toolbar to be turned on
|
|
278
|
-
var items = getToolbarItems(formatMessage, nodeType, options.allowCustomPanel || false, options.allowCustomPanel && options.allowCustomPanelEdit || false, providerFactory, api === null || api === void 0 ? void 0 : api.decorations.actions.hoverDecoration, api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, panelType, options.allowCustomPanel ? panelColor : undefined, options.allowCustomPanel ? panelIcon || isStandardPanel(panelType) : undefined, state);
|
|
279
|
-
var getDomRef = function getDomRef(editorView) {
|
|
280
|
-
var domAtPos = editorView.domAtPos.bind(editorView);
|
|
281
|
-
var element = (0, _utils.findDomRefAtPos)(panelObject.pos, domAtPos);
|
|
282
|
-
return element;
|
|
283
|
-
};
|
|
284
|
-
return {
|
|
285
|
-
title: 'Panel floating controls',
|
|
286
|
-
getDomRef: getDomRef,
|
|
287
|
-
nodeType: nodeType,
|
|
288
|
-
items: items,
|
|
289
|
-
scrollable: true
|
|
290
|
-
};
|
|
291
|
-
}
|
|
292
|
-
return;
|
|
293
|
-
};
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.panelAttrsToDom = exports.findPanel = void 0;
|
|
8
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
-
var _adfSchema = require("@atlaskit/adf-schema");
|
|
10
|
-
var _panel = require("@atlaskit/editor-common/panel");
|
|
11
|
-
var _editorPalette = require("@atlaskit/editor-palette");
|
|
12
|
-
var _utils = require("@atlaskit/editor-prosemirror/utils");
|
|
13
|
-
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; }
|
|
14
|
-
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; }
|
|
15
|
-
var findPanel = exports.findPanel = function findPanel(state, selection) {
|
|
16
|
-
var panel = state.schema.nodes.panel;
|
|
17
|
-
return (0, _utils.findSelectedNodeOfType)(panel)(selection || state.selection) || (0, _utils.findParentNodeOfType)(panel)(selection || state.selection);
|
|
18
|
-
};
|
|
19
|
-
var panelAttrsToDom = exports.panelAttrsToDom = function panelAttrsToDom(attrs, allowCustomPanel) {
|
|
20
|
-
var panelColor = attrs.panelColor,
|
|
21
|
-
panelType = attrs.panelType,
|
|
22
|
-
panelIcon = attrs.panelIcon,
|
|
23
|
-
panelIconId = attrs.panelIconId,
|
|
24
|
-
panelIconText = attrs.panelIconText;
|
|
25
|
-
var isCustomPanel = panelType === _adfSchema.PanelType.CUSTOM && allowCustomPanel;
|
|
26
|
-
var hasIcon = !isCustomPanel || !!panelIcon || !!panelIconId;
|
|
27
|
-
var tokenColor = panelColor && (0, _editorPalette.hexToEditorBackgroundPaletteColor)(panelColor);
|
|
28
|
-
var panelBackgroundColor = tokenColor || panelColor;
|
|
29
|
-
var style = ["".concat(panelColor && isCustomPanel ? "background-color: ".concat(panelBackgroundColor, ";") : ''), "".concat(hasIcon ? '' : 'padding-left: 12px;')].join('');
|
|
30
|
-
var panelAttrs = {
|
|
31
|
-
class: _panel.PanelSharedCssClassName.prefix,
|
|
32
|
-
'data-panel-type': panelType || _adfSchema.PanelType.INFO,
|
|
33
|
-
style: style
|
|
34
|
-
};
|
|
35
|
-
if (panelColor && isCustomPanel) {
|
|
36
|
-
panelAttrs = _objectSpread(_objectSpread({}, panelAttrs), {}, {
|
|
37
|
-
'data-panel-color': panelColor,
|
|
38
|
-
'data-panel-icon-id': panelIconId,
|
|
39
|
-
'data-panel-icon-text': panelIconText
|
|
40
|
-
});
|
|
41
|
-
}
|
|
42
|
-
var iconDiv = ['div', {
|
|
43
|
-
class: _panel.PanelSharedCssClassName.icon
|
|
44
|
-
}];
|
|
45
|
-
var contentDiv = ['div', {
|
|
46
|
-
class: _panel.PanelSharedCssClassName.content
|
|
47
|
-
}, 0];
|
|
48
|
-
if (hasIcon) {
|
|
49
|
-
return ['div', panelAttrs, iconDiv, contentDiv];
|
|
50
|
-
} else {
|
|
51
|
-
return ['div', panelAttrs, contentDiv];
|
|
52
|
-
}
|
|
53
|
-
};
|
|
@@ -1,116 +0,0 @@
|
|
|
1
|
-
import { PanelType } from '@atlaskit/adf-schema';
|
|
2
|
-
import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
3
|
-
import { withAnalytics } from '@atlaskit/editor-common/editor-analytics';
|
|
4
|
-
import { getPanelTypeBackgroundNoTokens } from '@atlaskit/editor-common/panel';
|
|
5
|
-
import { wrapSelectionIn } from '@atlaskit/editor-common/utils';
|
|
6
|
-
import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
|
|
7
|
-
import { findParentNodeOfType, findSelectedNodeOfType, removeParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
|
|
8
|
-
import { findPanel } from './utils';
|
|
9
|
-
export const removePanel = editorAnalyticsAPI => (state, dispatch) => {
|
|
10
|
-
const {
|
|
11
|
-
schema: {
|
|
12
|
-
nodes
|
|
13
|
-
},
|
|
14
|
-
tr
|
|
15
|
-
} = state;
|
|
16
|
-
const payload = {
|
|
17
|
-
action: ACTION.DELETED,
|
|
18
|
-
actionSubject: ACTION_SUBJECT.PANEL,
|
|
19
|
-
attributes: {
|
|
20
|
-
inputMethod: INPUT_METHOD.TOOLBAR
|
|
21
|
-
},
|
|
22
|
-
eventType: EVENT_TYPE.TRACK
|
|
23
|
-
};
|
|
24
|
-
let deleteTr = tr;
|
|
25
|
-
if (findSelectedNodeOfType(nodes.panel)(tr.selection)) {
|
|
26
|
-
deleteTr = removeSelectedNode(tr);
|
|
27
|
-
} else if (findParentNodeOfType(nodes.panel)(tr.selection)) {
|
|
28
|
-
deleteTr = removeParentNodeOfType(nodes.panel)(tr);
|
|
29
|
-
}
|
|
30
|
-
if (!deleteTr) {
|
|
31
|
-
return false;
|
|
32
|
-
}
|
|
33
|
-
if (dispatch) {
|
|
34
|
-
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent(payload)(deleteTr);
|
|
35
|
-
dispatch(deleteTr);
|
|
36
|
-
}
|
|
37
|
-
return true;
|
|
38
|
-
};
|
|
39
|
-
export const changePanelType = editorAnalyticsAPI => (panelType, panelOptions = {}, allowCustomPanel = false) => (state, dispatch) => {
|
|
40
|
-
const {
|
|
41
|
-
schema: {
|
|
42
|
-
nodes
|
|
43
|
-
},
|
|
44
|
-
tr
|
|
45
|
-
} = state;
|
|
46
|
-
const panelNode = findPanel(state);
|
|
47
|
-
if (panelNode === undefined) {
|
|
48
|
-
return false;
|
|
49
|
-
}
|
|
50
|
-
let newType = panelType;
|
|
51
|
-
let previousType = panelNode.node.attrs.panelType;
|
|
52
|
-
let newTr;
|
|
53
|
-
if (allowCustomPanel) {
|
|
54
|
-
let previousColor = panelNode.node.attrs.panelType === 'custom' ? panelNode.node.attrs.panelColor || 'none' : getPanelTypeBackgroundNoTokens(previousType);
|
|
55
|
-
let previousIcon = panelNode.node.attrs.panelIcon;
|
|
56
|
-
let previousIconId = panelNode.node.attrs.panelIconId;
|
|
57
|
-
let previousIconText = panelNode.node.attrs.panelIconText;
|
|
58
|
-
let newPanelOptions = {
|
|
59
|
-
color: previousColor,
|
|
60
|
-
emoji: previousIcon,
|
|
61
|
-
emojiId: previousIconId,
|
|
62
|
-
emojiText: previousIconText,
|
|
63
|
-
...panelOptions
|
|
64
|
-
};
|
|
65
|
-
newTr = tr.setNodeMarkup(panelNode.pos, nodes.panel, {
|
|
66
|
-
panelIcon: newPanelOptions.emoji,
|
|
67
|
-
panelIconId: newPanelOptions.emojiId,
|
|
68
|
-
panelIconText: newPanelOptions.emojiText,
|
|
69
|
-
panelColor: newPanelOptions.color,
|
|
70
|
-
panelType
|
|
71
|
-
});
|
|
72
|
-
} else {
|
|
73
|
-
newTr = tr.setNodeMarkup(panelNode.pos, nodes.panel, {
|
|
74
|
-
panelType
|
|
75
|
-
});
|
|
76
|
-
}
|
|
77
|
-
const payload = {
|
|
78
|
-
action: ACTION.CHANGED_TYPE,
|
|
79
|
-
actionSubject: ACTION_SUBJECT.PANEL,
|
|
80
|
-
attributes: {
|
|
81
|
-
newType,
|
|
82
|
-
previousType
|
|
83
|
-
},
|
|
84
|
-
eventType: EVENT_TYPE.TRACK
|
|
85
|
-
};
|
|
86
|
-
|
|
87
|
-
// Select the panel if it was previously selected
|
|
88
|
-
const newTrWithSelection = state.selection instanceof NodeSelection && state.selection.node.type.name === 'panel' ? newTr.setSelection(new NodeSelection(tr.doc.resolve(panelNode.pos))) : newTr;
|
|
89
|
-
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent(payload)(newTrWithSelection);
|
|
90
|
-
newTrWithSelection.setMeta('scrollIntoView', false);
|
|
91
|
-
if (dispatch) {
|
|
92
|
-
dispatch(newTrWithSelection);
|
|
93
|
-
}
|
|
94
|
-
return true;
|
|
95
|
-
};
|
|
96
|
-
export function insertPanelWithAnalytics(inputMethod, analyticsAPI) {
|
|
97
|
-
return withAnalytics(analyticsAPI, {
|
|
98
|
-
action: ACTION.INSERTED,
|
|
99
|
-
actionSubject: ACTION_SUBJECT.DOCUMENT,
|
|
100
|
-
actionSubjectId: ACTION_SUBJECT_ID.PANEL,
|
|
101
|
-
attributes: {
|
|
102
|
-
inputMethod: inputMethod,
|
|
103
|
-
panelType: PanelType.INFO // only info panels can be inserted via this action
|
|
104
|
-
},
|
|
105
|
-
|
|
106
|
-
eventType: EVENT_TYPE.TRACK
|
|
107
|
-
})(function (state, dispatch) {
|
|
108
|
-
const {
|
|
109
|
-
nodes
|
|
110
|
-
} = state.schema;
|
|
111
|
-
if (nodes.panel && nodes.paragraph) {
|
|
112
|
-
return wrapSelectionIn(nodes.panel)(state, dispatch);
|
|
113
|
-
}
|
|
114
|
-
return false;
|
|
115
|
-
});
|
|
116
|
-
}
|