@atlaskit/renderer 112.5.4 → 112.6.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 CHANGED
@@ -1,5 +1,28 @@
1
1
  # @atlaskit/renderer
2
2
 
3
+ ## 112.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#167231](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/167231)
8
+ [`335a373081eaf`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/335a373081eaf) -
9
+ [ux] Added hoveredAnnotation for the renderer and the editor to accomodate the newly implemented
10
+ comment's panel
11
+
12
+ ### Patch Changes
13
+
14
+ - Updated dependencies
15
+
16
+ ## 112.5.5
17
+
18
+ ### Patch Changes
19
+
20
+ - [#166957](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/166957)
21
+ [`32cc3cebd2ed7`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/32cc3cebd2ed7) -
22
+ ED-25632 Ensure table nesting transform errors are logged to analytics. This includes an upgrade
23
+ to core-plugin to allow it to receive an anaylytics callback.
24
+ - Updated dependencies
25
+
3
26
  ## 112.5.4
4
27
 
5
28
  ### Patch Changes
@@ -85,7 +85,7 @@ var _validation = function _validation(doc, schema, adfStage, useSpecBasedValida
85
85
  eventType: _analytics.EVENT_TYPE.OPERATIONAL,
86
86
  attributes: {
87
87
  platform: _events.PLATFORM.WEB,
88
- errorStack: 'Failed to transform one or more nested tables in the document'
88
+ errorStack: "".concat(e instanceof Error && e.name === 'NodeNestingTransformError' ? 'NodeNestingTransformError - Failed to encode one or more nested tables' : undefined)
89
89
  }
90
90
  });
91
91
  }
@@ -65,7 +65,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
65
65
  var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
66
66
  var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
67
67
  var packageName = "@atlaskit/renderer";
68
- var packageVersion = "112.5.4";
68
+ var packageVersion = "112.6.0";
69
69
  var setAsQueryContainerStyles = (0, _react2.css)({
70
70
  containerName: 'ak-renderer-wrapper',
71
71
  containerType: 'inline-size',
@@ -21,10 +21,12 @@ var MarkElement = exports.MarkElement = function MarkElement(_ref) {
21
21
  useBlockLevel = _ref.useBlockLevel;
22
22
  var updateSubscriber = (0, _hooks.useInlineCommentSubscriberContext)();
23
23
  var states = (0, _react.useContext)(_context.InlineCommentsStateContext);
24
- var hasFocus = (0, _hooks.useHasFocusEvent)({
25
- id: id,
26
- updateSubscriber: updateSubscriber
27
- });
24
+ var _useHasFocusEvent = (0, _hooks.useHasFocusEvent)({
25
+ id: id,
26
+ updateSubscriber: updateSubscriber
27
+ }),
28
+ hasFocus = _useHasFocusEvent.hasFocus,
29
+ isHovered = _useHasFocusEvent.isHovered;
28
30
  var dataAttributesMemorized = (0, _react.useMemo)(function () {
29
31
  return dataAttributes;
30
32
  }, [dataAttributes]);
@@ -54,6 +56,7 @@ var MarkElement = exports.MarkElement = function MarkElement(_ref) {
54
56
  annotationParentIds: activeParentIds,
55
57
  onClick: onClick,
56
58
  hasFocus: hasFocus,
59
+ isHovered: isHovered,
57
60
  state: states[id],
58
61
  useBlockLevel: useBlockLevel
59
62
  }, children);
@@ -26,7 +26,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
26
26
  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; }
27
27
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- `AnnotationSharedCSSByState` is not object-safe
28
28
  var markStyles = function markStyles() {
29
- return (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tcolor: inherit;\n\tbackground-color: unset;\n\t-webkit-tap-highlight-color: transparent;\n\n\t&[data-mark-annotation-state='", "'] {\n\t\t", "\n\t\t", "\n\n\t\t&:focus,\n\t\t\t&[data-has-focus='true'] {\n\t\t\t", "\n\t\t}\n\t}\n"])), _adfSchema.AnnotationMarkStates.ACTIVE, (0, _platformFeatureFlags.fg)('editor_inline_comments_on_inline_nodes') ? (0, _styles.AnnotationSharedCSSByState)().common : '', (0, _styles.AnnotationSharedCSSByState)().blur, (0, _styles.AnnotationSharedCSSByState)().focus);
29
+ return (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tcolor: inherit;\n\tbackground-color: unset;\n\t-webkit-tap-highlight-color: transparent;\n\n\t&[data-mark-annotation-state='", "'] {\n\t\t", "\n\t\t", "\n\n\t\t&:focus,\n\t\t\t&[data-has-focus='true'] {\n\t\t\t", "\n\t\t}\n\t\t&[data-is-hovered='true']:not([data-has-focus='true']),\n \t\t&:hover:not(:focus) {\n \t", "\n \t\t}\n\t}\n"])), _adfSchema.AnnotationMarkStates.ACTIVE, (0, _platformFeatureFlags.fg)('editor_inline_comments_on_inline_nodes') ? (0, _styles.AnnotationSharedCSSByState)().common : '', (0, _styles.AnnotationSharedCSSByState)().blur, (0, _styles.AnnotationSharedCSSByState)().focus, (0, _styles.AnnotationSharedCSSByState)().hover);
30
30
  };
31
31
  var isMobile = function isMobile() {
32
32
  return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
@@ -59,6 +59,7 @@ var MarkComponent = exports.MarkComponent = function MarkComponent(_ref) {
59
59
  id = _ref.id,
60
60
  state = _ref.state,
61
61
  hasFocus = _ref.hasFocus,
62
+ isHovered = _ref.isHovered,
62
63
  onClick = _ref.onClick,
63
64
  useBlockLevel = _ref.useBlockLevel;
64
65
  var isInlineCommentsKbAccessible = _featureGateJsClient.default.checkGate('inline_comments_keyboard_accessible_renderer');
@@ -106,7 +107,8 @@ var MarkComponent = exports.MarkComponent = function MarkComponent(_ref) {
106
107
  };
107
108
  var overriddenData = !state ? dataAttributes : _objectSpread(_objectSpread({}, dataAttributes), {}, {
108
109
  'data-mark-annotation-state': state,
109
- 'data-has-focus': hasFocus
110
+ 'data-has-focus': hasFocus,
111
+ 'data-is-hovered': isHovered
110
112
  });
111
113
  var desktopAccessibilityAttributes = isInlineCommentsKbAccessible ? isMobile() ? {} : {
112
114
  role: 'button',
@@ -54,6 +54,10 @@ var useHasFocusEvent = exports.useHasFocusEvent = function useHasFocusEvent(_ref
54
54
  _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
55
55
  hasFocus = _useState4[0],
56
56
  setHasFocus = _useState4[1];
57
+ var _useState5 = (0, _react.useState)(false),
58
+ _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
59
+ isHovered = _useState6[0],
60
+ setIsHovered = _useState6[1];
57
61
  var isInlineCommentsKbAccessible = _featureGateJsClient.default.checkGate('inline_comments_keyboard_accessible_renderer');
58
62
  (0, _react.useLayoutEffect)(function () {
59
63
  if (!updateSubscriber) {
@@ -62,26 +66,42 @@ var useHasFocusEvent = exports.useHasFocusEvent = function useHasFocusEvent(_ref
62
66
  var cb = function cb(payload) {
63
67
  setHasFocus(payload && payload.annotationId === id);
64
68
  };
69
+ var callbackForHoveredAnnotation = function callbackForHoveredAnnotation(payload) {
70
+ setIsHovered(payload && payload.annotationId === id);
71
+ };
65
72
  var removeFocus = function removeFocus() {
66
73
  setHasFocus(false);
67
74
  if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
68
75
  document.activeElement.blur();
69
76
  }
70
77
  };
78
+ var removeHoverEffect = function removeHoverEffect() {
79
+ setIsHovered(false);
80
+ if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
81
+ document.activeElement.blur();
82
+ }
83
+ };
71
84
  updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
85
+ updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
72
86
  updateSubscriber.on(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
87
+ updateSubscriber.on(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_HOVERED, removeHoverEffect);
73
88
  return function () {
74
89
  updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
90
+ updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
75
91
  updateSubscriber.off(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
92
+ updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, removeHoverEffect);
76
93
  };
77
94
  }, [id, updateSubscriber, isInlineCommentsKbAccessible]);
78
- return hasFocus;
95
+ return {
96
+ hasFocus: hasFocus,
97
+ isHovered: isHovered
98
+ };
79
99
  };
80
100
  var useAnnotationClickEvent = exports.useAnnotationClickEvent = function useAnnotationClickEvent(props) {
81
- var _useState5 = (0, _react.useState)(null),
82
- _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
83
- annotationClickEvent = _useState6[0],
84
- setAnnotationClickEvent = _useState6[1];
101
+ var _useState7 = (0, _react.useState)(null),
102
+ _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
103
+ annotationClickEvent = _useState8[0],
104
+ setAnnotationClickEvent = _useState8[1];
85
105
  var updateSubscriber = props.updateSubscriber,
86
106
  createAnalyticsEvent = props.createAnalyticsEvent,
87
107
  isNestedRender = props.isNestedRender;
@@ -79,7 +79,7 @@ const _validation = (doc, schema, adfStage, useSpecBasedValidator, dispatchAnaly
79
79
  eventType: EVENT_TYPE.OPERATIONAL,
80
80
  attributes: {
81
81
  platform: PLATFORM.WEB,
82
- errorStack: 'Failed to transform one or more nested tables in the document'
82
+ errorStack: `${e instanceof Error && e.name === 'NodeNestingTransformError' ? 'NodeNestingTransformError - Failed to encode one or more nested tables' : undefined}`
83
83
  }
84
84
  });
85
85
  }
@@ -45,7 +45,7 @@ import { countNodes } from './count-nodes';
45
45
  export const NORMAL_SEVERITY_THRESHOLD = 2000;
46
46
  export const DEGRADED_SEVERITY_THRESHOLD = 3000;
47
47
  const packageName = "@atlaskit/renderer";
48
- const packageVersion = "112.5.4";
48
+ const packageVersion = "112.6.0";
49
49
  const setAsQueryContainerStyles = css({
50
50
  containerName: 'ak-renderer-wrapper',
51
51
  containerType: 'inline-size',
@@ -13,7 +13,10 @@ const MarkElement = ({
13
13
  }) => {
14
14
  const updateSubscriber = useInlineCommentSubscriberContext();
15
15
  const states = useContext(InlineCommentsStateContext);
16
- const hasFocus = useHasFocusEvent({
16
+ const {
17
+ hasFocus,
18
+ isHovered
19
+ } = useHasFocusEvent({
17
20
  id,
18
21
  updateSubscriber
19
22
  });
@@ -46,6 +49,7 @@ const MarkElement = ({
46
49
  annotationParentIds: activeParentIds,
47
50
  onClick: onClick,
48
51
  hasFocus: hasFocus,
52
+ isHovered: isHovered,
49
53
  state: states[id],
50
54
  useBlockLevel: useBlockLevel
51
55
  }, children);
@@ -27,6 +27,10 @@ const markStyles = () => css`
27
27
  &[data-has-focus='true'] {
28
28
  ${AnnotationSharedCSSByState().focus}
29
29
  }
30
+ &[data-is-hovered='true']:not([data-has-focus='true']),
31
+ &:hover:not(:focus) {
32
+ ${AnnotationSharedCSSByState().hover}
33
+ }
30
34
  }
31
35
  `;
32
36
  const isMobile = () => {
@@ -58,6 +62,7 @@ export const MarkComponent = ({
58
62
  id,
59
63
  state,
60
64
  hasFocus,
65
+ isHovered,
61
66
  onClick,
62
67
  useBlockLevel
63
68
  }) => {
@@ -105,7 +110,8 @@ export const MarkComponent = ({
105
110
  const overriddenData = !state ? dataAttributes : {
106
111
  ...dataAttributes,
107
112
  'data-mark-annotation-state': state,
108
- 'data-has-focus': hasFocus
113
+ 'data-has-focus': hasFocus,
114
+ 'data-is-hovered': isHovered
109
115
  };
110
116
  const desktopAccessibilityAttributes = isInlineCommentsKbAccessible ? isMobile() ? {} : {
111
117
  role: 'button',
@@ -45,6 +45,7 @@ export const useHasFocusEvent = ({
45
45
  updateSubscriber
46
46
  }) => {
47
47
  const [hasFocus, setHasFocus] = useState(false);
48
+ const [isHovered, setIsHovered] = useState(false);
48
49
  const isInlineCommentsKbAccessible = FeatureGates.checkGate('inline_comments_keyboard_accessible_renderer');
49
50
  useLayoutEffect(() => {
50
51
  if (!updateSubscriber) {
@@ -53,20 +54,36 @@ export const useHasFocusEvent = ({
53
54
  const cb = payload => {
54
55
  setHasFocus(payload && payload.annotationId === id);
55
56
  };
57
+ const callbackForHoveredAnnotation = payload => {
58
+ setIsHovered(payload && payload.annotationId === id);
59
+ };
56
60
  const removeFocus = () => {
57
61
  setHasFocus(false);
58
62
  if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
59
63
  document.activeElement.blur();
60
64
  }
61
65
  };
66
+ const removeHoverEffect = () => {
67
+ setIsHovered(false);
68
+ if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
69
+ document.activeElement.blur();
70
+ }
71
+ };
62
72
  updateSubscriber.on(AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
73
+ updateSubscriber.on(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
63
74
  updateSubscriber.on(AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
75
+ updateSubscriber.on(AnnotationUpdateEvent.REMOVE_ANNOTATION_HOVERED, removeHoverEffect);
64
76
  return () => {
65
77
  updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
78
+ updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
66
79
  updateSubscriber.off(AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
80
+ updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, removeHoverEffect);
67
81
  };
68
82
  }, [id, updateSubscriber, isInlineCommentsKbAccessible]);
69
- return hasFocus;
83
+ return {
84
+ hasFocus,
85
+ isHovered
86
+ };
70
87
  };
71
88
  export const useAnnotationClickEvent = props => {
72
89
  const [annotationClickEvent, setAnnotationClickEvent] = useState(null);
@@ -78,7 +78,7 @@ var _validation = function _validation(doc, schema, adfStage, useSpecBasedValida
78
78
  eventType: EVENT_TYPE.OPERATIONAL,
79
79
  attributes: {
80
80
  platform: PLATFORM.WEB,
81
- errorStack: 'Failed to transform one or more nested tables in the document'
81
+ errorStack: "".concat(e instanceof Error && e.name === 'NodeNestingTransformError' ? 'NodeNestingTransformError - Failed to encode one or more nested tables' : undefined)
82
82
  }
83
83
  });
84
84
  }
@@ -55,7 +55,7 @@ import { countNodes } from './count-nodes';
55
55
  export var NORMAL_SEVERITY_THRESHOLD = 2000;
56
56
  export var DEGRADED_SEVERITY_THRESHOLD = 3000;
57
57
  var packageName = "@atlaskit/renderer";
58
- var packageVersion = "112.5.4";
58
+ var packageVersion = "112.6.0";
59
59
  var setAsQueryContainerStyles = css({
60
60
  containerName: 'ak-renderer-wrapper',
61
61
  containerType: 'inline-size',
@@ -12,10 +12,12 @@ var MarkElement = function MarkElement(_ref) {
12
12
  useBlockLevel = _ref.useBlockLevel;
13
13
  var updateSubscriber = useInlineCommentSubscriberContext();
14
14
  var states = useContext(InlineCommentsStateContext);
15
- var hasFocus = useHasFocusEvent({
16
- id: id,
17
- updateSubscriber: updateSubscriber
18
- });
15
+ var _useHasFocusEvent = useHasFocusEvent({
16
+ id: id,
17
+ updateSubscriber: updateSubscriber
18
+ }),
19
+ hasFocus = _useHasFocusEvent.hasFocus,
20
+ isHovered = _useHasFocusEvent.isHovered;
19
21
  var dataAttributesMemorized = useMemo(function () {
20
22
  return dataAttributes;
21
23
  }, [dataAttributes]);
@@ -45,6 +47,7 @@ var MarkElement = function MarkElement(_ref) {
45
47
  annotationParentIds: activeParentIds,
46
48
  onClick: onClick,
47
49
  hasFocus: hasFocus,
50
+ isHovered: isHovered,
48
51
  state: states[id],
49
52
  useBlockLevel: useBlockLevel
50
53
  }, children);
@@ -21,7 +21,7 @@ import { inlineCommentMessages } from '../../../messages';
21
21
 
22
22
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- `AnnotationSharedCSSByState` is not object-safe
23
23
  var markStyles = function markStyles() {
24
- return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tcolor: inherit;\n\tbackground-color: unset;\n\t-webkit-tap-highlight-color: transparent;\n\n\t&[data-mark-annotation-state='", "'] {\n\t\t", "\n\t\t", "\n\n\t\t&:focus,\n\t\t\t&[data-has-focus='true'] {\n\t\t\t", "\n\t\t}\n\t}\n"])), AnnotationMarkStates.ACTIVE, fg('editor_inline_comments_on_inline_nodes') ? AnnotationSharedCSSByState().common : '', AnnotationSharedCSSByState().blur, AnnotationSharedCSSByState().focus);
24
+ return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tcolor: inherit;\n\tbackground-color: unset;\n\t-webkit-tap-highlight-color: transparent;\n\n\t&[data-mark-annotation-state='", "'] {\n\t\t", "\n\t\t", "\n\n\t\t&:focus,\n\t\t\t&[data-has-focus='true'] {\n\t\t\t", "\n\t\t}\n\t\t&[data-is-hovered='true']:not([data-has-focus='true']),\n \t\t&:hover:not(:focus) {\n \t", "\n \t\t}\n\t}\n"])), AnnotationMarkStates.ACTIVE, fg('editor_inline_comments_on_inline_nodes') ? AnnotationSharedCSSByState().common : '', AnnotationSharedCSSByState().blur, AnnotationSharedCSSByState().focus, AnnotationSharedCSSByState().hover);
25
25
  };
26
26
  var isMobile = function isMobile() {
27
27
  return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
@@ -54,6 +54,7 @@ export var MarkComponent = function MarkComponent(_ref) {
54
54
  id = _ref.id,
55
55
  state = _ref.state,
56
56
  hasFocus = _ref.hasFocus,
57
+ isHovered = _ref.isHovered,
57
58
  onClick = _ref.onClick,
58
59
  useBlockLevel = _ref.useBlockLevel;
59
60
  var isInlineCommentsKbAccessible = FeatureGates.checkGate('inline_comments_keyboard_accessible_renderer');
@@ -101,7 +102,8 @@ export var MarkComponent = function MarkComponent(_ref) {
101
102
  };
102
103
  var overriddenData = !state ? dataAttributes : _objectSpread(_objectSpread({}, dataAttributes), {}, {
103
104
  'data-mark-annotation-state': state,
104
- 'data-has-focus': hasFocus
105
+ 'data-has-focus': hasFocus,
106
+ 'data-is-hovered': isHovered
105
107
  });
106
108
  var desktopAccessibilityAttributes = isInlineCommentsKbAccessible ? isMobile() ? {} : {
107
109
  role: 'button',
@@ -47,6 +47,10 @@ export var useHasFocusEvent = function useHasFocusEvent(_ref2) {
47
47
  _useState4 = _slicedToArray(_useState3, 2),
48
48
  hasFocus = _useState4[0],
49
49
  setHasFocus = _useState4[1];
50
+ var _useState5 = useState(false),
51
+ _useState6 = _slicedToArray(_useState5, 2),
52
+ isHovered = _useState6[0],
53
+ setIsHovered = _useState6[1];
50
54
  var isInlineCommentsKbAccessible = FeatureGates.checkGate('inline_comments_keyboard_accessible_renderer');
51
55
  useLayoutEffect(function () {
52
56
  if (!updateSubscriber) {
@@ -55,26 +59,42 @@ export var useHasFocusEvent = function useHasFocusEvent(_ref2) {
55
59
  var cb = function cb(payload) {
56
60
  setHasFocus(payload && payload.annotationId === id);
57
61
  };
62
+ var callbackForHoveredAnnotation = function callbackForHoveredAnnotation(payload) {
63
+ setIsHovered(payload && payload.annotationId === id);
64
+ };
58
65
  var removeFocus = function removeFocus() {
59
66
  setHasFocus(false);
60
67
  if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
61
68
  document.activeElement.blur();
62
69
  }
63
70
  };
71
+ var removeHoverEffect = function removeHoverEffect() {
72
+ setIsHovered(false);
73
+ if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
74
+ document.activeElement.blur();
75
+ }
76
+ };
64
77
  updateSubscriber.on(AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
78
+ updateSubscriber.on(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
65
79
  updateSubscriber.on(AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
80
+ updateSubscriber.on(AnnotationUpdateEvent.REMOVE_ANNOTATION_HOVERED, removeHoverEffect);
66
81
  return function () {
67
82
  updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
83
+ updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
68
84
  updateSubscriber.off(AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
85
+ updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, removeHoverEffect);
69
86
  };
70
87
  }, [id, updateSubscriber, isInlineCommentsKbAccessible]);
71
- return hasFocus;
88
+ return {
89
+ hasFocus: hasFocus,
90
+ isHovered: isHovered
91
+ };
72
92
  };
73
93
  export var useAnnotationClickEvent = function useAnnotationClickEvent(props) {
74
- var _useState5 = useState(null),
75
- _useState6 = _slicedToArray(_useState5, 2),
76
- annotationClickEvent = _useState6[0],
77
- setAnnotationClickEvent = _useState6[1];
94
+ var _useState7 = useState(null),
95
+ _useState8 = _slicedToArray(_useState7, 2),
96
+ annotationClickEvent = _useState8[0],
97
+ setAnnotationClickEvent = _useState8[1];
78
98
  var updateSubscriber = props.updateSubscriber,
79
99
  createAnalyticsEvent = props.createAnalyticsEvent,
80
100
  isNestedRender = props.isNestedRender;
@@ -12,10 +12,11 @@ type MarkComponentProps = {
12
12
  dataAttributes: AnnotationDataAttributes;
13
13
  state: AnnotationMarkStates | null;
14
14
  hasFocus: boolean;
15
+ isHovered: boolean;
15
16
  onClick: (props: OnAnnotationClickPayload) => void;
16
17
  useBlockLevel?: boolean;
17
18
  };
18
- export declare const MarkComponent: ({ annotationParentIds, children, dataAttributes, id, state, hasFocus, onClick, useBlockLevel, }: React.PropsWithChildren<MarkComponentProps>) => React.ReactElement<{
19
+ export declare const MarkComponent: ({ annotationParentIds, children, dataAttributes, id, state, hasFocus, isHovered, onClick, useBlockLevel, }: React.PropsWithChildren<MarkComponentProps>) => React.ReactElement<{
19
20
  css?: {}[] | undefined;
20
21
  'data-mark-type': string;
21
22
  'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
@@ -27,6 +28,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
27
28
  css?: {}[] | undefined;
28
29
  'data-mark-annotation-state': AnnotationMarkStates;
29
30
  'data-has-focus': boolean;
31
+ 'data-is-hovered': boolean;
30
32
  'data-mark-type': string;
31
33
  'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
32
34
  'data-id': string;
@@ -49,6 +51,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
49
51
  css?: {}[] | undefined;
50
52
  'data-mark-annotation-state': AnnotationMarkStates;
51
53
  'data-has-focus': boolean;
54
+ 'data-is-hovered': boolean;
52
55
  'data-mark-type': string;
53
56
  'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
54
57
  'data-id': string;
@@ -76,6 +79,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
76
79
  css?: {}[] | undefined;
77
80
  'data-mark-annotation-state': AnnotationMarkStates;
78
81
  'data-has-focus': boolean;
82
+ 'data-is-hovered': boolean;
79
83
  'data-mark-type': string;
80
84
  'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
81
85
  'data-id': string;
@@ -13,7 +13,10 @@ type UseAnnotationUpdateSatteByEventProps = {
13
13
  updateSubscriber: AnnotationUpdateEmitter | null;
14
14
  };
15
15
  export declare const useAnnotationStateByTypeEvent: ({ type, updateSubscriber, }: UseAnnotationUpdateSatteByEventProps) => Record<string, AnnotationMarkStates | null>;
16
- export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => boolean;
16
+ export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => {
17
+ hasFocus: boolean;
18
+ isHovered: boolean;
19
+ };
17
20
  type AnnotationsWithClickTarget = Pick<InlineCommentViewComponentProps, 'annotations' | 'clickElementTarget'> | null;
18
21
  export declare const useAnnotationClickEvent: (props: Pick<ListenEventProps, 'updateSubscriber' | 'createAnalyticsEvent' | 'isNestedRender'>) => AnnotationsWithClickTarget;
19
22
  export {};
@@ -12,10 +12,11 @@ type MarkComponentProps = {
12
12
  dataAttributes: AnnotationDataAttributes;
13
13
  state: AnnotationMarkStates | null;
14
14
  hasFocus: boolean;
15
+ isHovered: boolean;
15
16
  onClick: (props: OnAnnotationClickPayload) => void;
16
17
  useBlockLevel?: boolean;
17
18
  };
18
- export declare const MarkComponent: ({ annotationParentIds, children, dataAttributes, id, state, hasFocus, onClick, useBlockLevel, }: React.PropsWithChildren<MarkComponentProps>) => React.ReactElement<{
19
+ export declare const MarkComponent: ({ annotationParentIds, children, dataAttributes, id, state, hasFocus, isHovered, onClick, useBlockLevel, }: React.PropsWithChildren<MarkComponentProps>) => React.ReactElement<{
19
20
  css?: {}[] | undefined;
20
21
  'data-mark-type': string;
21
22
  'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
@@ -27,6 +28,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
27
28
  css?: {}[] | undefined;
28
29
  'data-mark-annotation-state': AnnotationMarkStates;
29
30
  'data-has-focus': boolean;
31
+ 'data-is-hovered': boolean;
30
32
  'data-mark-type': string;
31
33
  'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
32
34
  'data-id': string;
@@ -49,6 +51,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
49
51
  css?: {}[] | undefined;
50
52
  'data-mark-annotation-state': AnnotationMarkStates;
51
53
  'data-has-focus': boolean;
54
+ 'data-is-hovered': boolean;
52
55
  'data-mark-type': string;
53
56
  'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
54
57
  'data-id': string;
@@ -76,6 +79,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
76
79
  css?: {}[] | undefined;
77
80
  'data-mark-annotation-state': AnnotationMarkStates;
78
81
  'data-has-focus': boolean;
82
+ 'data-is-hovered': boolean;
79
83
  'data-mark-type': string;
80
84
  'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
81
85
  'data-id': string;
@@ -13,7 +13,10 @@ type UseAnnotationUpdateSatteByEventProps = {
13
13
  updateSubscriber: AnnotationUpdateEmitter | null;
14
14
  };
15
15
  export declare const useAnnotationStateByTypeEvent: ({ type, updateSubscriber, }: UseAnnotationUpdateSatteByEventProps) => Record<string, AnnotationMarkStates | null>;
16
- export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => boolean;
16
+ export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => {
17
+ hasFocus: boolean;
18
+ isHovered: boolean;
19
+ };
17
20
  type AnnotationsWithClickTarget = Pick<InlineCommentViewComponentProps, 'annotations' | 'clickElementTarget'> | null;
18
21
  export declare const useAnnotationClickEvent: (props: Pick<ListenEventProps, 'updateSubscriber' | 'createAnalyticsEvent' | 'isNestedRender'>) => AnnotationsWithClickTarget;
19
22
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "112.5.4",
3
+ "version": "112.6.0",
4
4
  "description": "Renderer component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -29,15 +29,15 @@
29
29
  "@atlaskit/analytics-next": "^10.1.0",
30
30
  "@atlaskit/button": "^20.3.0",
31
31
  "@atlaskit/code": "^15.6.0",
32
- "@atlaskit/editor-common": "^95.0.0",
32
+ "@atlaskit/editor-common": "^95.4.0",
33
33
  "@atlaskit/editor-json-transformer": "^8.21.0",
34
34
  "@atlaskit/editor-palette": "1.6.3",
35
35
  "@atlaskit/editor-prosemirror": "6.0.0",
36
36
  "@atlaskit/editor-shared-styles": "^3.2.0",
37
37
  "@atlaskit/emoji": "^67.11.0",
38
38
  "@atlaskit/feature-gate-js-client": "^4.23.0",
39
- "@atlaskit/icon": "^22.24.0",
40
- "@atlaskit/link-datasource": "^3.11.0",
39
+ "@atlaskit/icon": "^22.25.0",
40
+ "@atlaskit/link-datasource": "^3.12.0",
41
41
  "@atlaskit/media-card": "^78.14.0",
42
42
  "@atlaskit/media-client": "^28.3.0",
43
43
  "@atlaskit/media-client-react": "^2.3.0",
@@ -62,7 +62,7 @@
62
62
  "uuid": "^3.1.0"
63
63
  },
64
64
  "peerDependencies": {
65
- "@atlaskit/link-provider": "^1.16.0",
65
+ "@atlaskit/link-provider": "^1.17.0",
66
66
  "@atlaskit/media-core": "^34.3.0",
67
67
  "react": "^16.8.0 || ^17.0.0 || ~18.2.0",
68
68
  "react-dom": "^16.8.0 || ^17.0.0 || ~18.2.0"
@@ -72,7 +72,7 @@
72
72
  "@af/visual-regression": "*",
73
73
  "@atlaskit/analytics-gas-types": "^5.1.0",
74
74
  "@atlaskit/css-reset": "^6.11.0",
75
- "@atlaskit/link-provider": "^1.16.0",
75
+ "@atlaskit/link-provider": "^1.17.0",
76
76
  "@atlaskit/link-test-helpers": "^7.5.0",
77
77
  "@atlaskit/linking-common": "^6.0.0",
78
78
  "@atlaskit/media-core": "^34.3.0",