@atlaskit/editor-plugin-media 0.10.2 → 0.10.4
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 +13 -0
- package/dist/cjs/commands/linking.js +32 -5
- package/dist/cjs/toolbar/commands.js +27 -13
- package/dist/es2019/commands/linking.js +37 -4
- package/dist/es2019/toolbar/commands.js +17 -2
- package/dist/esm/commands/linking.js +32 -5
- package/dist/esm/toolbar/commands.js +27 -13
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-media
|
|
2
2
|
|
|
3
|
+
## 0.10.4
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#65825](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/65825) [`d08cdd1cb2aa`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d08cdd1cb2aa) - add extra attributes for media link
|
|
8
|
+
|
|
9
|
+
## 0.10.3
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [#65846](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/65846) [`aa24d3f38df0`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/aa24d3f38df0) - Updated analytics for border mark
|
|
14
|
+
- Updated dependencies
|
|
15
|
+
|
|
3
16
|
## 0.10.2
|
|
4
17
|
|
|
5
18
|
### Patch Changes
|
|
@@ -185,7 +185,7 @@ var unlink = exports.unlink = function unlink(editorAnalyticsAPI) {
|
|
|
185
185
|
var transaction = toggleLinkMark(tr, state, {
|
|
186
186
|
forceRemove: true
|
|
187
187
|
});
|
|
188
|
-
return fireAnalyticForMediaLink(transaction, _analytics.ACTION.DELETED,
|
|
188
|
+
return fireAnalyticForMediaLink(transaction, _analytics.ACTION.DELETED, _objectSpread({}, getNodeTypeAndMediaTypeAttributes(state)), editorAnalyticsAPI);
|
|
189
189
|
});
|
|
190
190
|
};
|
|
191
191
|
var getAction = function getAction(newUrl, state) {
|
|
@@ -197,6 +197,32 @@ var getAction = function getAction(newUrl, state) {
|
|
|
197
197
|
}
|
|
198
198
|
return undefined;
|
|
199
199
|
};
|
|
200
|
+
var getNodeTypeAndMediaTypeAttributes = function getNodeTypeAndMediaTypeAttributes(state) {
|
|
201
|
+
var mediaLinkingState = (0, _linking.getMediaLinkingState)(state);
|
|
202
|
+
var _getMediaPluginState2 = (0, _main.getMediaPluginState)(state),
|
|
203
|
+
allowInlineImages = _getMediaPluginState2.allowInlineImages;
|
|
204
|
+
var _state$schema$nodes2 = state.schema.nodes,
|
|
205
|
+
mediaInline = _state$schema$nodes2.mediaInline,
|
|
206
|
+
mediaSingle = _state$schema$nodes2.mediaSingle;
|
|
207
|
+
if (!mediaLinkingState || mediaLinkingState.mediaPos === null) {
|
|
208
|
+
return;
|
|
209
|
+
}
|
|
210
|
+
var $pos = state.doc.resolve(mediaLinkingState.mediaPos);
|
|
211
|
+
var node = state.doc.nodeAt($pos.pos);
|
|
212
|
+
if (!node) {
|
|
213
|
+
return {};
|
|
214
|
+
}
|
|
215
|
+
if (allowInlineImages && node.type === mediaInline) {
|
|
216
|
+
return {
|
|
217
|
+
type: mediaInline.name,
|
|
218
|
+
mediaType: node.attrs.type
|
|
219
|
+
};
|
|
220
|
+
}
|
|
221
|
+
return {
|
|
222
|
+
type: mediaSingle.name,
|
|
223
|
+
mediaType: node.attrs.type
|
|
224
|
+
};
|
|
225
|
+
};
|
|
200
226
|
var setUrlToMedia = exports.setUrlToMedia = function setUrlToMedia(url, inputMethod, editorAnalyticsAPI) {
|
|
201
227
|
return (0, _linking.createMediaLinkingCommand)({
|
|
202
228
|
type: _actions.MediaLinkingActionsTypes.setUrl,
|
|
@@ -206,18 +232,19 @@ var setUrlToMedia = exports.setUrlToMedia = function setUrlToMedia(url, inputMet
|
|
|
206
232
|
if (!action) {
|
|
207
233
|
return tr;
|
|
208
234
|
}
|
|
235
|
+
var nodeTypeAndMediaTypeAttrs = getNodeTypeAndMediaTypeAttributes(state);
|
|
209
236
|
try {
|
|
210
237
|
var toggleLinkMarkResult = toggleLinkMark(tr, state, {
|
|
211
238
|
url: url
|
|
212
239
|
});
|
|
213
|
-
fireAnalyticForMediaLink(tr, action, action === _analytics.ACTION.ADDED ? {
|
|
240
|
+
fireAnalyticForMediaLink(tr, action, action === _analytics.ACTION.ADDED ? _objectSpread({
|
|
214
241
|
inputMethod: inputMethod
|
|
215
|
-
} :
|
|
242
|
+
}, nodeTypeAndMediaTypeAttrs) : nodeTypeAndMediaTypeAttrs, editorAnalyticsAPI);
|
|
216
243
|
return toggleLinkMarkResult;
|
|
217
244
|
} catch (e) {
|
|
218
|
-
fireAnalyticForMediaLink(tr, _analytics.ACTION.ERRORED, {
|
|
245
|
+
fireAnalyticForMediaLink(tr, _analytics.ACTION.ERRORED, _objectSpread({
|
|
219
246
|
action: action
|
|
220
|
-
}, editorAnalyticsAPI);
|
|
247
|
+
}, nodeTypeAndMediaTypeAttrs), editorAnalyticsAPI);
|
|
221
248
|
throw e;
|
|
222
249
|
}
|
|
223
250
|
});
|
|
@@ -12,18 +12,25 @@ var _state = require("@atlaskit/editor-prosemirror/state");
|
|
|
12
12
|
var _utils = require("@atlaskit/editor-prosemirror/utils");
|
|
13
13
|
var _analytics2 = require("../utils/analytics");
|
|
14
14
|
var _currentMediaNode = require("../utils/current-media-node");
|
|
15
|
+
var _mediaCommon = require("../utils/media-common");
|
|
15
16
|
var _mediaSingle = require("../utils/media-single");
|
|
16
17
|
var _utils2 = require("./utils");
|
|
17
18
|
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; }
|
|
18
19
|
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; }
|
|
19
20
|
var DEFAULT_BORDER_COLOR = exports.DEFAULT_BORDER_COLOR = '#091e4224';
|
|
20
21
|
var DEFAULT_BORDER_SIZE = exports.DEFAULT_BORDER_SIZE = 2;
|
|
22
|
+
var getNodeType = function getNodeType(state) {
|
|
23
|
+
var _state$schema$nodes = state.schema.nodes,
|
|
24
|
+
mediaSingle = _state$schema$nodes.mediaSingle,
|
|
25
|
+
mediaInline = _state$schema$nodes.mediaInline;
|
|
26
|
+
return (0, _mediaCommon.isSelectionMediaSingleNode)(state) ? mediaSingle.name : mediaInline.name;
|
|
27
|
+
};
|
|
21
28
|
var changeInlineToMediaCard = exports.changeInlineToMediaCard = function changeInlineToMediaCard(editorAnalyticsAPI) {
|
|
22
29
|
return function (state, dispatch) {
|
|
23
|
-
var _state$schema$
|
|
24
|
-
media = _state$schema$
|
|
25
|
-
mediaInline = _state$schema$
|
|
26
|
-
mediaGroup = _state$schema$
|
|
30
|
+
var _state$schema$nodes2 = state.schema.nodes,
|
|
31
|
+
media = _state$schema$nodes2.media,
|
|
32
|
+
mediaInline = _state$schema$nodes2.mediaInline,
|
|
33
|
+
mediaGroup = _state$schema$nodes2.mediaGroup;
|
|
27
34
|
var selectedNode = state.selection instanceof _state.NodeSelection && state.selection.node.type === mediaInline && state.selection.node;
|
|
28
35
|
if (!selectedNode) {
|
|
29
36
|
return false;
|
|
@@ -59,10 +66,10 @@ var changeInlineToMediaCard = exports.changeInlineToMediaCard = function changeI
|
|
|
59
66
|
};
|
|
60
67
|
var changeMediaCardToInline = exports.changeMediaCardToInline = function changeMediaCardToInline(editorAnalyticsAPI) {
|
|
61
68
|
return function (state, dispatch) {
|
|
62
|
-
var _state$schema$
|
|
63
|
-
media = _state$schema$
|
|
64
|
-
mediaInline = _state$schema$
|
|
65
|
-
paragraph = _state$schema$
|
|
69
|
+
var _state$schema$nodes3 = state.schema.nodes,
|
|
70
|
+
media = _state$schema$nodes3.media,
|
|
71
|
+
mediaInline = _state$schema$nodes3.mediaInline,
|
|
72
|
+
paragraph = _state$schema$nodes3.paragraph;
|
|
66
73
|
var selectedNode = state.selection instanceof _state.NodeSelection && state.selection.node;
|
|
67
74
|
|
|
68
75
|
// @ts-ignore - [unblock prosemirror bump] redundant check comparing boolean to media
|
|
@@ -141,6 +148,7 @@ var toggleBorderMark = exports.toggleBorderMark = function toggleBorderMark(edit
|
|
|
141
148
|
}
|
|
142
149
|
}
|
|
143
150
|
if (dispatch) {
|
|
151
|
+
var type = getNodeType(state);
|
|
144
152
|
if (borderMark !== null && borderMark !== void 0 && borderMark.attrs) {
|
|
145
153
|
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
|
|
146
154
|
action: _analytics.ACTION.DELETED,
|
|
@@ -148,8 +156,10 @@ var toggleBorderMark = exports.toggleBorderMark = function toggleBorderMark(edit
|
|
|
148
156
|
actionSubjectId: _analytics.ACTION_SUBJECT_ID.BORDER,
|
|
149
157
|
eventType: _analytics.EVENT_TYPE.TRACK,
|
|
150
158
|
attributes: {
|
|
159
|
+
type: type,
|
|
151
160
|
previousColor: borderMark.attrs.color,
|
|
152
|
-
previousSize: borderMark.attrs.size
|
|
161
|
+
previousSize: borderMark.attrs.size,
|
|
162
|
+
mediaType: node.attrs.type
|
|
153
163
|
}
|
|
154
164
|
})(tr);
|
|
155
165
|
} else {
|
|
@@ -159,8 +169,10 @@ var toggleBorderMark = exports.toggleBorderMark = function toggleBorderMark(edit
|
|
|
159
169
|
actionSubjectId: _analytics.ACTION_SUBJECT_ID.BORDER,
|
|
160
170
|
eventType: _analytics.EVENT_TYPE.TRACK,
|
|
161
171
|
attributes: {
|
|
172
|
+
type: type,
|
|
162
173
|
color: DEFAULT_BORDER_COLOR,
|
|
163
|
-
size: DEFAULT_BORDER_SIZE
|
|
174
|
+
size: DEFAULT_BORDER_SIZE,
|
|
175
|
+
mediaType: node.attrs.type
|
|
164
176
|
}
|
|
165
177
|
})(tr);
|
|
166
178
|
}
|
|
@@ -204,6 +216,8 @@ var setBorderMark = exports.setBorderMark = function setBorderMark(editorAnalyti
|
|
|
204
216
|
actionSubjectId: _analytics.ACTION_SUBJECT_ID.BORDER,
|
|
205
217
|
eventType: _analytics.EVENT_TYPE.TRACK,
|
|
206
218
|
attributes: {
|
|
219
|
+
type: getNodeType(state),
|
|
220
|
+
mediaType: node.attrs.type,
|
|
207
221
|
previousColor: borderMark === null || borderMark === void 0 ? void 0 : borderMark.color,
|
|
208
222
|
previousSize: borderMark === null || borderMark === void 0 ? void 0 : borderMark.size,
|
|
209
223
|
newColor: color,
|
|
@@ -252,9 +266,9 @@ var updateMediaSingleWidth = exports.updateMediaSingleWidth = function updateMed
|
|
|
252
266
|
var changeMediaSingleToMediaInline = exports.changeMediaSingleToMediaInline = function changeMediaSingleToMediaInline(editorAnalyticsAPI) {
|
|
253
267
|
return function (state, dispatch) {
|
|
254
268
|
var selectedNodeWithPos = (0, _utils2.getSelectedMediaSingle)(state);
|
|
255
|
-
var _state$schema$
|
|
256
|
-
mediaInline = _state$schema$
|
|
257
|
-
paragraph = _state$schema$
|
|
269
|
+
var _state$schema$nodes4 = state.schema.nodes,
|
|
270
|
+
mediaInline = _state$schema$nodes4.mediaInline,
|
|
271
|
+
paragraph = _state$schema$nodes4.paragraph;
|
|
258
272
|
if (!selectedNodeWithPos) {
|
|
259
273
|
return false;
|
|
260
274
|
}
|
|
@@ -176,7 +176,9 @@ export const unlink = editorAnalyticsAPI => createMediaLinkingCommand({
|
|
|
176
176
|
const transaction = toggleLinkMark(tr, state, {
|
|
177
177
|
forceRemove: true
|
|
178
178
|
});
|
|
179
|
-
return fireAnalyticForMediaLink(transaction, ACTION.DELETED,
|
|
179
|
+
return fireAnalyticForMediaLink(transaction, ACTION.DELETED, {
|
|
180
|
+
...getNodeTypeAndMediaTypeAttributes(state)
|
|
181
|
+
}, editorAnalyticsAPI);
|
|
180
182
|
});
|
|
181
183
|
const getAction = (newUrl, state) => {
|
|
182
184
|
const currentUrl = getCurrentUrl(state);
|
|
@@ -187,6 +189,34 @@ const getAction = (newUrl, state) => {
|
|
|
187
189
|
}
|
|
188
190
|
return undefined;
|
|
189
191
|
};
|
|
192
|
+
const getNodeTypeAndMediaTypeAttributes = state => {
|
|
193
|
+
const mediaLinkingState = getMediaLinkingState(state);
|
|
194
|
+
const {
|
|
195
|
+
allowInlineImages
|
|
196
|
+
} = getMediaPluginState(state);
|
|
197
|
+
const {
|
|
198
|
+
mediaInline,
|
|
199
|
+
mediaSingle
|
|
200
|
+
} = state.schema.nodes;
|
|
201
|
+
if (!mediaLinkingState || mediaLinkingState.mediaPos === null) {
|
|
202
|
+
return;
|
|
203
|
+
}
|
|
204
|
+
const $pos = state.doc.resolve(mediaLinkingState.mediaPos);
|
|
205
|
+
const node = state.doc.nodeAt($pos.pos);
|
|
206
|
+
if (!node) {
|
|
207
|
+
return {};
|
|
208
|
+
}
|
|
209
|
+
if (allowInlineImages && node.type === mediaInline) {
|
|
210
|
+
return {
|
|
211
|
+
type: mediaInline.name,
|
|
212
|
+
mediaType: node.attrs.type
|
|
213
|
+
};
|
|
214
|
+
}
|
|
215
|
+
return {
|
|
216
|
+
type: mediaSingle.name,
|
|
217
|
+
mediaType: node.attrs.type
|
|
218
|
+
};
|
|
219
|
+
};
|
|
190
220
|
export const setUrlToMedia = (url, inputMethod, editorAnalyticsAPI) => createMediaLinkingCommand({
|
|
191
221
|
type: MediaLinkingActionsTypes.setUrl,
|
|
192
222
|
payload: normalizeUrl(url)
|
|
@@ -195,17 +225,20 @@ export const setUrlToMedia = (url, inputMethod, editorAnalyticsAPI) => createMed
|
|
|
195
225
|
if (!action) {
|
|
196
226
|
return tr;
|
|
197
227
|
}
|
|
228
|
+
const nodeTypeAndMediaTypeAttrs = getNodeTypeAndMediaTypeAttributes(state);
|
|
198
229
|
try {
|
|
199
230
|
const toggleLinkMarkResult = toggleLinkMark(tr, state, {
|
|
200
231
|
url: url
|
|
201
232
|
});
|
|
202
233
|
fireAnalyticForMediaLink(tr, action, action === ACTION.ADDED ? {
|
|
203
|
-
inputMethod
|
|
204
|
-
|
|
234
|
+
inputMethod,
|
|
235
|
+
...nodeTypeAndMediaTypeAttrs
|
|
236
|
+
} : nodeTypeAndMediaTypeAttrs, editorAnalyticsAPI);
|
|
205
237
|
return toggleLinkMarkResult;
|
|
206
238
|
} catch (e) {
|
|
207
239
|
fireAnalyticForMediaLink(tr, ACTION.ERRORED, {
|
|
208
|
-
action: action
|
|
240
|
+
action: action,
|
|
241
|
+
...nodeTypeAndMediaTypeAttrs
|
|
209
242
|
}, editorAnalyticsAPI);
|
|
210
243
|
throw e;
|
|
211
244
|
}
|
|
@@ -4,10 +4,18 @@ import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state
|
|
|
4
4
|
import { isNodeSelection, removeSelectedNode, safeInsert } from '@atlaskit/editor-prosemirror/utils';
|
|
5
5
|
import { findChangeFromLocation, getChangeMediaAnalytics, getMediaInputResizeAnalyticsEvent } from '../utils/analytics';
|
|
6
6
|
import { currentMediaInlineNodeWithPos, currentMediaNodeWithPos } from '../utils/current-media-node';
|
|
7
|
+
import { isSelectionMediaSingleNode } from '../utils/media-common';
|
|
7
8
|
import { changeFromMediaInlineToMediaSingleNode } from '../utils/media-single';
|
|
8
9
|
import { getSelectedMediaSingle, removeMediaGroupNode } from './utils';
|
|
9
10
|
export const DEFAULT_BORDER_COLOR = '#091e4224';
|
|
10
11
|
export const DEFAULT_BORDER_SIZE = 2;
|
|
12
|
+
const getNodeType = state => {
|
|
13
|
+
const {
|
|
14
|
+
mediaSingle,
|
|
15
|
+
mediaInline
|
|
16
|
+
} = state.schema.nodes;
|
|
17
|
+
return isSelectionMediaSingleNode(state) ? mediaSingle.name : mediaInline.name;
|
|
18
|
+
};
|
|
11
19
|
export const changeInlineToMediaCard = editorAnalyticsAPI => (state, dispatch) => {
|
|
12
20
|
const {
|
|
13
21
|
media,
|
|
@@ -127,6 +135,7 @@ export const toggleBorderMark = editorAnalyticsAPI => (state, dispatch) => {
|
|
|
127
135
|
}
|
|
128
136
|
}
|
|
129
137
|
if (dispatch) {
|
|
138
|
+
const type = getNodeType(state);
|
|
130
139
|
if (borderMark !== null && borderMark !== void 0 && borderMark.attrs) {
|
|
131
140
|
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
|
|
132
141
|
action: ACTION.DELETED,
|
|
@@ -134,8 +143,10 @@ export const toggleBorderMark = editorAnalyticsAPI => (state, dispatch) => {
|
|
|
134
143
|
actionSubjectId: ACTION_SUBJECT_ID.BORDER,
|
|
135
144
|
eventType: EVENT_TYPE.TRACK,
|
|
136
145
|
attributes: {
|
|
146
|
+
type,
|
|
137
147
|
previousColor: borderMark.attrs.color,
|
|
138
|
-
previousSize: borderMark.attrs.size
|
|
148
|
+
previousSize: borderMark.attrs.size,
|
|
149
|
+
mediaType: node.attrs.type
|
|
139
150
|
}
|
|
140
151
|
})(tr);
|
|
141
152
|
} else {
|
|
@@ -145,8 +156,10 @@ export const toggleBorderMark = editorAnalyticsAPI => (state, dispatch) => {
|
|
|
145
156
|
actionSubjectId: ACTION_SUBJECT_ID.BORDER,
|
|
146
157
|
eventType: EVENT_TYPE.TRACK,
|
|
147
158
|
attributes: {
|
|
159
|
+
type,
|
|
148
160
|
color: DEFAULT_BORDER_COLOR,
|
|
149
|
-
size: DEFAULT_BORDER_SIZE
|
|
161
|
+
size: DEFAULT_BORDER_SIZE,
|
|
162
|
+
mediaType: node.attrs.type
|
|
150
163
|
}
|
|
151
164
|
})(tr);
|
|
152
165
|
}
|
|
@@ -185,6 +198,8 @@ export const setBorderMark = editorAnalyticsAPI => attrs => (state, dispatch) =>
|
|
|
185
198
|
actionSubjectId: ACTION_SUBJECT_ID.BORDER,
|
|
186
199
|
eventType: EVENT_TYPE.TRACK,
|
|
187
200
|
attributes: {
|
|
201
|
+
type: getNodeType(state),
|
|
202
|
+
mediaType: node.attrs.type,
|
|
188
203
|
previousColor: borderMark === null || borderMark === void 0 ? void 0 : borderMark.color,
|
|
189
204
|
previousSize: borderMark === null || borderMark === void 0 ? void 0 : borderMark.size,
|
|
190
205
|
newColor: color,
|
|
@@ -178,7 +178,7 @@ export var unlink = function unlink(editorAnalyticsAPI) {
|
|
|
178
178
|
var transaction = toggleLinkMark(tr, state, {
|
|
179
179
|
forceRemove: true
|
|
180
180
|
});
|
|
181
|
-
return fireAnalyticForMediaLink(transaction, ACTION.DELETED,
|
|
181
|
+
return fireAnalyticForMediaLink(transaction, ACTION.DELETED, _objectSpread({}, getNodeTypeAndMediaTypeAttributes(state)), editorAnalyticsAPI);
|
|
182
182
|
});
|
|
183
183
|
};
|
|
184
184
|
var getAction = function getAction(newUrl, state) {
|
|
@@ -190,6 +190,32 @@ var getAction = function getAction(newUrl, state) {
|
|
|
190
190
|
}
|
|
191
191
|
return undefined;
|
|
192
192
|
};
|
|
193
|
+
var getNodeTypeAndMediaTypeAttributes = function getNodeTypeAndMediaTypeAttributes(state) {
|
|
194
|
+
var mediaLinkingState = getMediaLinkingState(state);
|
|
195
|
+
var _getMediaPluginState2 = getMediaPluginState(state),
|
|
196
|
+
allowInlineImages = _getMediaPluginState2.allowInlineImages;
|
|
197
|
+
var _state$schema$nodes2 = state.schema.nodes,
|
|
198
|
+
mediaInline = _state$schema$nodes2.mediaInline,
|
|
199
|
+
mediaSingle = _state$schema$nodes2.mediaSingle;
|
|
200
|
+
if (!mediaLinkingState || mediaLinkingState.mediaPos === null) {
|
|
201
|
+
return;
|
|
202
|
+
}
|
|
203
|
+
var $pos = state.doc.resolve(mediaLinkingState.mediaPos);
|
|
204
|
+
var node = state.doc.nodeAt($pos.pos);
|
|
205
|
+
if (!node) {
|
|
206
|
+
return {};
|
|
207
|
+
}
|
|
208
|
+
if (allowInlineImages && node.type === mediaInline) {
|
|
209
|
+
return {
|
|
210
|
+
type: mediaInline.name,
|
|
211
|
+
mediaType: node.attrs.type
|
|
212
|
+
};
|
|
213
|
+
}
|
|
214
|
+
return {
|
|
215
|
+
type: mediaSingle.name,
|
|
216
|
+
mediaType: node.attrs.type
|
|
217
|
+
};
|
|
218
|
+
};
|
|
193
219
|
export var setUrlToMedia = function setUrlToMedia(url, inputMethod, editorAnalyticsAPI) {
|
|
194
220
|
return createMediaLinkingCommand({
|
|
195
221
|
type: MediaLinkingActionsTypes.setUrl,
|
|
@@ -199,18 +225,19 @@ export var setUrlToMedia = function setUrlToMedia(url, inputMethod, editorAnalyt
|
|
|
199
225
|
if (!action) {
|
|
200
226
|
return tr;
|
|
201
227
|
}
|
|
228
|
+
var nodeTypeAndMediaTypeAttrs = getNodeTypeAndMediaTypeAttributes(state);
|
|
202
229
|
try {
|
|
203
230
|
var toggleLinkMarkResult = toggleLinkMark(tr, state, {
|
|
204
231
|
url: url
|
|
205
232
|
});
|
|
206
|
-
fireAnalyticForMediaLink(tr, action, action === ACTION.ADDED ? {
|
|
233
|
+
fireAnalyticForMediaLink(tr, action, action === ACTION.ADDED ? _objectSpread({
|
|
207
234
|
inputMethod: inputMethod
|
|
208
|
-
} :
|
|
235
|
+
}, nodeTypeAndMediaTypeAttrs) : nodeTypeAndMediaTypeAttrs, editorAnalyticsAPI);
|
|
209
236
|
return toggleLinkMarkResult;
|
|
210
237
|
} catch (e) {
|
|
211
|
-
fireAnalyticForMediaLink(tr, ACTION.ERRORED, {
|
|
238
|
+
fireAnalyticForMediaLink(tr, ACTION.ERRORED, _objectSpread({
|
|
212
239
|
action: action
|
|
213
|
-
}, editorAnalyticsAPI);
|
|
240
|
+
}, nodeTypeAndMediaTypeAttrs), editorAnalyticsAPI);
|
|
214
241
|
throw e;
|
|
215
242
|
}
|
|
216
243
|
});
|
|
@@ -7,16 +7,23 @@ import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state
|
|
|
7
7
|
import { isNodeSelection, removeSelectedNode, safeInsert } from '@atlaskit/editor-prosemirror/utils';
|
|
8
8
|
import { findChangeFromLocation, getChangeMediaAnalytics, getMediaInputResizeAnalyticsEvent } from '../utils/analytics';
|
|
9
9
|
import { currentMediaInlineNodeWithPos, currentMediaNodeWithPos } from '../utils/current-media-node';
|
|
10
|
+
import { isSelectionMediaSingleNode } from '../utils/media-common';
|
|
10
11
|
import { changeFromMediaInlineToMediaSingleNode } from '../utils/media-single';
|
|
11
12
|
import { getSelectedMediaSingle, removeMediaGroupNode } from './utils';
|
|
12
13
|
export var DEFAULT_BORDER_COLOR = '#091e4224';
|
|
13
14
|
export var DEFAULT_BORDER_SIZE = 2;
|
|
15
|
+
var getNodeType = function getNodeType(state) {
|
|
16
|
+
var _state$schema$nodes = state.schema.nodes,
|
|
17
|
+
mediaSingle = _state$schema$nodes.mediaSingle,
|
|
18
|
+
mediaInline = _state$schema$nodes.mediaInline;
|
|
19
|
+
return isSelectionMediaSingleNode(state) ? mediaSingle.name : mediaInline.name;
|
|
20
|
+
};
|
|
14
21
|
export var changeInlineToMediaCard = function changeInlineToMediaCard(editorAnalyticsAPI) {
|
|
15
22
|
return function (state, dispatch) {
|
|
16
|
-
var _state$schema$
|
|
17
|
-
media = _state$schema$
|
|
18
|
-
mediaInline = _state$schema$
|
|
19
|
-
mediaGroup = _state$schema$
|
|
23
|
+
var _state$schema$nodes2 = state.schema.nodes,
|
|
24
|
+
media = _state$schema$nodes2.media,
|
|
25
|
+
mediaInline = _state$schema$nodes2.mediaInline,
|
|
26
|
+
mediaGroup = _state$schema$nodes2.mediaGroup;
|
|
20
27
|
var selectedNode = state.selection instanceof NodeSelection && state.selection.node.type === mediaInline && state.selection.node;
|
|
21
28
|
if (!selectedNode) {
|
|
22
29
|
return false;
|
|
@@ -52,10 +59,10 @@ export var changeInlineToMediaCard = function changeInlineToMediaCard(editorAnal
|
|
|
52
59
|
};
|
|
53
60
|
export var changeMediaCardToInline = function changeMediaCardToInline(editorAnalyticsAPI) {
|
|
54
61
|
return function (state, dispatch) {
|
|
55
|
-
var _state$schema$
|
|
56
|
-
media = _state$schema$
|
|
57
|
-
mediaInline = _state$schema$
|
|
58
|
-
paragraph = _state$schema$
|
|
62
|
+
var _state$schema$nodes3 = state.schema.nodes,
|
|
63
|
+
media = _state$schema$nodes3.media,
|
|
64
|
+
mediaInline = _state$schema$nodes3.mediaInline,
|
|
65
|
+
paragraph = _state$schema$nodes3.paragraph;
|
|
59
66
|
var selectedNode = state.selection instanceof NodeSelection && state.selection.node;
|
|
60
67
|
|
|
61
68
|
// @ts-ignore - [unblock prosemirror bump] redundant check comparing boolean to media
|
|
@@ -134,6 +141,7 @@ export var toggleBorderMark = function toggleBorderMark(editorAnalyticsAPI) {
|
|
|
134
141
|
}
|
|
135
142
|
}
|
|
136
143
|
if (dispatch) {
|
|
144
|
+
var type = getNodeType(state);
|
|
137
145
|
if (borderMark !== null && borderMark !== void 0 && borderMark.attrs) {
|
|
138
146
|
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
|
|
139
147
|
action: ACTION.DELETED,
|
|
@@ -141,8 +149,10 @@ export var toggleBorderMark = function toggleBorderMark(editorAnalyticsAPI) {
|
|
|
141
149
|
actionSubjectId: ACTION_SUBJECT_ID.BORDER,
|
|
142
150
|
eventType: EVENT_TYPE.TRACK,
|
|
143
151
|
attributes: {
|
|
152
|
+
type: type,
|
|
144
153
|
previousColor: borderMark.attrs.color,
|
|
145
|
-
previousSize: borderMark.attrs.size
|
|
154
|
+
previousSize: borderMark.attrs.size,
|
|
155
|
+
mediaType: node.attrs.type
|
|
146
156
|
}
|
|
147
157
|
})(tr);
|
|
148
158
|
} else {
|
|
@@ -152,8 +162,10 @@ export var toggleBorderMark = function toggleBorderMark(editorAnalyticsAPI) {
|
|
|
152
162
|
actionSubjectId: ACTION_SUBJECT_ID.BORDER,
|
|
153
163
|
eventType: EVENT_TYPE.TRACK,
|
|
154
164
|
attributes: {
|
|
165
|
+
type: type,
|
|
155
166
|
color: DEFAULT_BORDER_COLOR,
|
|
156
|
-
size: DEFAULT_BORDER_SIZE
|
|
167
|
+
size: DEFAULT_BORDER_SIZE,
|
|
168
|
+
mediaType: node.attrs.type
|
|
157
169
|
}
|
|
158
170
|
})(tr);
|
|
159
171
|
}
|
|
@@ -197,6 +209,8 @@ export var setBorderMark = function setBorderMark(editorAnalyticsAPI) {
|
|
|
197
209
|
actionSubjectId: ACTION_SUBJECT_ID.BORDER,
|
|
198
210
|
eventType: EVENT_TYPE.TRACK,
|
|
199
211
|
attributes: {
|
|
212
|
+
type: getNodeType(state),
|
|
213
|
+
mediaType: node.attrs.type,
|
|
200
214
|
previousColor: borderMark === null || borderMark === void 0 ? void 0 : borderMark.color,
|
|
201
215
|
previousSize: borderMark === null || borderMark === void 0 ? void 0 : borderMark.size,
|
|
202
216
|
newColor: color,
|
|
@@ -245,9 +259,9 @@ export var updateMediaSingleWidth = function updateMediaSingleWidth(editorAnalyt
|
|
|
245
259
|
export var changeMediaSingleToMediaInline = function changeMediaSingleToMediaInline(editorAnalyticsAPI) {
|
|
246
260
|
return function (state, dispatch) {
|
|
247
261
|
var selectedNodeWithPos = getSelectedMediaSingle(state);
|
|
248
|
-
var _state$schema$
|
|
249
|
-
mediaInline = _state$schema$
|
|
250
|
-
paragraph = _state$schema$
|
|
262
|
+
var _state$schema$nodes4 = state.schema.nodes,
|
|
263
|
+
mediaInline = _state$schema$nodes4.mediaInline,
|
|
264
|
+
paragraph = _state$schema$nodes4.paragraph;
|
|
251
265
|
if (!selectedNodeWithPos) {
|
|
252
266
|
return false;
|
|
253
267
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-media",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.4",
|
|
4
4
|
"description": "Media plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -34,10 +34,10 @@
|
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
36
|
"@atlaskit/adf-schema": "^35.3.0",
|
|
37
|
-
"@atlaskit/analytics-namespaced-context": "^6.
|
|
37
|
+
"@atlaskit/analytics-namespaced-context": "^6.9.0",
|
|
38
38
|
"@atlaskit/analytics-next": "^9.1.0",
|
|
39
39
|
"@atlaskit/button": "^17.2.0",
|
|
40
|
-
"@atlaskit/editor-common": "^76.
|
|
40
|
+
"@atlaskit/editor-common": "^76.36.0",
|
|
41
41
|
"@atlaskit/editor-palette": "1.5.2",
|
|
42
42
|
"@atlaskit/editor-plugin-analytics": "^0.4.0",
|
|
43
43
|
"@atlaskit/editor-plugin-decorations": "^0.2.0",
|