@atlaskit/renderer 112.5.5 → 112.6.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/renderer
 
+## 112.6.0
+
+### Minor Changes
+
+- [#167231](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/167231)
+  [`335a373081eaf`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/335a373081eaf) -
+  [ux] Added hoveredAnnotation for the renderer and the editor to accomodate the newly implemented
+  comment's panel
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 112.5.5
 
 ### Patch Changes

package/dist/cjs/ui/Renderer/index.js

@@ -65,7 +65,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
 var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "112.5.5";
+var packageVersion = "112.6.0";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',

package/dist/cjs/ui/annotations/element/index.js

@@ -21,10 +21,12 @@ var MarkElement = exports.MarkElement = function MarkElement(_ref) {
     useBlockLevel = _ref.useBlockLevel;
   var updateSubscriber = (0, _hooks.useInlineCommentSubscriberContext)();
   var states = (0, _react.useContext)(_context.InlineCommentsStateContext);
-  var hasFocus = (0, _hooks.useHasFocusEvent)({
-    id: id,
-    updateSubscriber: updateSubscriber
-  });
+  var _useHasFocusEvent = (0, _hooks.useHasFocusEvent)({
+      id: id,
+      updateSubscriber: updateSubscriber
+    }),
+    hasFocus = _useHasFocusEvent.hasFocus,
+    isHovered = _useHasFocusEvent.isHovered;
   var dataAttributesMemorized = (0, _react.useMemo)(function () {
     return dataAttributes;
   }, [dataAttributes]);
@@ -54,6 +56,7 @@ var MarkElement = exports.MarkElement = function MarkElement(_ref) {
     annotationParentIds: activeParentIds,
     onClick: onClick,
     hasFocus: hasFocus,
+    isHovered: isHovered,
     state: states[id],
     useBlockLevel: useBlockLevel
   }, children);

package/dist/cjs/ui/annotations/element/mark.js

@@ -26,7 +26,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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; }
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- `AnnotationSharedCSSByState` is not object-safe
 var markStyles = function markStyles() {
-  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);
+  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);
 };
 var isMobile = function isMobile() {
   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) {
     id = _ref.id,
     state = _ref.state,
     hasFocus = _ref.hasFocus,
+    isHovered = _ref.isHovered,
     onClick = _ref.onClick,
     useBlockLevel = _ref.useBlockLevel;
   var isInlineCommentsKbAccessible = _featureGateJsClient.default.checkGate('inline_comments_keyboard_accessible_renderer');
@@ -106,7 +107,8 @@ var MarkComponent = exports.MarkComponent = function MarkComponent(_ref) {
   };
   var overriddenData = !state ? dataAttributes : _objectSpread(_objectSpread({}, dataAttributes), {}, {
     'data-mark-annotation-state': state,
-    'data-has-focus': hasFocus
+    'data-has-focus': hasFocus,
+    'data-is-hovered': isHovered
   });
   var desktopAccessibilityAttributes = isInlineCommentsKbAccessible ? isMobile() ? {} : {
     role: 'button',

package/dist/cjs/ui/annotations/hooks/use-events.js

@@ -54,6 +54,10 @@ var useHasFocusEvent = exports.useHasFocusEvent = function useHasFocusEvent(_ref
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
     hasFocus = _useState4[0],
     setHasFocus = _useState4[1];
+  var _useState5 = (0, _react.useState)(false),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    isHovered = _useState6[0],
+    setIsHovered = _useState6[1];
   var isInlineCommentsKbAccessible = _featureGateJsClient.default.checkGate('inline_comments_keyboard_accessible_renderer');
   (0, _react.useLayoutEffect)(function () {
     if (!updateSubscriber) {
@@ -62,26 +66,42 @@ var useHasFocusEvent = exports.useHasFocusEvent = function useHasFocusEvent(_ref
     var cb = function cb(payload) {
       setHasFocus(payload && payload.annotationId === id);
     };
+    var callbackForHoveredAnnotation = function callbackForHoveredAnnotation(payload) {
+      setIsHovered(payload && payload.annotationId === id);
+    };
     var removeFocus = function removeFocus() {
       setHasFocus(false);
       if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
         document.activeElement.blur();
       }
     };
+    var removeHoverEffect = function removeHoverEffect() {
+      setIsHovered(false);
+      if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
+        document.activeElement.blur();
+      }
+    };
     updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
+    updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
     updateSubscriber.on(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
+    updateSubscriber.on(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_HOVERED, removeHoverEffect);
     return function () {
       updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
+      updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
       updateSubscriber.off(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
+      updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, removeHoverEffect);
     };
   }, [id, updateSubscriber, isInlineCommentsKbAccessible]);
-  return hasFocus;
+  return {
+    hasFocus: hasFocus,
+    isHovered: isHovered
+  };
 };
 var useAnnotationClickEvent = exports.useAnnotationClickEvent = function useAnnotationClickEvent(props) {
-  var _useState5 = (0, _react.useState)(null),
-    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-    annotationClickEvent = _useState6[0],
-    setAnnotationClickEvent = _useState6[1];
+  var _useState7 = (0, _react.useState)(null),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    annotationClickEvent = _useState8[0],
+    setAnnotationClickEvent = _useState8[1];
   var updateSubscriber = props.updateSubscriber,
     createAnalyticsEvent = props.createAnalyticsEvent,
     isNestedRender = props.isNestedRender;

package/dist/es2019/ui/Renderer/index.js

@@ -45,7 +45,7 @@ import { countNodes } from './count-nodes';
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "112.5.5";
+const packageVersion = "112.6.0";
 const setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',

package/dist/es2019/ui/annotations/element/index.js

@@ -13,7 +13,10 @@ const MarkElement = ({
 }) => {
   const updateSubscriber = useInlineCommentSubscriberContext();
   const states = useContext(InlineCommentsStateContext);
-  const hasFocus = useHasFocusEvent({
+  const {
+    hasFocus,
+    isHovered
+  } = useHasFocusEvent({
     id,
     updateSubscriber
   });
@@ -46,6 +49,7 @@ const MarkElement = ({
     annotationParentIds: activeParentIds,
     onClick: onClick,
     hasFocus: hasFocus,
+    isHovered: isHovered,
     state: states[id],
     useBlockLevel: useBlockLevel
   }, children);

package/dist/es2019/ui/annotations/element/mark.js

@@ -27,6 +27,10 @@ const markStyles = () => css`
 			&[data-has-focus='true'] {
 			${AnnotationSharedCSSByState().focus}
 		}
+		&[data-is-hovered='true']:not([data-has-focus='true']),
+  		&:hover:not(:focus) {
+    	${AnnotationSharedCSSByState().hover}
+  		}
 	}
 `;
 const isMobile = () => {
@@ -58,6 +62,7 @@ export const MarkComponent = ({
   id,
   state,
   hasFocus,
+  isHovered,
   onClick,
   useBlockLevel
 }) => {
@@ -105,7 +110,8 @@ export const MarkComponent = ({
   const overriddenData = !state ? dataAttributes : {
     ...dataAttributes,
     'data-mark-annotation-state': state,
-    'data-has-focus': hasFocus
+    'data-has-focus': hasFocus,
+    'data-is-hovered': isHovered
   };
   const desktopAccessibilityAttributes = isInlineCommentsKbAccessible ? isMobile() ? {} : {
     role: 'button',

package/dist/es2019/ui/annotations/hooks/use-events.js

@@ -45,6 +45,7 @@ export const useHasFocusEvent = ({
   updateSubscriber
 }) => {
   const [hasFocus, setHasFocus] = useState(false);
+  const [isHovered, setIsHovered] = useState(false);
   const isInlineCommentsKbAccessible = FeatureGates.checkGate('inline_comments_keyboard_accessible_renderer');
   useLayoutEffect(() => {
     if (!updateSubscriber) {
@@ -53,20 +54,36 @@ export const useHasFocusEvent = ({
     const cb = payload => {
       setHasFocus(payload && payload.annotationId === id);
     };
+    const callbackForHoveredAnnotation = payload => {
+      setIsHovered(payload && payload.annotationId === id);
+    };
     const removeFocus = () => {
       setHasFocus(false);
       if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
         document.activeElement.blur();
       }
     };
+    const removeHoverEffect = () => {
+      setIsHovered(false);
+      if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
+        document.activeElement.blur();
+      }
+    };
     updateSubscriber.on(AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
+    updateSubscriber.on(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
     updateSubscriber.on(AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
+    updateSubscriber.on(AnnotationUpdateEvent.REMOVE_ANNOTATION_HOVERED, removeHoverEffect);
     return () => {
       updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
+      updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
       updateSubscriber.off(AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
+      updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, removeHoverEffect);
     };
   }, [id, updateSubscriber, isInlineCommentsKbAccessible]);
-  return hasFocus;
+  return {
+    hasFocus,
+    isHovered
+  };
 };
 export const useAnnotationClickEvent = props => {
   const [annotationClickEvent, setAnnotationClickEvent] = useState(null);

package/dist/esm/ui/Renderer/index.js

@@ -55,7 +55,7 @@ import { countNodes } from './count-nodes';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "112.5.5";
+var packageVersion = "112.6.0";
 var setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',

package/dist/esm/ui/annotations/element/index.js

@@ -12,10 +12,12 @@ var MarkElement = function MarkElement(_ref) {
     useBlockLevel = _ref.useBlockLevel;
   var updateSubscriber = useInlineCommentSubscriberContext();
   var states = useContext(InlineCommentsStateContext);
-  var hasFocus = useHasFocusEvent({
-    id: id,
-    updateSubscriber: updateSubscriber
-  });
+  var _useHasFocusEvent = useHasFocusEvent({
+      id: id,
+      updateSubscriber: updateSubscriber
+    }),
+    hasFocus = _useHasFocusEvent.hasFocus,
+    isHovered = _useHasFocusEvent.isHovered;
   var dataAttributesMemorized = useMemo(function () {
     return dataAttributes;
   }, [dataAttributes]);
@@ -45,6 +47,7 @@ var MarkElement = function MarkElement(_ref) {
     annotationParentIds: activeParentIds,
     onClick: onClick,
     hasFocus: hasFocus,
+    isHovered: isHovered,
     state: states[id],
     useBlockLevel: useBlockLevel
   }, children);

package/dist/esm/ui/annotations/element/mark.js

@@ -21,7 +21,7 @@ import { inlineCommentMessages } from '../../../messages';
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- `AnnotationSharedCSSByState` is not object-safe
 var markStyles = function markStyles() {
-  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);
+  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);
 };
 var isMobile = function isMobile() {
   return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
@@ -54,6 +54,7 @@ export var MarkComponent = function MarkComponent(_ref) {
     id = _ref.id,
     state = _ref.state,
     hasFocus = _ref.hasFocus,
+    isHovered = _ref.isHovered,
     onClick = _ref.onClick,
     useBlockLevel = _ref.useBlockLevel;
   var isInlineCommentsKbAccessible = FeatureGates.checkGate('inline_comments_keyboard_accessible_renderer');
@@ -101,7 +102,8 @@ export var MarkComponent = function MarkComponent(_ref) {
   };
   var overriddenData = !state ? dataAttributes : _objectSpread(_objectSpread({}, dataAttributes), {}, {
     'data-mark-annotation-state': state,
-    'data-has-focus': hasFocus
+    'data-has-focus': hasFocus,
+    'data-is-hovered': isHovered
   });
   var desktopAccessibilityAttributes = isInlineCommentsKbAccessible ? isMobile() ? {} : {
     role: 'button',

package/dist/esm/ui/annotations/hooks/use-events.js

@@ -47,6 +47,10 @@ export var useHasFocusEvent = function useHasFocusEvent(_ref2) {
     _useState4 = _slicedToArray(_useState3, 2),
     hasFocus = _useState4[0],
     setHasFocus = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isHovered = _useState6[0],
+    setIsHovered = _useState6[1];
   var isInlineCommentsKbAccessible = FeatureGates.checkGate('inline_comments_keyboard_accessible_renderer');
   useLayoutEffect(function () {
     if (!updateSubscriber) {
@@ -55,26 +59,42 @@ export var useHasFocusEvent = function useHasFocusEvent(_ref2) {
     var cb = function cb(payload) {
       setHasFocus(payload && payload.annotationId === id);
     };
+    var callbackForHoveredAnnotation = function callbackForHoveredAnnotation(payload) {
+      setIsHovered(payload && payload.annotationId === id);
+    };
     var removeFocus = function removeFocus() {
       setHasFocus(false);
       if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
         document.activeElement.blur();
       }
     };
+    var removeHoverEffect = function removeHoverEffect() {
+      setIsHovered(false);
+      if (isInlineCommentsKbAccessible && document.activeElement instanceof HTMLElement) {
+        document.activeElement.blur();
+      }
+    };
     updateSubscriber.on(AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
+    updateSubscriber.on(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
     updateSubscriber.on(AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
+    updateSubscriber.on(AnnotationUpdateEvent.REMOVE_ANNOTATION_HOVERED, removeHoverEffect);
     return function () {
       updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
+      updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
       updateSubscriber.off(AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
+      updateSubscriber.off(AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, removeHoverEffect);
     };
   }, [id, updateSubscriber, isInlineCommentsKbAccessible]);
-  return hasFocus;
+  return {
+    hasFocus: hasFocus,
+    isHovered: isHovered
+  };
 };
 export var useAnnotationClickEvent = function useAnnotationClickEvent(props) {
-  var _useState5 = useState(null),
-    _useState6 = _slicedToArray(_useState5, 2),
-    annotationClickEvent = _useState6[0],
-    setAnnotationClickEvent = _useState6[1];
+  var _useState7 = useState(null),
+    _useState8 = _slicedToArray(_useState7, 2),
+    annotationClickEvent = _useState8[0],
+    setAnnotationClickEvent = _useState8[1];
   var updateSubscriber = props.updateSubscriber,
     createAnalyticsEvent = props.createAnalyticsEvent,
     isNestedRender = props.isNestedRender;

package/dist/types/ui/annotations/element/mark.d.ts

@@ -12,10 +12,11 @@ type MarkComponentProps = {
     dataAttributes: AnnotationDataAttributes;
     state: AnnotationMarkStates | null;
     hasFocus: boolean;
+    isHovered: boolean;
     onClick: (props: OnAnnotationClickPayload) => void;
     useBlockLevel?: boolean;
 };
-export declare const MarkComponent: ({ annotationParentIds, children, dataAttributes, id, state, hasFocus, onClick, useBlockLevel, }: React.PropsWithChildren<MarkComponentProps>) => React.ReactElement<{
+export declare const MarkComponent: ({ annotationParentIds, children, dataAttributes, id, state, hasFocus, isHovered, onClick, useBlockLevel, }: React.PropsWithChildren<MarkComponentProps>) => React.ReactElement<{
     css?: {}[] | undefined;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
@@ -27,6 +28,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     css?: {}[] | undefined;
     'data-mark-annotation-state': AnnotationMarkStates;
     'data-has-focus': boolean;
+    'data-is-hovered': boolean;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
     'data-id': string;
@@ -49,6 +51,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     css?: {}[] | undefined;
     'data-mark-annotation-state': AnnotationMarkStates;
     'data-has-focus': boolean;
+    'data-is-hovered': boolean;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
     'data-id': string;
@@ -76,6 +79,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     css?: {}[] | undefined;
     'data-mark-annotation-state': AnnotationMarkStates;
     'data-has-focus': boolean;
+    'data-is-hovered': boolean;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
     'data-id': string;

package/dist/types/ui/annotations/hooks/use-events.d.ts

@@ -13,7 +13,10 @@ type UseAnnotationUpdateSatteByEventProps = {
     updateSubscriber: AnnotationUpdateEmitter | null;
 };
 export declare const useAnnotationStateByTypeEvent: ({ type, updateSubscriber, }: UseAnnotationUpdateSatteByEventProps) => Record<string, AnnotationMarkStates | null>;
-export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => boolean;
+export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => {
+    hasFocus: boolean;
+    isHovered: boolean;
+};
 type AnnotationsWithClickTarget = Pick<InlineCommentViewComponentProps, 'annotations' | 'clickElementTarget'> | null;
 export declare const useAnnotationClickEvent: (props: Pick<ListenEventProps, 'updateSubscriber' | 'createAnalyticsEvent' | 'isNestedRender'>) => AnnotationsWithClickTarget;
 export {};

package/dist/types-ts4.5/ui/annotations/element/mark.d.ts

@@ -12,10 +12,11 @@ type MarkComponentProps = {
     dataAttributes: AnnotationDataAttributes;
     state: AnnotationMarkStates | null;
     hasFocus: boolean;
+    isHovered: boolean;
     onClick: (props: OnAnnotationClickPayload) => void;
     useBlockLevel?: boolean;
 };
-export declare const MarkComponent: ({ annotationParentIds, children, dataAttributes, id, state, hasFocus, onClick, useBlockLevel, }: React.PropsWithChildren<MarkComponentProps>) => React.ReactElement<{
+export declare const MarkComponent: ({ annotationParentIds, children, dataAttributes, id, state, hasFocus, isHovered, onClick, useBlockLevel, }: React.PropsWithChildren<MarkComponentProps>) => React.ReactElement<{
     css?: {}[] | undefined;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
@@ -27,6 +28,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     css?: {}[] | undefined;
     'data-mark-annotation-state': AnnotationMarkStates;
     'data-has-focus': boolean;
+    'data-is-hovered': boolean;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
     'data-id': string;
@@ -49,6 +51,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     css?: {}[] | undefined;
     'data-mark-annotation-state': AnnotationMarkStates;
     'data-has-focus': boolean;
+    'data-is-hovered': boolean;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
     'data-id': string;
@@ -76,6 +79,7 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     css?: {}[] | undefined;
     'data-mark-annotation-state': AnnotationMarkStates;
     'data-has-focus': boolean;
+    'data-is-hovered': boolean;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
     'data-id': string;

package/dist/types-ts4.5/ui/annotations/hooks/use-events.d.ts

@@ -13,7 +13,10 @@ type UseAnnotationUpdateSatteByEventProps = {
     updateSubscriber: AnnotationUpdateEmitter | null;
 };
 export declare const useAnnotationStateByTypeEvent: ({ type, updateSubscriber, }: UseAnnotationUpdateSatteByEventProps) => Record<string, AnnotationMarkStates | null>;
-export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => boolean;
+export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => {
+    hasFocus: boolean;
+    isHovered: boolean;
+};
 type AnnotationsWithClickTarget = Pick<InlineCommentViewComponentProps, 'annotations' | 'clickElementTarget'> | null;
 export declare const useAnnotationClickEvent: (props: Pick<ListenEventProps, 'updateSubscriber' | 'createAnalyticsEvent' | 'isNestedRender'>) => AnnotationsWithClickTarget;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "112.5.5",
+	"version": "112.6.0",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -29,7 +29,7 @@
 		"@atlaskit/analytics-next": "^10.1.0",
 		"@atlaskit/button": "^20.3.0",
 		"@atlaskit/code": "^15.6.0",
-		"@atlaskit/editor-common": "^95.2.0",
+		"@atlaskit/editor-common": "^95.4.0",
 		"@atlaskit/editor-json-transformer": "^8.21.0",
 		"@atlaskit/editor-palette": "1.6.3",
 		"@atlaskit/editor-prosemirror": "6.0.0",
@@ -37,7 +37,7 @@
 		"@atlaskit/emoji": "^67.11.0",
 		"@atlaskit/feature-gate-js-client": "^4.23.0",
 		"@atlaskit/icon": "^22.25.0",
-		"@atlaskit/link-datasource": "^3.11.0",
+		"@atlaskit/link-datasource": "^3.12.0",
 		"@atlaskit/media-card": "^78.14.0",
 		"@atlaskit/media-client": "^28.3.0",
 		"@atlaskit/media-client-react": "^2.3.0",
@@ -62,7 +62,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/link-provider": "^1.16.0",
+		"@atlaskit/link-provider": "^1.17.0",
 		"@atlaskit/media-core": "^34.3.0",
 		"react": "^16.8.0 || ^17.0.0 || ~18.2.0",
 		"react-dom": "^16.8.0 || ^17.0.0 || ~18.2.0"
@@ -72,7 +72,7 @@
 		"@af/visual-regression": "*",
 		"@atlaskit/analytics-gas-types": "^5.1.0",
 		"@atlaskit/css-reset": "^6.11.0",
-		"@atlaskit/link-provider": "^1.16.0",
+		"@atlaskit/link-provider": "^1.17.0",
 		"@atlaskit/link-test-helpers": "^7.5.0",
 		"@atlaskit/linking-common": "^6.0.0",
 		"@atlaskit/media-core": "^34.3.0",