@atlaskit/renderer 109.13.1 → 109.15.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @atlaskit/renderer
 
+## 109.15.0
+
+### Minor Changes
+
+- [#87820](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/87820) [`120f76a32bf9`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/120f76a32bf9) - [ED-22819]
+
+  - Update ApplyAnnotation to return `step` of type AddNodeMarkStep for annotation on media and correct `doc` that includes newly add annotation mark
+  - Make media node read in data attributes so that it shows data-renderer-start-pos
+
+### Patch Changes
+
+- Updated dependencies
+
+## 109.14.0
+
+### Minor Changes
+
+- [#87313](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/87313) [`1789491c0687`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/1789491c0687) - [ED-22804] Update renderer action deleteAnnotation to function with media node
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 109.13.1
 
 ### Patch Changes

package/dist/cjs/actions/index.js

@@ -80,8 +80,13 @@ var RendererActions = exports.default = /*#__PURE__*/function () {
       });
       var from;
       var to;
+      var nodePos;
+      var step;
       this.doc.descendants(function (node, pos) {
         var found = mark.isInSet(node.marks);
+        if (found && node.type.name === 'media') {
+          nodePos = pos;
+        }
         if (found && !from) {
           // Set both here incase it only spans one node.
           from = pos;
@@ -93,10 +98,14 @@ var RendererActions = exports.default = /*#__PURE__*/function () {
         }
         return true;
       });
-      if (from === undefined || to === undefined) {
-        return false;
+      if (nodePos !== undefined) {
+        step = new _transform.RemoveNodeMarkStep(nodePos, mark);
+      } else {
+        if (from === undefined || to === undefined) {
+          return false;
+        }
+        step = new _transform.RemoveMarkStep(from, to, mark);
       }
-      var step = new _transform.RemoveMarkStep(from, to, mark);
       var _step$apply = step.apply(this.doc),
         doc = _step$apply.doc,
         failed = _step$apply.failed;
@@ -217,11 +226,24 @@ var RendererActions = exports.default = /*#__PURE__*/function () {
         to = pos.to;
       var annotationId = annotation.annotationId,
         annotationType = annotation.annotationType;
-      var step = (0, _steps.createAnnotationStep)(from, to, {
-        annotationId: annotationId,
-        annotationType: annotationType,
-        schema: this.schema
-      });
+      var step;
+
+      // If from points to a node position,
+      // we need to 1 position before it for nodeAt to return the node itself
+      var beforeNodePos = Math.max(from - 1, 0);
+      var possibleNode = this.doc.nodeAt(beforeNodePos);
+      if ((possibleNode === null || possibleNode === void 0 ? void 0 : possibleNode.type.name) === 'media') {
+        step = new _transform.AddNodeMarkStep(beforeNodePos, this.schema.marks.annotation.create({
+          id: annotationId,
+          type: annotationType
+        }));
+      } else {
+        step = (0, _steps.createAnnotationStep)(from, to, {
+          annotationId: annotationId,
+          annotationType: annotationType,
+          schema: this.schema
+        });
+      }
       var _step$apply2 = step.apply(this.doc),
         doc = _step$apply2.doc,
         failed = _step$apply2.failed;

package/dist/cjs/react/index.js

@@ -411,7 +411,7 @@ var ReactSerializer = exports.default = /*#__PURE__*/function () {
       var isBorderMark = function isBorderMark(mark) {
         return isChildOfMediaSingle && mark.type === border;
       };
-      return _objectSpread(_objectSpread({}, this.getProps(node)), {}, {
+      return _objectSpread(_objectSpread({}, this.getProps(node, path)), {}, {
         marks: node.marks.filter(function (m) {
           return !isLinkMark(m) || _this6.allowMediaLinking === true;
         }),

package/dist/cjs/steps/index.js

@@ -10,6 +10,9 @@ var _transform = require("@atlaskit/editor-prosemirror/transform");
 function getStartPos(element) {
   return parseInt(element.dataset.rendererStartPos || '-1', 10);
 }
+var getNodeType = function getNodeType(element) {
+  return element.dataset.nodeType;
+};
 function isPositionPointer(element) {
   return getStartPos(element) > -1;
 }
@@ -114,6 +117,14 @@ function getPosFromRange(range) {
     startOffset = range.startOffset,
     endContainer = range.endContainer,
     endOffset = range.endOffset;
+  var parent = findParent(startContainer);
+  if (parent && getNodeType(parent) === 'media') {
+    var pos = getStartPos(parent);
+    return {
+      from: pos,
+      to: pos
+    };
+  }
   var from = resolvePos(startContainer, startOffset);
   var to = resolvePos(endContainer, endOffset);
   if (from === false || to === false) {

package/dist/cjs/ui/MediaCard.js

@@ -269,7 +269,8 @@ var MediaCardView = exports.MediaCardView = /*#__PURE__*/function (_Component) {
         shouldEnableDownloadButton = _this$props5.shouldEnableDownloadButton,
         ssr = _this$props5.ssr,
         mediaClient = _this$props5.mediaClient,
-        setHoverTarget = _this$props5.setHoverTarget;
+        setHoverTarget = _this$props5.setHoverTarget,
+        dataAttributes = _this$props5.dataAttributes;
       var isMobile = rendererAppearance === 'mobile';
       var shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
       var isInlinePlayer = isMobile ? false : shouldPlayInline;
@@ -304,7 +305,7 @@ var MediaCardView = exports.MediaCardView = /*#__PURE__*/function (_Component) {
         contextIdentifierProvider: contextIdentifierProvider,
         originalDimensions: originalDimensions,
         fileState: fileState
-      }), {
+      }), dataAttributes, {
         onMouseEnter: function onMouseEnter(event) {
           // We will not allow a hover target to be set if any mouse button is depressed during the mouse enter state.
           // This could be due to the user trying to select text across the document.

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

@@ -55,7 +55,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 = "109.13.1";
+var packageVersion = "109.15.0";
 var Renderer = exports.Renderer = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/es2019/actions/index.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { JSONTransformer } from '@atlaskit/editor-json-transformer';
 import { canApplyAnnotationOnRange, getAnnotationIdsFromRange } from '@atlaskit/editor-common/utils';
 import { AnnotationTypes } from '@atlaskit/adf-schema';
-import { RemoveMarkStep } from '@atlaskit/editor-prosemirror/transform';
+import { AddNodeMarkStep, RemoveMarkStep, RemoveNodeMarkStep } from '@atlaskit/editor-prosemirror/transform';
 import { createAnnotationStep, getPosFromRange } from '../steps';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, ACTION_SUBJECT_ID } from '@atlaskit/editor-common/analytics';
 import { getIndexMatch } from './matches-utils';
@@ -61,8 +61,13 @@ export default class RendererActions {
     });
     let from;
     let to;
+    let nodePos;
+    let step;
     this.doc.descendants((node, pos) => {
       const found = mark.isInSet(node.marks);
+      if (found && node.type.name === 'media') {
+        nodePos = pos;
+      }
       if (found && !from) {
         // Set both here incase it only spans one node.
         from = pos;
@@ -74,10 +79,14 @@ export default class RendererActions {
       }
       return true;
     });
-    if (from === undefined || to === undefined) {
-      return false;
+    if (nodePos !== undefined) {
+      step = new RemoveNodeMarkStep(nodePos, mark);
+    } else {
+      if (from === undefined || to === undefined) {
+        return false;
+      }
+      step = new RemoveMarkStep(from, to, mark);
     }
-    const step = new RemoveMarkStep(from, to, mark);
     const {
       doc,
       failed
@@ -195,11 +204,24 @@ export default class RendererActions {
       annotationId,
       annotationType
     } = annotation;
-    const step = createAnnotationStep(from, to, {
-      annotationId,
-      annotationType,
-      schema: this.schema
-    });
+    let step;
+
+    // If from points to a node position,
+    // we need to 1 position before it for nodeAt to return the node itself
+    const beforeNodePos = Math.max(from - 1, 0);
+    const possibleNode = this.doc.nodeAt(beforeNodePos);
+    if ((possibleNode === null || possibleNode === void 0 ? void 0 : possibleNode.type.name) === 'media') {
+      step = new AddNodeMarkStep(beforeNodePos, this.schema.marks.annotation.create({
+        id: annotationId,
+        type: annotationType
+      }));
+    } else {
+      step = createAnnotationStep(from, to, {
+        annotationId,
+        annotationType,
+        schema: this.schema
+      });
+    }
     const {
       doc,
       failed

package/dist/es2019/react/index.js

@@ -361,7 +361,7 @@ export default class ReactSerializer {
     const isLinkMark = mark => mark.type === link;
     const isBorderMark = mark => isChildOfMediaSingle && mark.type === border;
     return {
-      ...this.getProps(node),
+      ...this.getProps(node, path),
       marks: node.marks.filter(m => !isLinkMark(m) || this.allowMediaLinking === true),
       isLinkMark,
       isBorderMark,

package/dist/es2019/steps/index.js

@@ -2,6 +2,7 @@ import { AddMarkStep } from '@atlaskit/editor-prosemirror/transform';
 function getStartPos(element) {
   return parseInt(element.dataset.rendererStartPos || '-1', 10);
 }
+const getNodeType = element => element.dataset.nodeType;
 function isPositionPointer(element) {
   return getStartPos(element) > -1;
 }
@@ -112,6 +113,14 @@ export function getPosFromRange(range) {
     endContainer,
     endOffset
   } = range;
+  const parent = findParent(startContainer);
+  if (parent && getNodeType(parent) === 'media') {
+    const pos = getStartPos(parent);
+    return {
+      from: pos,
+      to: pos
+    };
+  }
   const from = resolvePos(startContainer, startOffset);
   const to = resolvePos(endContainer, endOffset);
   if (from === false || to === false) {

package/dist/es2019/ui/MediaCard.js

@@ -201,7 +201,8 @@ export class MediaCardView extends Component {
       shouldEnableDownloadButton,
       ssr,
       mediaClient,
-      setHoverTarget
+      setHoverTarget,
+      dataAttributes
     } = this.props;
     const isMobile = rendererAppearance === 'mobile';
     const shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
@@ -237,7 +238,7 @@ export class MediaCardView extends Component {
       contextIdentifierProvider,
       originalDimensions,
       fileState
-    }), {
+    }), dataAttributes, {
       onMouseEnter: event => {
         // We will not allow a hover target to be set if any mouse button is depressed during the mouse enter state.
         // This could be due to the user trying to select text across the document.

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

@@ -36,7 +36,7 @@ import { EditorMediaClientProvider } from '../../react/utils/EditorMediaClientPr
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "109.13.1";
+const packageVersion = "109.15.0";
 export class Renderer extends PureComponent {
   constructor(props) {
     super(props);

package/dist/esm/actions/index.js

@@ -5,7 +5,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { JSONTransformer } from '@atlaskit/editor-json-transformer';
 import { canApplyAnnotationOnRange, getAnnotationIdsFromRange } from '@atlaskit/editor-common/utils';
 import { AnnotationTypes } from '@atlaskit/adf-schema';
-import { RemoveMarkStep } from '@atlaskit/editor-prosemirror/transform';
+import { AddNodeMarkStep, RemoveMarkStep, RemoveNodeMarkStep } from '@atlaskit/editor-prosemirror/transform';
 import { createAnnotationStep, getPosFromRange } from '../steps';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, ACTION_SUBJECT_ID } from '@atlaskit/editor-common/analytics';
 import { getIndexMatch } from './matches-utils';
@@ -73,8 +73,13 @@ var RendererActions = /*#__PURE__*/function () {
       });
       var from;
       var to;
+      var nodePos;
+      var step;
       this.doc.descendants(function (node, pos) {
         var found = mark.isInSet(node.marks);
+        if (found && node.type.name === 'media') {
+          nodePos = pos;
+        }
         if (found && !from) {
           // Set both here incase it only spans one node.
           from = pos;
@@ -86,10 +91,14 @@ var RendererActions = /*#__PURE__*/function () {
         }
         return true;
       });
-      if (from === undefined || to === undefined) {
-        return false;
+      if (nodePos !== undefined) {
+        step = new RemoveNodeMarkStep(nodePos, mark);
+      } else {
+        if (from === undefined || to === undefined) {
+          return false;
+        }
+        step = new RemoveMarkStep(from, to, mark);
       }
-      var step = new RemoveMarkStep(from, to, mark);
       var _step$apply = step.apply(this.doc),
         doc = _step$apply.doc,
         failed = _step$apply.failed;
@@ -210,11 +219,24 @@ var RendererActions = /*#__PURE__*/function () {
         to = pos.to;
       var annotationId = annotation.annotationId,
         annotationType = annotation.annotationType;
-      var step = createAnnotationStep(from, to, {
-        annotationId: annotationId,
-        annotationType: annotationType,
-        schema: this.schema
-      });
+      var step;
+
+      // If from points to a node position,
+      // we need to 1 position before it for nodeAt to return the node itself
+      var beforeNodePos = Math.max(from - 1, 0);
+      var possibleNode = this.doc.nodeAt(beforeNodePos);
+      if ((possibleNode === null || possibleNode === void 0 ? void 0 : possibleNode.type.name) === 'media') {
+        step = new AddNodeMarkStep(beforeNodePos, this.schema.marks.annotation.create({
+          id: annotationId,
+          type: annotationType
+        }));
+      } else {
+        step = createAnnotationStep(from, to, {
+          annotationId: annotationId,
+          annotationType: annotationType,
+          schema: this.schema
+        });
+      }
       var _step$apply2 = step.apply(this.doc),
         doc = _step$apply2.doc,
         failed = _step$apply2.failed;

package/dist/esm/react/index.js

@@ -404,7 +404,7 @@ var ReactSerializer = /*#__PURE__*/function () {
       var isBorderMark = function isBorderMark(mark) {
         return isChildOfMediaSingle && mark.type === border;
       };
-      return _objectSpread(_objectSpread({}, this.getProps(node)), {}, {
+      return _objectSpread(_objectSpread({}, this.getProps(node, path)), {}, {
         marks: node.marks.filter(function (m) {
           return !isLinkMark(m) || _this6.allowMediaLinking === true;
         }),

package/dist/esm/steps/index.js

@@ -2,6 +2,9 @@ import { AddMarkStep } from '@atlaskit/editor-prosemirror/transform';
 function getStartPos(element) {
   return parseInt(element.dataset.rendererStartPos || '-1', 10);
 }
+var getNodeType = function getNodeType(element) {
+  return element.dataset.nodeType;
+};
 function isPositionPointer(element) {
   return getStartPos(element) > -1;
 }
@@ -106,6 +109,14 @@ export function getPosFromRange(range) {
     startOffset = range.startOffset,
     endContainer = range.endContainer,
     endOffset = range.endOffset;
+  var parent = findParent(startContainer);
+  if (parent && getNodeType(parent) === 'media') {
+    var pos = getStartPos(parent);
+    return {
+      from: pos,
+      to: pos
+    };
+  }
   var from = resolvePos(startContainer, startOffset);
   var to = resolvePos(endContainer, endOffset);
   if (from === false || to === false) {

package/dist/esm/ui/MediaCard.js

@@ -259,7 +259,8 @@ export var MediaCardView = /*#__PURE__*/function (_Component) {
         shouldEnableDownloadButton = _this$props5.shouldEnableDownloadButton,
         ssr = _this$props5.ssr,
         mediaClient = _this$props5.mediaClient,
-        setHoverTarget = _this$props5.setHoverTarget;
+        setHoverTarget = _this$props5.setHoverTarget,
+        dataAttributes = _this$props5.dataAttributes;
       var isMobile = rendererAppearance === 'mobile';
       var shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
       var isInlinePlayer = isMobile ? false : shouldPlayInline;
@@ -294,7 +295,7 @@ export var MediaCardView = /*#__PURE__*/function (_Component) {
         contextIdentifierProvider: contextIdentifierProvider,
         originalDimensions: originalDimensions,
         fileState: fileState
-      }), {
+      }), dataAttributes, {
         onMouseEnter: function onMouseEnter(event) {
           // We will not allow a hover target to be set if any mouse button is depressed during the mouse enter state.
           // This could be due to the user trying to select text across the document.

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

@@ -46,7 +46,7 @@ import { EditorMediaClientProvider } from '../../react/utils/EditorMediaClientPr
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "109.13.1";
+var packageVersion = "109.15.0";
 export var Renderer = /*#__PURE__*/function (_PureComponent) {
   _inherits(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/types/actions/index.d.ts

@@ -4,7 +4,6 @@ import type { AnnotationActionResult, AnnotationByMatches } from '@atlaskit/edit
 import { AnnotationTypes } from '@atlaskit/adf-schema';
 import type { Node, Schema, Mark } from '@atlaskit/editor-prosemirror/model';
 import type { Step } from '@atlaskit/editor-prosemirror/transform';
-import { RemoveMarkStep } from '@atlaskit/editor-prosemirror/transform';
 import type { AnalyticsEventPayload } from '../analytics/events';
 type ActionResult = {
     step: Step;
@@ -47,7 +46,7 @@ export default class RendererActions implements RendererActionsOptions, Annotati
      */
     _privateValidatePositionsForAnnotation(from: number, to: number): boolean;
     deleteAnnotation(annotationId: string, annotationType: 'inlineComment'): false | {
-        step: RemoveMarkStep;
+        step: Step;
         doc: JSONDocNode;
     };
     annotate(range: Range, annotationId: string, annotationType: 'inlineComment'): AnnotationActionResult;

package/dist/types/ui/MediaCard.d.ts

@@ -39,6 +39,7 @@ export interface MediaCardProps {
     featureFlags?: MediaFeatureFlags;
     shouldEnableDownloadButton?: boolean;
     ssr?: MediaSSR;
+    dataAttributes?: Record<string, any>;
 }
 export interface State {
     contextIdentifierProvider?: ContextIdentifierProvider;

package/dist/types-ts4.5/actions/index.d.ts

@@ -4,7 +4,6 @@ import type { AnnotationActionResult, AnnotationByMatches } from '@atlaskit/edit
 import { AnnotationTypes } from '@atlaskit/adf-schema';
 import type { Node, Schema, Mark } from '@atlaskit/editor-prosemirror/model';
 import type { Step } from '@atlaskit/editor-prosemirror/transform';
-import { RemoveMarkStep } from '@atlaskit/editor-prosemirror/transform';
 import type { AnalyticsEventPayload } from '../analytics/events';
 type ActionResult = {
     step: Step;
@@ -47,7 +46,7 @@ export default class RendererActions implements RendererActionsOptions, Annotati
      */
     _privateValidatePositionsForAnnotation(from: number, to: number): boolean;
     deleteAnnotation(annotationId: string, annotationType: 'inlineComment'): false | {
-        step: RemoveMarkStep;
+        step: Step;
         doc: JSONDocNode;
     };
     annotate(range: Range, annotationId: string, annotationType: 'inlineComment'): AnnotationActionResult;

package/dist/types-ts4.5/ui/MediaCard.d.ts

@@ -39,6 +39,7 @@ export interface MediaCardProps {
     featureFlags?: MediaFeatureFlags;
     shouldEnableDownloadButton?: boolean;
     ssr?: MediaSSR;
+    dataAttributes?: Record<string, any>;
 }
 export interface State {
     contextIdentifierProvider?: ContextIdentifierProvider;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "109.13.1",
+  "version": "109.15.0",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -29,7 +29,7 @@
     "@atlaskit/analytics-listeners": "^8.9.0",
     "@atlaskit/analytics-namespaced-context": "^6.9.0",
     "@atlaskit/analytics-next": "^9.2.0",
-    "@atlaskit/button": "^17.8.0",
+    "@atlaskit/button": "^17.10.0",
     "@atlaskit/code": "^15.1.0",
     "@atlaskit/editor-common": "^78.23.0",
     "@atlaskit/editor-json-transformer": "^8.10.0",
@@ -38,16 +38,16 @@
     "@atlaskit/editor-shared-styles": "^2.9.0",
     "@atlaskit/emoji": "^67.6.0",
     "@atlaskit/icon": "^22.1.0",
-    "@atlaskit/link-datasource": "^1.24.0",
+    "@atlaskit/link-datasource": "^1.25.0",
     "@atlaskit/media-card": "^77.10.0",
     "@atlaskit/media-client": "^26.2.0",
     "@atlaskit/media-client-react": "^2.0.0",
     "@atlaskit/media-common": "^11.1.0",
     "@atlaskit/media-filmstrip": "^47.0.0",
-    "@atlaskit/media-ui": "^25.4.0",
+    "@atlaskit/media-ui": "^25.5.0",
     "@atlaskit/media-viewer": "^48.4.0",
     "@atlaskit/platform-feature-flags": "^0.2.0",
-    "@atlaskit/smart-card": "^26.51.0",
+    "@atlaskit/smart-card": "^26.52.0",
     "@atlaskit/status": "^1.4.0",
     "@atlaskit/task-decision": "^17.9.0",
     "@atlaskit/theme": "^12.7.0",