@atlaskit/editor-plugin-media 1.14.4 → 1.15.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 (5) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/ui/CommentBadge/index.js +25 -2
  3. package/dist/es2019/ui/CommentBadge/index.js +13 -3
  4. package/dist/esm/ui/CommentBadge/index.js +25 -3
  5. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/editor-plugin-media
2
2
 
3
+ ## 1.15.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#91420](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/91420) [`6d0d6452a5a0`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/6d0d6452a5a0) - [ED-23025] Check for undefined annotations to avoid exceptions in embedded editor
8
+
9
+ ## 1.15.0
10
+
11
+ ### Minor Changes
12
+
13
+ - [#90742](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/90742) [`f893b885cc0a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f893b885cc0a) - [ux] Add comment on media badge states
14
+
15
+ ### Patch Changes
16
+
17
+ - [#91106](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/91106) [`b6ffa30186b9`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b6ffa30186b9) - Bump ADF-schema package to version 35.0.0
18
+ - Updated dependencies
19
+
3
20
  ## 1.14.4
4
21
 
5
22
  ### Patch Changes
package/dist/cjs/ui/CommentBadge/index.js CHANGED
@@ -1,10 +1,12 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
3
4
  var _typeof = require("@babel/runtime/helpers/typeof");
4
5
  Object.defineProperty(exports, "__esModule", {
5
6
  value: true
6
7
  });
7
8
  exports.CommentBadge = void 0;
9
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
8
10
  var _react = _interopRequireWildcard(require("react"));
9
11
  var _reactIntlNext = require("react-intl-next");
10
12
  var _hooks = require("@atlaskit/editor-common/hooks");
@@ -17,6 +19,10 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
17
19
  view = _ref.view,
18
20
  getPos = _ref.getPos,
19
21
  intl = _ref.intl;
22
+ var _useState = (0, _react.useState)(false),
23
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
24
+ entered = _useState2[0],
25
+ setEntered = _useState2[1];
20
26
  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['annotation']),
21
27
  annotationState = _useSharedPluginState.annotationState;
22
28
  var _view$state$schema = view.state.schema,
@@ -24,6 +30,16 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
24
30
  annotation = _view$state$schema.marks.annotation,
25
31
  state = view.state,
26
32
  dispatch = view.dispatch;
33
+ var status = (0, _react.useMemo)(function () {
34
+ if (!annotationState || !mediaNode) {
35
+ return 'default';
36
+ }
37
+ return annotationState.selectedAnnotations.some(function (annotation) {
38
+ return !!mediaNode.marks.find(function (mark) {
39
+ return mark.attrs.id === annotation.id;
40
+ });
41
+ }) && !annotationState.isInlineCommentViewClosed ? 'active' : 'default';
42
+ }, [annotationState, mediaNode]);
27
43
  var onClick = (0, _react.useCallback)(function () {
28
44
  if (api.annotation && mediaNode) {
29
45
  var showCommentForBlockNode = api.annotation.actions.showCommentForBlockNode;
@@ -31,7 +47,7 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
31
47
  }
32
48
  }, [api.annotation, dispatch, mediaNode, state]);
33
49
  var pos = getPos();
34
- if (!Number.isFinite(pos) || !annotationState || !mediaNode || mediaNode.type !== media || mediaNode.marks.every(function (maybeAnnotation) {
50
+ if (!Number.isFinite(pos) || !(annotationState !== null && annotationState !== void 0 && annotationState.annotations) || !mediaNode || mediaNode.type !== media || mediaNode.marks.every(function (maybeAnnotation) {
35
51
  return maybeAnnotation.type !== annotation || !(maybeAnnotation.attrs.id in annotationState.annotations) || annotationState.annotations[maybeAnnotation.attrs.id];
36
52
  })) {
37
53
  return null;
@@ -43,7 +59,14 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
43
59
  onClick: onClick,
44
60
  mediaElement: mediaElement,
45
61
  intl: intl,
46
- isEditor: true
62
+ isEditor: true,
63
+ status: entered ? 'entered' : status,
64
+ onMouseEnter: function onMouseEnter() {
65
+ return setEntered(true);
66
+ },
67
+ onMouseLeave: function onMouseLeave() {
68
+ return setEntered(false);
69
+ }
47
70
  });
48
71
  };
49
72
  var CommentBadge = exports.CommentBadge = (0, _reactIntlNext.injectIntl)(CommentBadgeWrapper);
package/dist/es2019/ui/CommentBadge/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import React, { useCallback } from 'react';
1
+ import React, { useCallback, useMemo, useState } from 'react';
2
2
  import { injectIntl } from 'react-intl-next';
3
3
  import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
4
4
  import { CommentBadge as CommentBadgeComponent } from '@atlaskit/editor-common/media-single';
@@ -9,6 +9,7 @@ const CommentBadgeWrapper = ({
9
9
  getPos,
10
10
  intl
11
11
  }) => {
12
+ const [entered, setEntered] = useState(false);
12
13
  const {
13
14
  annotationState
14
15
  } = useSharedPluginState(api, ['annotation']);
@@ -26,6 +27,12 @@ const CommentBadgeWrapper = ({
26
27
  state,
27
28
  dispatch
28
29
  } = view;
30
+ const status = useMemo(() => {
31
+ if (!annotationState || !mediaNode) {
32
+ return 'default';
33
+ }
34
+ return annotationState.selectedAnnotations.some(annotation => !!mediaNode.marks.find(mark => mark.attrs.id === annotation.id)) && !annotationState.isInlineCommentViewClosed ? 'active' : 'default';
35
+ }, [annotationState, mediaNode]);
29
36
  const onClick = useCallback(() => {
30
37
  if (api.annotation && mediaNode) {
31
38
  const {
@@ -35,7 +42,7 @@ const CommentBadgeWrapper = ({
35
42
  }
36
43
  }, [api.annotation, dispatch, mediaNode, state]);
37
44
  const pos = getPos();
38
- if (!Number.isFinite(pos) || !annotationState || !mediaNode || mediaNode.type !== media || mediaNode.marks.every(maybeAnnotation => maybeAnnotation.type !== annotation || !(maybeAnnotation.attrs.id in annotationState.annotations) || annotationState.annotations[maybeAnnotation.attrs.id])) {
45
+ if (!Number.isFinite(pos) || !(annotationState !== null && annotationState !== void 0 && annotationState.annotations) || !mediaNode || mediaNode.type !== media || mediaNode.marks.every(maybeAnnotation => maybeAnnotation.type !== annotation || !(maybeAnnotation.attrs.id in annotationState.annotations) || annotationState.annotations[maybeAnnotation.attrs.id])) {
39
46
  return null;
40
47
  }
41
48
  const mediaElement = view.domAtPos(pos + 1).node;
@@ -45,7 +52,10 @@ const CommentBadgeWrapper = ({
45
52
  onClick: onClick,
46
53
  mediaElement: mediaElement,
47
54
  intl: intl,
48
- isEditor: true
55
+ isEditor: true,
56
+ status: entered ? 'entered' : status,
57
+ onMouseEnter: () => setEntered(true),
58
+ onMouseLeave: () => setEntered(false)
49
59
  });
50
60
  };
51
61
  export const CommentBadge = injectIntl(CommentBadgeWrapper);
package/dist/esm/ui/CommentBadge/index.js CHANGED
@@ -1,4 +1,5 @@
1
- import React, { useCallback } from 'react';
1
+ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
+ import React, { useCallback, useMemo, useState } from 'react';
2
3
  import { injectIntl } from 'react-intl-next';
3
4
  import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
4
5
  import { CommentBadge as CommentBadgeComponent } from '@atlaskit/editor-common/media-single';
@@ -8,6 +9,10 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
8
9
  view = _ref.view,
9
10
  getPos = _ref.getPos,
10
11
  intl = _ref.intl;
12
+ var _useState = useState(false),
13
+ _useState2 = _slicedToArray(_useState, 2),
14
+ entered = _useState2[0],
15
+ setEntered = _useState2[1];
11
16
  var _useSharedPluginState = useSharedPluginState(api, ['annotation']),
12
17
  annotationState = _useSharedPluginState.annotationState;
13
18
  var _view$state$schema = view.state.schema,
@@ -15,6 +20,16 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
15
20
  annotation = _view$state$schema.marks.annotation,
16
21
  state = view.state,
17
22
  dispatch = view.dispatch;
23
+ var status = useMemo(function () {
24
+ if (!annotationState || !mediaNode) {
25
+ return 'default';
26
+ }
27
+ return annotationState.selectedAnnotations.some(function (annotation) {
28
+ return !!mediaNode.marks.find(function (mark) {
29
+ return mark.attrs.id === annotation.id;
30
+ });
31
+ }) && !annotationState.isInlineCommentViewClosed ? 'active' : 'default';
32
+ }, [annotationState, mediaNode]);
18
33
  var onClick = useCallback(function () {
19
34
  if (api.annotation && mediaNode) {
20
35
  var showCommentForBlockNode = api.annotation.actions.showCommentForBlockNode;
@@ -22,7 +37,7 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
22
37
  }
23
38
  }, [api.annotation, dispatch, mediaNode, state]);
24
39
  var pos = getPos();
25
- if (!Number.isFinite(pos) || !annotationState || !mediaNode || mediaNode.type !== media || mediaNode.marks.every(function (maybeAnnotation) {
40
+ if (!Number.isFinite(pos) || !(annotationState !== null && annotationState !== void 0 && annotationState.annotations) || !mediaNode || mediaNode.type !== media || mediaNode.marks.every(function (maybeAnnotation) {
26
41
  return maybeAnnotation.type !== annotation || !(maybeAnnotation.attrs.id in annotationState.annotations) || annotationState.annotations[maybeAnnotation.attrs.id];
27
42
  })) {
28
43
  return null;
@@ -34,7 +49,14 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
34
49
  onClick: onClick,
35
50
  mediaElement: mediaElement,
36
51
  intl: intl,
37
- isEditor: true
52
+ isEditor: true,
53
+ status: entered ? 'entered' : status,
54
+ onMouseEnter: function onMouseEnter() {
55
+ return setEntered(true);
56
+ },
57
+ onMouseLeave: function onMouseLeave() {
58
+ return setEntered(false);
59
+ }
38
60
  });
39
61
  };
40
62
  export var CommentBadge = injectIntl(CommentBadgeWrapper);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-media",
3
- "version": "1.14.4",
3
+ "version": "1.15.1",
4
4
  "description": "Media plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -33,14 +33,14 @@
33
33
  "./types": "./src/types.ts"
34
34
  },
35
35
  "dependencies": {
36
- "@atlaskit/adf-schema": "^35.8.0",
36
+ "@atlaskit/adf-schema": "^35.9.0",
37
37
  "@atlaskit/analytics-namespaced-context": "^6.9.0",
38
38
  "@atlaskit/analytics-next": "^9.2.0",
39
39
  "@atlaskit/button": "^17.12.0",
40
- "@atlaskit/editor-common": "^78.26.0",
40
+ "@atlaskit/editor-common": "^78.28.0",
41
41
  "@atlaskit/editor-palette": "1.5.3",
42
42
  "@atlaskit/editor-plugin-analytics": "^1.0.0",
43
- "@atlaskit/editor-plugin-annotation": "1.5.8",
43
+ "@atlaskit/editor-plugin-annotation": "1.5.9",
44
44
  "@atlaskit/editor-plugin-decorations": "^1.0.0",
45
45
  "@atlaskit/editor-plugin-editor-disabled": "^1.0.0",
46
46
  "@atlaskit/editor-plugin-editor-viewmode": "^1.0.0",