@atlaskit/editor-plugin-media 1.9.4 → 1.10.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.
Files changed (5) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/cjs/toolbar/filePreviewItem.js +30 -28
  3. package/dist/es2019/toolbar/filePreviewItem.js +29 -26
  4. package/dist/esm/toolbar/filePreviewItem.js +30 -28
  5. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,21 @@
1
1
  # @atlaskit/editor-plugin-media
2
2
 
3
+ ## 1.10.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#82250](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/82250) [`5d7f76f71b82`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5d7f76f71b82) - Stop media viewer from closing when clicking on image
8
+
9
+ ### Patch Changes
10
+
11
+ - Updated dependencies
12
+
13
+ ## 1.9.5
14
+
15
+ ### Patch Changes
16
+
17
+ - Updated dependencies
18
+
3
19
  ## 1.9.4
4
20
 
5
21
  ### Patch Changes
package/dist/cjs/toolbar/filePreviewItem.js CHANGED
@@ -16,9 +16,29 @@ var _mediaViewer = require("@atlaskit/media-viewer");
16
16
  var _utils = require("./utils");
17
17
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
18
18
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
19
- var FilePreviewItem = exports.FilePreviewItem = function FilePreviewItem(_ref) {
20
- var mediaPluginState = _ref.mediaPluginState,
21
- intl = _ref.intl;
19
+ var RenderMediaViewer = function RenderMediaViewer(_ref) {
20
+ var mediaClientConfig = _ref.mediaClientConfig,
21
+ onClose = _ref.onClose,
22
+ selectedNodeAttrs = _ref.selectedNodeAttrs;
23
+ var id = selectedNodeAttrs.id,
24
+ _selectedNodeAttrs$co = selectedNodeAttrs.collection,
25
+ collection = _selectedNodeAttrs$co === void 0 ? '' : _selectedNodeAttrs$co;
26
+ var identifier = {
27
+ id: id,
28
+ mediaItemType: 'file',
29
+ collectionName: collection
30
+ };
31
+ return /*#__PURE__*/_reactDom.default.createPortal( /*#__PURE__*/_react.default.createElement(_mediaViewer.MediaViewer, {
32
+ collectionName: collection,
33
+ items: [],
34
+ mediaClientConfig: mediaClientConfig,
35
+ selectedItem: identifier,
36
+ onClose: onClose
37
+ }), document.body);
38
+ };
39
+ var FilePreviewItem = exports.FilePreviewItem = function FilePreviewItem(_ref2) {
40
+ var mediaPluginState = _ref2.mediaPluginState,
41
+ intl = _ref2.intl;
22
42
  var _useState = (0, _react.useState)(false),
23
43
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
24
44
  isMediaViewerVisible = _useState2[0],
@@ -29,30 +49,8 @@ var FilePreviewItem = exports.FilePreviewItem = function FilePreviewItem(_ref) {
29
49
  var onMediaViewerClose = function onMediaViewerClose() {
30
50
  setMediaViewerVisible(false);
31
51
  };
32
- var renderMediaViewer = function renderMediaViewer() {
33
- if (isMediaViewerVisible) {
34
- var selectedNodeAttrs = (0, _utils.getSelectedNearestMediaContainerNodeAttrs)(mediaPluginState);
35
- if (selectedNodeAttrs && mediaPluginState.mediaClientConfig) {
36
- var id = selectedNodeAttrs.id,
37
- _selectedNodeAttrs$co = selectedNodeAttrs.collection,
38
- collection = _selectedNodeAttrs$co === void 0 ? '' : _selectedNodeAttrs$co;
39
- var identifier = {
40
- id: id,
41
- mediaItemType: 'file',
42
- collectionName: collection
43
- };
44
- return /*#__PURE__*/_reactDom.default.createPortal( /*#__PURE__*/_react.default.createElement(_mediaViewer.MediaViewer, {
45
- collectionName: collection,
46
- items: [],
47
- mediaClientConfig: mediaPluginState.mediaClientConfig,
48
- selectedItem: identifier,
49
- onClose: onMediaViewerClose
50
- }), document.body);
51
- }
52
- }
53
- return null;
54
- };
55
- var mediaViewer = renderMediaViewer();
52
+ var selectedNodeAttrs = (0, _utils.getSelectedNearestMediaContainerNodeAttrs)(mediaPluginState);
53
+ var shouldRenderMediaViewer = selectedNodeAttrs && mediaPluginState.mediaClientConfig && isMediaViewerVisible;
56
54
  var tooltipContent = intl.formatMessage(_mediaUi.messages.preview);
57
55
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ui.FloatingToolbarButton, {
58
56
  testId: "file-preview-toolbar-button",
@@ -62,5 +60,9 @@ var FilePreviewItem = exports.FilePreviewItem = function FilePreviewItem(_ref) {
62
60
  label: "file preview"
63
61
  }),
64
62
  tooltipContent: tooltipContent
65
- }), mediaViewer);
63
+ }), shouldRenderMediaViewer && /*#__PURE__*/_react.default.createElement(RenderMediaViewer, {
64
+ mediaClientConfig: mediaPluginState.mediaClientConfig,
65
+ onClose: onMediaViewerClose,
66
+ selectedNodeAttrs: selectedNodeAttrs
67
+ }));
66
68
  };
package/dist/es2019/toolbar/filePreviewItem.js CHANGED
@@ -5,6 +5,28 @@ import FilePreviewIcon from '@atlaskit/icon/glyph/editor/file-preview';
5
5
  import { messages } from '@atlaskit/media-ui';
6
6
  import { MediaViewer } from '@atlaskit/media-viewer';
7
7
  import { getSelectedNearestMediaContainerNodeAttrs } from './utils';
8
+ const RenderMediaViewer = ({
9
+ mediaClientConfig,
10
+ onClose,
11
+ selectedNodeAttrs
12
+ }) => {
13
+ const {
14
+ id,
15
+ collection = ''
16
+ } = selectedNodeAttrs;
17
+ const identifier = {
18
+ id,
19
+ mediaItemType: 'file',
20
+ collectionName: collection
21
+ };
22
+ return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(MediaViewer, {
23
+ collectionName: collection,
24
+ items: [],
25
+ mediaClientConfig: mediaClientConfig,
26
+ selectedItem: identifier,
27
+ onClose: onClose
28
+ }), document.body);
29
+ };
8
30
  export const FilePreviewItem = ({
9
31
  mediaPluginState,
10
32
  intl
@@ -16,31 +38,8 @@ export const FilePreviewItem = ({
16
38
  const onMediaViewerClose = () => {
17
39
  setMediaViewerVisible(false);
18
40
  };
19
- const renderMediaViewer = () => {
20
- if (isMediaViewerVisible) {
21
- const selectedNodeAttrs = getSelectedNearestMediaContainerNodeAttrs(mediaPluginState);
22
- if (selectedNodeAttrs && mediaPluginState.mediaClientConfig) {
23
- const {
24
- id,
25
- collection = ''
26
- } = selectedNodeAttrs;
27
- const identifier = {
28
- id,
29
- mediaItemType: 'file',
30
- collectionName: collection
31
- };
32
- return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(MediaViewer, {
33
- collectionName: collection,
34
- items: [],
35
- mediaClientConfig: mediaPluginState.mediaClientConfig,
36
- selectedItem: identifier,
37
- onClose: onMediaViewerClose
38
- }), document.body);
39
- }
40
- }
41
- return null;
42
- };
43
- const mediaViewer = renderMediaViewer();
41
+ const selectedNodeAttrs = getSelectedNearestMediaContainerNodeAttrs(mediaPluginState);
42
+ const shouldRenderMediaViewer = selectedNodeAttrs && mediaPluginState.mediaClientConfig && isMediaViewerVisible;
44
43
  const tooltipContent = intl.formatMessage(messages.preview);
45
44
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ToolbarButton, {
46
45
  testId: "file-preview-toolbar-button",
@@ -50,5 +49,9 @@ export const FilePreviewItem = ({
50
49
  label: "file preview"
51
50
  }),
52
51
  tooltipContent: tooltipContent
53
- }), mediaViewer);
52
+ }), shouldRenderMediaViewer && /*#__PURE__*/React.createElement(RenderMediaViewer, {
53
+ mediaClientConfig: mediaPluginState.mediaClientConfig,
54
+ onClose: onMediaViewerClose,
55
+ selectedNodeAttrs: selectedNodeAttrs
56
+ }));
54
57
  };
package/dist/esm/toolbar/filePreviewItem.js CHANGED
@@ -6,9 +6,29 @@ import FilePreviewIcon from '@atlaskit/icon/glyph/editor/file-preview';
6
6
  import { messages } from '@atlaskit/media-ui';
7
7
  import { MediaViewer } from '@atlaskit/media-viewer';
8
8
  import { getSelectedNearestMediaContainerNodeAttrs } from './utils';
9
- export var FilePreviewItem = function FilePreviewItem(_ref) {
10
- var mediaPluginState = _ref.mediaPluginState,
11
- intl = _ref.intl;
9
+ var RenderMediaViewer = function RenderMediaViewer(_ref) {
10
+ var mediaClientConfig = _ref.mediaClientConfig,
11
+ onClose = _ref.onClose,
12
+ selectedNodeAttrs = _ref.selectedNodeAttrs;
13
+ var id = selectedNodeAttrs.id,
14
+ _selectedNodeAttrs$co = selectedNodeAttrs.collection,
15
+ collection = _selectedNodeAttrs$co === void 0 ? '' : _selectedNodeAttrs$co;
16
+ var identifier = {
17
+ id: id,
18
+ mediaItemType: 'file',
19
+ collectionName: collection
20
+ };
21
+ return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(MediaViewer, {
22
+ collectionName: collection,
23
+ items: [],
24
+ mediaClientConfig: mediaClientConfig,
25
+ selectedItem: identifier,
26
+ onClose: onClose
27
+ }), document.body);
28
+ };
29
+ export var FilePreviewItem = function FilePreviewItem(_ref2) {
30
+ var mediaPluginState = _ref2.mediaPluginState,
31
+ intl = _ref2.intl;
12
32
  var _useState = useState(false),
13
33
  _useState2 = _slicedToArray(_useState, 2),
14
34
  isMediaViewerVisible = _useState2[0],
@@ -19,30 +39,8 @@ export var FilePreviewItem = function FilePreviewItem(_ref) {
19
39
  var onMediaViewerClose = function onMediaViewerClose() {
20
40
  setMediaViewerVisible(false);
21
41
  };
22
- var renderMediaViewer = function renderMediaViewer() {
23
- if (isMediaViewerVisible) {
24
- var selectedNodeAttrs = getSelectedNearestMediaContainerNodeAttrs(mediaPluginState);
25
- if (selectedNodeAttrs && mediaPluginState.mediaClientConfig) {
26
- var id = selectedNodeAttrs.id,
27
- _selectedNodeAttrs$co = selectedNodeAttrs.collection,
28
- collection = _selectedNodeAttrs$co === void 0 ? '' : _selectedNodeAttrs$co;
29
- var identifier = {
30
- id: id,
31
- mediaItemType: 'file',
32
- collectionName: collection
33
- };
34
- return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(MediaViewer, {
35
- collectionName: collection,
36
- items: [],
37
- mediaClientConfig: mediaPluginState.mediaClientConfig,
38
- selectedItem: identifier,
39
- onClose: onMediaViewerClose
40
- }), document.body);
41
- }
42
- }
43
- return null;
44
- };
45
- var mediaViewer = renderMediaViewer();
42
+ var selectedNodeAttrs = getSelectedNearestMediaContainerNodeAttrs(mediaPluginState);
43
+ var shouldRenderMediaViewer = selectedNodeAttrs && mediaPluginState.mediaClientConfig && isMediaViewerVisible;
46
44
  var tooltipContent = intl.formatMessage(messages.preview);
47
45
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ToolbarButton, {
48
46
  testId: "file-preview-toolbar-button",
@@ -52,5 +50,9 @@ export var FilePreviewItem = function FilePreviewItem(_ref) {
52
50
  label: "file preview"
53
51
  }),
54
52
  tooltipContent: tooltipContent
55
- }), mediaViewer);
53
+ }), shouldRenderMediaViewer && /*#__PURE__*/React.createElement(RenderMediaViewer, {
54
+ mediaClientConfig: mediaPluginState.mediaClientConfig,
55
+ onClose: onMediaViewerClose,
56
+ selectedNodeAttrs: selectedNodeAttrs
57
+ }));
56
58
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-media",
3
- "version": "1.9.4",
3
+ "version": "1.10.0",
4
4
  "description": "Media plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -61,9 +61,9 @@
61
61
  "@atlaskit/media-filmstrip": "^47.0.0",
62
62
  "@atlaskit/media-picker": "^66.3.0",
63
63
  "@atlaskit/media-ui": "^25.4.0",
64
- "@atlaskit/media-viewer": "^48.3.0",
64
+ "@atlaskit/media-viewer": "^48.4.0",
65
65
  "@atlaskit/platform-feature-flags": "^0.2.0",
66
- "@atlaskit/primitives": "^4.1.0",
66
+ "@atlaskit/primitives": "^5.0.0",
67
67
  "@atlaskit/textfield": "^6.1.0",
68
68
  "@atlaskit/theme": "^12.6.0",
69
69
  "@atlaskit/tokens": "^1.41.0",