@atlaskit/editor-plugin-media-insert 2.8.0 → 2.8.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.
Files changed (11) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/cjs/plugin.js +34 -26
  3. package/dist/cjs/ui/MediaCard.js +2 -1
  4. package/dist/es2019/plugin.js +11 -4
  5. package/dist/es2019/ui/MediaCard.js +2 -1
  6. package/dist/esm/plugin.js +35 -27
  7. package/dist/esm/ui/MediaCard.js +2 -1
  8. package/dist/types/types.d.ts +4 -1
  9. package/dist/types-ts4.5/types.d.ts +4 -1
  10. package/package.json +4 -4
  11. package/.eslintrc.js +0 -14
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-media-insert
2
2
 
3
+ ## 2.8.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#143644](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/143644)
8
+ [`b5352e3195293`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b5352e3195293) -
9
+ [ux] [ED-24327] Integrate new media popup into toolbar and quick action
10
+ - Updated dependencies
11
+
3
12
  ## 2.8.0
4
13
 
5
14
  ### Minor Changes
package/dist/cjs/plugin.js CHANGED
@@ -40,16 +40,22 @@ var mediaInsertPlugin = exports.mediaInsertPlugin = function mediaInsertPlugin(_
40
40
  isOpen: isOpen
41
41
  };
42
42
  },
43
- contentComponent: function contentComponent(_ref3) {
44
- var editorView = _ref3.editorView,
45
- dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent,
46
- popupsMountPoint = _ref3.popupsMountPoint,
47
- popupsBoundariesElement = _ref3.popupsBoundariesElement,
48
- popupsScrollableElement = _ref3.popupsScrollableElement;
49
- var insertMediaSingle = function insertMediaSingle(_ref4) {
43
+ commands: {
44
+ showMediaInsertPopup: function showMediaInsertPopup(_ref3) {
45
+ var tr = _ref3.tr;
46
+ return (0, _actions.showMediaInsertPopup)(tr);
47
+ }
48
+ },
49
+ contentComponent: function contentComponent(_ref4) {
50
+ var editorView = _ref4.editorView,
51
+ dispatchAnalyticsEvent = _ref4.dispatchAnalyticsEvent,
52
+ popupsMountPoint = _ref4.popupsMountPoint,
53
+ popupsBoundariesElement = _ref4.popupsBoundariesElement,
54
+ popupsScrollableElement = _ref4.popupsScrollableElement;
55
+ var insertMediaSingle = function insertMediaSingle(_ref5) {
50
56
  var _api$media$actions$in;
51
- var mediaState = _ref4.mediaState,
52
- inputMethod = _ref4.inputMethod;
57
+ var mediaState = _ref5.mediaState,
58
+ inputMethod = _ref5.inputMethod;
53
59
  var id = mediaState.id,
54
60
  dimensions = mediaState.dimensions,
55
61
  contextId = mediaState.contextId,
@@ -57,12 +63,12 @@ var mediaInsertPlugin = exports.mediaInsertPlugin = function mediaInsertPlugin(_
57
63
  scaleFactor = _mediaState$scaleFact === void 0 ? 1 : _mediaState$scaleFact,
58
64
  fileName = mediaState.fileName,
59
65
  collection = mediaState.collection;
60
- var _ref5 = dimensions || {
66
+ var _ref6 = dimensions || {
61
67
  height: undefined,
62
68
  width: undefined
63
69
  },
64
- width = _ref5.width,
65
- height = _ref5.height;
70
+ width = _ref6.width,
71
+ height = _ref6.height;
66
72
  var scaledWidth = width && Math.round(width / scaleFactor);
67
73
  var node = editorView.state.schema.nodes.media.create({
68
74
  id: id,
@@ -76,11 +82,11 @@ var mediaInsertPlugin = exports.mediaInsertPlugin = function mediaInsertPlugin(_
76
82
  });
77
83
  return (_api$media$actions$in = api === null || api === void 0 ? void 0 : api.media.actions.insertMediaAsMediaSingle(editorView, node, inputMethod, isNestingInQuoteSupported)) !== null && _api$media$actions$in !== void 0 ? _api$media$actions$in : false;
78
84
  };
79
- var insertExternalMediaSingle = function insertExternalMediaSingle(_ref6) {
85
+ var insertExternalMediaSingle = function insertExternalMediaSingle(_ref7) {
80
86
  var _api$media$actions$in2;
81
- var url = _ref6.url,
82
- alt = _ref6.alt,
83
- inputMethod = _ref6.inputMethod;
87
+ var url = _ref7.url,
88
+ alt = _ref7.alt,
89
+ inputMethod = _ref7.inputMethod;
84
90
  var node = editorView.state.schema.nodes.media.create({
85
91
  type: 'external',
86
92
  url: url,
@@ -89,11 +95,11 @@ var mediaInsertPlugin = exports.mediaInsertPlugin = function mediaInsertPlugin(_
89
95
  });
90
96
  return (_api$media$actions$in2 = api === null || api === void 0 ? void 0 : api.media.actions.insertMediaAsMediaSingle(editorView, node, inputMethod, isNestingInQuoteSupported)) !== null && _api$media$actions$in2 !== void 0 ? _api$media$actions$in2 : false;
91
97
  };
92
- var insertFile = function insertFile(_ref7) {
98
+ var insertFile = function insertFile(_ref8) {
93
99
  var _api$media$sharedStat, _api$media$sharedStat2;
94
- var mediaState = _ref7.mediaState,
95
- inputMethod = _ref7.inputMethod,
96
- onMediaStateChanged = _ref7.onMediaStateChanged;
100
+ var mediaState = _ref8.mediaState,
101
+ inputMethod = _ref8.inputMethod,
102
+ onMediaStateChanged = _ref8.onMediaStateChanged;
97
103
  var collection = mediaState.collection;
98
104
  return collection !== undefined ? (_api$media$sharedStat = api === null || api === void 0 || (_api$media$sharedStat2 = api.media.sharedState.currentState()) === null || _api$media$sharedStat2 === void 0 ? void 0 : _api$media$sharedStat2.insertFile(mediaState, onMediaStateChanged, inputMethod)) !== null && _api$media$sharedStat !== void 0 ? _api$media$sharedStat : false : false;
99
105
  };
@@ -113,14 +119,14 @@ var mediaInsertPlugin = exports.mediaInsertPlugin = function mediaInsertPlugin(_
113
119
  });
114
120
  },
115
121
  pluginsOptions: {
116
- quickInsert: function quickInsert(_ref8) {
117
- var formatMessage = _ref8.formatMessage;
122
+ quickInsert: function quickInsert(_ref9) {
123
+ var formatMessage = _ref9.formatMessage;
118
124
  return [{
119
125
  id: 'media-insert',
120
- title: formatMessage(_messages.toolbarInsertBlockMessages.insertMediaFromUrl),
121
- description: formatMessage(_messages.toolbarInsertBlockMessages.insertMediaFromUrlDescription),
126
+ title: formatMessage(_messages.toolbarInsertBlockMessages.mediaFiles),
127
+ description: formatMessage(_messages.toolbarInsertBlockMessages.mediaFilesDescription),
122
128
  priority: 400,
123
- keywords: ['attachment', 'gif', 'media', 'picture', 'image', 'video'],
129
+ keywords: ['attachment', 'gif', 'media', 'picture', 'image', 'video', 'file'],
124
130
  icon: function icon() {
125
131
  return /*#__PURE__*/_react.default.createElement(_quickInsert.IconImages, null);
126
132
  },
@@ -129,7 +135,9 @@ var mediaInsertPlugin = exports.mediaInsertPlugin = function mediaInsertPlugin(_
129
135
  // Insert empty string to remove the typeahead raw text
130
136
  // close the quick insert immediately
131
137
  var tr = insert('');
132
- (0, _actions.showMediaInsertPopup)(tr);
138
+ api === null || api === void 0 || api.mediaInsert.commands.showMediaInsertPopup({
139
+ tr: tr
140
+ });
133
141
  api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || (_api$analytics = _api$analytics.actions) === null || _api$analytics === void 0 || _api$analytics.attachAnalyticsEvent({
134
142
  action: _analytics.ACTION.OPENED,
135
143
  actionSubject: _analytics.ACTION_SUBJECT.PICKER,
package/dist/cjs/ui/MediaCard.js CHANGED
@@ -42,6 +42,7 @@ var MediaCard = exports.MediaCard = function MediaCard(_ref) {
42
42
  dimensions: maxDimensions,
43
43
  originalDimensions: dimensions,
44
44
  identifier: identifier,
45
- alt: mediaAlt
45
+ alt: mediaAlt,
46
+ disableOverlay: true
46
47
  });
47
48
  };
package/dist/es2019/plugin.js CHANGED
@@ -33,6 +33,11 @@ export const mediaInsertPlugin = ({
33
33
  isOpen
34
34
  };
35
35
  },
36
+ commands: {
37
+ showMediaInsertPopup: ({
38
+ tr
39
+ }) => showMediaInsertPopup(tr)
40
+ },
36
41
  contentComponent: ({
37
42
  editorView,
38
43
  dispatchAnalyticsEvent,
@@ -114,17 +119,19 @@ export const mediaInsertPlugin = ({
114
119
  formatMessage
115
120
  }) => [{
116
121
  id: 'media-insert',
117
- title: formatMessage(messages.insertMediaFromUrl),
118
- description: formatMessage(messages.insertMediaFromUrlDescription),
122
+ title: formatMessage(messages.mediaFiles),
123
+ description: formatMessage(messages.mediaFilesDescription),
119
124
  priority: 400,
120
- keywords: ['attachment', 'gif', 'media', 'picture', 'image', 'video'],
125
+ keywords: ['attachment', 'gif', 'media', 'picture', 'image', 'video', 'file'],
121
126
  icon: () => /*#__PURE__*/React.createElement(IconImages, null),
122
127
  action(insert) {
123
128
  var _api$analytics, _api$analytics$action;
124
129
  // Insert empty string to remove the typeahead raw text
125
130
  // close the quick insert immediately
126
131
  const tr = insert('');
127
- showMediaInsertPopup(tr);
132
+ api === null || api === void 0 ? void 0 : api.mediaInsert.commands.showMediaInsertPopup({
133
+ tr
134
+ });
128
135
  api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : (_api$analytics$action = _api$analytics.actions) === null || _api$analytics$action === void 0 ? void 0 : _api$analytics$action.attachAnalyticsEvent({
129
136
  action: ACTION.OPENED,
130
137
  actionSubject: ACTION_SUBJECT.PICKER,
package/dist/es2019/ui/MediaCard.js CHANGED
@@ -34,6 +34,7 @@ export const MediaCard = ({
34
34
  dimensions: maxDimensions,
35
35
  originalDimensions: dimensions,
36
36
  identifier: identifier,
37
- alt: mediaAlt
37
+ alt: mediaAlt,
38
+ disableOverlay: true
38
39
  });
39
40
  };
package/dist/esm/plugin.js CHANGED
@@ -3,7 +3,7 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } f
3
3
  import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
4
4
  import { IconImages } from '@atlaskit/editor-common/quick-insert';
5
5
  import { fg } from '@atlaskit/platform-feature-flags';
6
- import { closeMediaInsertPicker as _closeMediaInsertPicker, showMediaInsertPopup } from './actions';
6
+ import { closeMediaInsertPicker as _closeMediaInsertPicker, showMediaInsertPopup as _showMediaInsertPopup } from './actions';
7
7
  import { createPlugin } from './pm-plugins/main';
8
8
  import { pluginKey } from './pm-plugins/plugin-key';
9
9
  import { MediaInsertPicker } from './ui/MediaInsertPicker';
@@ -33,16 +33,22 @@ export var mediaInsertPlugin = function mediaInsertPlugin(_ref) {
33
33
  isOpen: isOpen
34
34
  };
35
35
  },
36
- contentComponent: function contentComponent(_ref3) {
37
- var editorView = _ref3.editorView,
38
- dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent,
39
- popupsMountPoint = _ref3.popupsMountPoint,
40
- popupsBoundariesElement = _ref3.popupsBoundariesElement,
41
- popupsScrollableElement = _ref3.popupsScrollableElement;
42
- var insertMediaSingle = function insertMediaSingle(_ref4) {
36
+ commands: {
37
+ showMediaInsertPopup: function showMediaInsertPopup(_ref3) {
38
+ var tr = _ref3.tr;
39
+ return _showMediaInsertPopup(tr);
40
+ }
41
+ },
42
+ contentComponent: function contentComponent(_ref4) {
43
+ var editorView = _ref4.editorView,
44
+ dispatchAnalyticsEvent = _ref4.dispatchAnalyticsEvent,
45
+ popupsMountPoint = _ref4.popupsMountPoint,
46
+ popupsBoundariesElement = _ref4.popupsBoundariesElement,
47
+ popupsScrollableElement = _ref4.popupsScrollableElement;
48
+ var insertMediaSingle = function insertMediaSingle(_ref5) {
43
49
  var _api$media$actions$in;
44
- var mediaState = _ref4.mediaState,
45
- inputMethod = _ref4.inputMethod;
50
+ var mediaState = _ref5.mediaState,
51
+ inputMethod = _ref5.inputMethod;
46
52
  var id = mediaState.id,
47
53
  dimensions = mediaState.dimensions,
48
54
  contextId = mediaState.contextId,
@@ -50,12 +56,12 @@ export var mediaInsertPlugin = function mediaInsertPlugin(_ref) {
50
56
  scaleFactor = _mediaState$scaleFact === void 0 ? 1 : _mediaState$scaleFact,
51
57
  fileName = mediaState.fileName,
52
58
  collection = mediaState.collection;
53
- var _ref5 = dimensions || {
59
+ var _ref6 = dimensions || {
54
60
  height: undefined,
55
61
  width: undefined
56
62
  },
57
- width = _ref5.width,
58
- height = _ref5.height;
63
+ width = _ref6.width,
64
+ height = _ref6.height;
59
65
  var scaledWidth = width && Math.round(width / scaleFactor);
60
66
  var node = editorView.state.schema.nodes.media.create({
61
67
  id: id,
@@ -69,11 +75,11 @@ export var mediaInsertPlugin = function mediaInsertPlugin(_ref) {
69
75
  });
70
76
  return (_api$media$actions$in = api === null || api === void 0 ? void 0 : api.media.actions.insertMediaAsMediaSingle(editorView, node, inputMethod, isNestingInQuoteSupported)) !== null && _api$media$actions$in !== void 0 ? _api$media$actions$in : false;
71
77
  };
72
- var insertExternalMediaSingle = function insertExternalMediaSingle(_ref6) {
78
+ var insertExternalMediaSingle = function insertExternalMediaSingle(_ref7) {
73
79
  var _api$media$actions$in2;
74
- var url = _ref6.url,
75
- alt = _ref6.alt,
76
- inputMethod = _ref6.inputMethod;
80
+ var url = _ref7.url,
81
+ alt = _ref7.alt,
82
+ inputMethod = _ref7.inputMethod;
77
83
  var node = editorView.state.schema.nodes.media.create({
78
84
  type: 'external',
79
85
  url: url,
@@ -82,11 +88,11 @@ export var mediaInsertPlugin = function mediaInsertPlugin(_ref) {
82
88
  });
83
89
  return (_api$media$actions$in2 = api === null || api === void 0 ? void 0 : api.media.actions.insertMediaAsMediaSingle(editorView, node, inputMethod, isNestingInQuoteSupported)) !== null && _api$media$actions$in2 !== void 0 ? _api$media$actions$in2 : false;
84
90
  };
85
- var insertFile = function insertFile(_ref7) {
91
+ var insertFile = function insertFile(_ref8) {
86
92
  var _api$media$sharedStat, _api$media$sharedStat2;
87
- var mediaState = _ref7.mediaState,
88
- inputMethod = _ref7.inputMethod,
89
- onMediaStateChanged = _ref7.onMediaStateChanged;
93
+ var mediaState = _ref8.mediaState,
94
+ inputMethod = _ref8.inputMethod,
95
+ onMediaStateChanged = _ref8.onMediaStateChanged;
90
96
  var collection = mediaState.collection;
91
97
  return collection !== undefined ? (_api$media$sharedStat = api === null || api === void 0 || (_api$media$sharedStat2 = api.media.sharedState.currentState()) === null || _api$media$sharedStat2 === void 0 ? void 0 : _api$media$sharedStat2.insertFile(mediaState, onMediaStateChanged, inputMethod)) !== null && _api$media$sharedStat !== void 0 ? _api$media$sharedStat : false : false;
92
98
  };
@@ -106,14 +112,14 @@ export var mediaInsertPlugin = function mediaInsertPlugin(_ref) {
106
112
  });
107
113
  },
108
114
  pluginsOptions: {
109
- quickInsert: function quickInsert(_ref8) {
110
- var formatMessage = _ref8.formatMessage;
115
+ quickInsert: function quickInsert(_ref9) {
116
+ var formatMessage = _ref9.formatMessage;
111
117
  return [{
112
118
  id: 'media-insert',
113
- title: formatMessage(messages.insertMediaFromUrl),
114
- description: formatMessage(messages.insertMediaFromUrlDescription),
119
+ title: formatMessage(messages.mediaFiles),
120
+ description: formatMessage(messages.mediaFilesDescription),
115
121
  priority: 400,
116
- keywords: ['attachment', 'gif', 'media', 'picture', 'image', 'video'],
122
+ keywords: ['attachment', 'gif', 'media', 'picture', 'image', 'video', 'file'],
117
123
  icon: function icon() {
118
124
  return /*#__PURE__*/React.createElement(IconImages, null);
119
125
  },
@@ -122,7 +128,9 @@ export var mediaInsertPlugin = function mediaInsertPlugin(_ref) {
122
128
  // Insert empty string to remove the typeahead raw text
123
129
  // close the quick insert immediately
124
130
  var tr = insert('');
125
- showMediaInsertPopup(tr);
131
+ api === null || api === void 0 || api.mediaInsert.commands.showMediaInsertPopup({
132
+ tr: tr
133
+ });
126
134
  api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || (_api$analytics = _api$analytics.actions) === null || _api$analytics === void 0 || _api$analytics.attachAnalyticsEvent({
127
135
  action: ACTION.OPENED,
128
136
  actionSubject: ACTION_SUBJECT.PICKER,
package/dist/esm/ui/MediaCard.js CHANGED
@@ -35,6 +35,7 @@ export var MediaCard = function MediaCard(_ref) {
35
35
  dimensions: maxDimensions,
36
36
  originalDimensions: dimensions,
37
37
  identifier: identifier,
38
- alt: mediaAlt
38
+ alt: mediaAlt,
39
+ disableOverlay: true
39
40
  });
40
41
  };
package/dist/types/types.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { InputMethodInsertMedia } from '@atlaskit/editor-common/analytics';
2
2
  import type { Providers } from '@atlaskit/editor-common/provider-factory';
3
- import type { NextEditorPlugin, OptionalPlugin, UiComponentFactoryParams } from '@atlaskit/editor-common/types';
3
+ import type { EditorCommand, NextEditorPlugin, OptionalPlugin, UiComponentFactoryParams } from '@atlaskit/editor-common/types';
4
4
  import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
5
5
  import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
6
6
  import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
@@ -20,6 +20,9 @@ export type MediaInsertPlugin = NextEditorPlugin<'mediaInsert', {
20
20
  OptionalPlugin<FeatureFlagsPlugin>
21
21
  ];
22
22
  sharedState: MediaInsertPluginState;
23
+ commands: {
24
+ showMediaInsertPopup: EditorCommand;
25
+ };
23
26
  }>;
24
27
  export type InsertExternalMediaSingle = (props: {
25
28
  url: string;
package/dist/types-ts4.5/types.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { InputMethodInsertMedia } from '@atlaskit/editor-common/analytics';
2
2
  import type { Providers } from '@atlaskit/editor-common/provider-factory';
3
- import type { NextEditorPlugin, OptionalPlugin, UiComponentFactoryParams } from '@atlaskit/editor-common/types';
3
+ import type { EditorCommand, NextEditorPlugin, OptionalPlugin, UiComponentFactoryParams } from '@atlaskit/editor-common/types';
4
4
  import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
5
5
  import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
6
6
  import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
@@ -20,6 +20,9 @@ export type MediaInsertPlugin = NextEditorPlugin<'mediaInsert', {
20
20
  OptionalPlugin<FeatureFlagsPlugin>
21
21
  ];
22
22
  sharedState: MediaInsertPluginState;
23
+ commands: {
24
+ showMediaInsertPopup: EditorCommand;
25
+ };
23
26
  }>;
24
27
  export type InsertExternalMediaSingle = (props: {
25
28
  url: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-media-insert",
3
- "version": "2.8.0",
3
+ "version": "2.8.1",
4
4
  "description": "Media Insert plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -25,9 +25,9 @@
25
25
  "dependencies": {
26
26
  "@atlaskit/adf-schema": "^40.9.0",
27
27
  "@atlaskit/button": "^20.1.0",
28
- "@atlaskit/editor-common": "^90.0.0",
28
+ "@atlaskit/editor-common": "^90.2.0",
29
29
  "@atlaskit/editor-plugin-analytics": "^1.8.0",
30
- "@atlaskit/editor-plugin-media": "^1.31.0",
30
+ "@atlaskit/editor-plugin-media": "^1.32.0",
31
31
  "@atlaskit/editor-prosemirror": "6.0.0",
32
32
  "@atlaskit/editor-shared-styles": "^2.13.0",
33
33
  "@atlaskit/form": "^10.5.3",
@@ -37,7 +37,7 @@
37
37
  "@atlaskit/media-client-react": "^2.2.0",
38
38
  "@atlaskit/media-picker": "^66.7.0",
39
39
  "@atlaskit/platform-feature-flags": "^0.3.0",
40
- "@atlaskit/primitives": "^12.1.0",
40
+ "@atlaskit/primitives": "^12.2.0",
41
41
  "@atlaskit/section-message": "^6.6.0",
42
42
  "@atlaskit/tabs": "^16.4.0",
43
43
  "@atlaskit/textfield": "^6.5.0",
package/.eslintrc.js DELETED
@@ -1,14 +0,0 @@
1
- module.exports = {
2
- rules: {
3
- '@typescript-eslint/no-duplicate-imports': 'error',
4
- '@typescript-eslint/no-explicit-any': 'error',
5
- },
6
- overrides: [
7
- {
8
- files: ['**/__tests__/**/*.{js,ts,tsx}', '**/examples/**/*.{js,ts,tsx}'],
9
- rules: {
10
- '@typescript-eslint/no-explicit-any': 'off',
11
- },
12
- },
13
- ],
14
- };