@atlaskit/renderer 80.0.0 → 82.0.0

package/CHANGELOG.md

@@ -1,5 +1,58 @@
 # @atlaskit/renderer
 
+## 82.0.0
+
+### Major Changes
+
+- [`3c5548e50da`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3c5548e50da) - [ux] Introducing new Media Inline component to renderer
+
+### Minor Changes
+
+- [`971845eac0d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/971845eac0d) - CETI-96 Added new rule to emoji to solve the duplicate icon issue when we copy from renderer
+
+### Patch Changes
+
+- [`f897443ad45`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f897443ad45) - Revert AK-279
+- [`87865d3284f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/87865d3284f) - CETI-122 Fix Rendering of hybrid renderer when the prop UNSAFE_allowCustomPanels changed.
+- [`a554946e674`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a554946e674) - Skipping flakey tests to unblock the weasal release
+- [`33bca2a18bb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/33bca2a18bb) - Skipping a flaky test to unblock the weasal release
+- Updated dependencies
+
+## 81.1.1
+
+### Patch Changes
+
+- [`b85e7ce12cd`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b85e7ce12cd) - Internal upgrade of memoize-one to 6.0.0
+
+## 81.1.0
+
+### Minor Changes
+
+- [`cf853e39278`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cf853e39278) - CETI-72 Web: Copy from renderer loses custom panel attributes
+- [`cf853e39278`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cf853e39278) - AK-279 Moved copy button outside of heading, that made heading accessible
+- [`6840e64d105`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6840e64d105) - CETI-124: Revert panel content wrapper from span to div
+
+### Patch Changes
+
+- Updated dependencies
+
+## 81.0.0
+
+### Minor Changes
+
+- [`511f07f7f7b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/511f07f7f7b) - allow enabling download for media card via enableDownloadButton feature prop
+
+### Patch Changes
+
+- [`5fe6e21a9a0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5fe6e21a9a0) - [ux] Upgrade to the latest version of @atlaskit/modal-dialog. This change includes shifting the primary button in the footer of the modal to be on the right instead of the left.
+- [`b90c0237824`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b90c0237824) - Update package.jsons to remove unused dependencies.
+- [`b95863772be`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b95863772be) - Support external observers.
+  Use better naming for refNode (refNode => reference).
+  In favor of further work (supporting multiple references) pass array of references to Extension component.
+  Expand node with localId for extentions.
+- [`0bbd13a9a9c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0bbd13a9a9c) - Temporarily disabling VR tests (ED-13530)
+- Updated dependencies
+
 ## 80.0.0
 
 ### Minor Changes

package/dist/cjs/react/index.js

@@ -220,6 +220,9 @@ var ReactSerializer = /*#__PURE__*/function () {
         case 'mediaGroup':
           return this.getMediaGroupProps(node);
 
+        case 'mediaInline':
+          return this.getMediaInlineProps(node);
+
         case 'mediaSingle':
           return this.getMediaSingleProps(node, path);
 
@@ -469,12 +472,20 @@ var ReactSerializer = /*#__PURE__*/function () {
   }, {
     key: "getMediaGroupProps",
     value: function getMediaGroupProps(node) {
+      var _this$media;
+
       return _objectSpread(_objectSpread({}, this.getProps(node)), {}, {
         shouldOpenMediaViewer: this.shouldOpenMediaViewer,
         allowAltTextOnImages: this.allowAltTextOnImages,
-        featureFlags: this.media && this.media.featureFlags
+        featureFlags: this.media && this.media.featureFlags,
+        enableDownloadButton: (_this$media = this.media) === null || _this$media === void 0 ? void 0 : _this$media.enableDownloadButton
       });
     }
+  }, {
+    key: "getMediaInlineProps",
+    value: function getMediaInlineProps(node) {
+      return _objectSpread({}, this.getProps(node));
+    }
   }, {
     key: "getTaskItemProps",
     value: function getTaskItemProps(node) {

package/dist/cjs/react/nodes/index.js

@@ -162,7 +162,7 @@ Object.defineProperty(exports, "EmbedCard", {
     return _embedCard.default;
   }
 });
-exports.TaskItem = exports.Status = exports.Mention = exports.MediaGroup = exports.Media = exports.InlineCard = exports.Expand = exports.Emoji = exports.DecisionItem = exports.Date = exports.CodeBlock = exports.BlockCard = exports.isEmojiDoc = exports.isTextWrapper = exports.isText = exports.mergeTextNodes = exports.toReact = exports.nodeToReact = void 0;
+exports.TaskItem = exports.Status = exports.Mention = exports.MediaInline = exports.MediaGroup = exports.Media = exports.InlineCard = exports.Expand = exports.Emoji = exports.DecisionItem = exports.Date = exports.CodeBlock = exports.BlockCard = exports.isEmojiDoc = exports.isTextWrapper = exports.isText = exports.mergeTextNodes = exports.toReact = exports.nodeToReact = void 0;
 
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 
@@ -354,6 +354,19 @@ var MediaGroup = (0, _reactLoadable.default)({
   }
 });
 exports.MediaGroup = MediaGroup;
+var MediaInline = (0, _reactLoadable.default)({
+  loader: function loader() {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('./mediaInline'));
+    }).then(function (mod) {
+      return mod.default;
+    });
+  },
+  loading: function loading() {
+    return null;
+  }
+});
+exports.MediaInline = MediaInline;
 var Mention = (0, _reactLoadable.default)({
   loader: function loader() {
     return Promise.resolve().then(function () {
@@ -402,6 +415,7 @@ var nodeToReact = {
   listItem: _listItem.default,
   media: Media,
   mediaGroup: MediaGroup,
+  mediaInline: MediaInline,
   mediaSingle: _mediaSingle.default,
   mention: Mention,
   orderedList: _orderedList.default,

package/dist/cjs/react/nodes/media.js

@@ -68,7 +68,8 @@ var Media = /*#__PURE__*/function (_PureComponent) {
           allowAltTextOnImages = _this$props.allowAltTextOnImages,
           alt = _this$props.alt,
           featureFlags = _this$props.featureFlags,
-          allowMediaViewer = _this$props.shouldOpenMediaViewer;
+          allowMediaViewer = _this$props.shouldOpenMediaViewer,
+          enableDownloadButton = _this$props.enableDownloadButton;
 
       var linkMark = _this.props.marks.find(_this.props.isLinkMark);
 
@@ -83,7 +84,8 @@ var Media = /*#__PURE__*/function (_PureComponent) {
         shouldOpenMediaViewer: shouldOpenMediaViewer,
         eventHandlers: eventHandlers,
         alt: allowAltTextOnImages ? alt : undefined,
-        featureFlags: featureFlags
+        featureFlags: featureFlags,
+        shouldEnableDownloadButton: enableDownloadButton
       }));
 
       return linkHref ? /*#__PURE__*/_react.default.createElement(_editorCommon.MediaLink, {

package/dist/cjs/react/nodes/mediaGroup.js

@@ -123,7 +123,8 @@ var MediaGroup = /*#__PURE__*/function (_PureComponent) {
         resizeMode: 'stretchy-fit',
         cardDimensions: _mediaCard.defaultImageCardDimensions,
         useInlinePlayer: false,
-        featureFlags: this.props.featureFlags
+        featureFlags: this.props.featureFlags,
+        enableDownloadButton: this.props.enableDownloadButton
       });
     }
   }, {
@@ -146,7 +147,8 @@ var MediaGroup = /*#__PURE__*/function (_PureComponent) {
             onClick: onClick
           }
         }),
-        featureFlags: this.props.featureFlags
+        featureFlags: this.props.featureFlags,
+        enableDownloadButton: this.props.enableDownloadButton
       });
     }
   }, {
@@ -182,7 +184,8 @@ var MediaGroup = /*#__PURE__*/function (_PureComponent) {
 
           default:
             return /*#__PURE__*/_react.default.cloneElement(child, {
-              featureFlags: _this2.props.featureFlags
+              featureFlags: _this2.props.featureFlags,
+              enableDownloadButton: _this2.props.enableDownloadButton
             });
         }
       }));

package/dist/cjs/react/nodes/mediaInline.js

@@ -0,0 +1,104 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.RenderMediaInline = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _mediaCard = require("@atlaskit/media-card");
+
+var _editorCommon = require("@atlaskit/editor-common");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var RenderMediaInline = function RenderMediaInline(props) {
+  var mediaProvider = props.mediaProvider;
+
+  var _useState = (0, _react.useState)({}),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      viewMediaClientConfigState = _useState2[0],
+      setViewMediaClientConfigState = _useState2[1];
+
+  (0, _react.useEffect)(function () {
+    updateViewMediaClientConfigState(mediaProvider);
+  }, [mediaProvider]);
+
+  var updateViewMediaClientConfigState = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(mediaProvider) {
+      var mediaClientConfig;
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!mediaProvider) {
+                _context.next = 5;
+                break;
+              }
+
+              _context.next = 3;
+              return mediaProvider;
+
+            case 3:
+              mediaClientConfig = _context.sent;
+              setViewMediaClientConfigState(mediaClientConfig.viewMediaClientConfig);
+
+            case 5:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+
+    return function updateViewMediaClientConfigState(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  return /*#__PURE__*/_react.default.createElement(_mediaCard.MediaInlineCard, {
+    identifier: props.identifier,
+    shouldOpenMediaViewer: true,
+    mediaClientConfig: viewMediaClientConfigState
+  });
+};
+
+exports.RenderMediaInline = RenderMediaInline;
+
+var MediaInline = function MediaInline(props) {
+  var collection = props.collection,
+      id = props.id,
+      providers = props.providers;
+  var identifier = {
+    id: id,
+    mediaItemType: 'file',
+    collectionName: collection
+  };
+  return /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(_editorCommon.WithProviders, {
+    providers: ['mediaProvider'],
+    providerFactory: providers,
+    renderNode: function renderNode(providers) {
+      var mediaProvider = providers.mediaProvider;
+      return /*#__PURE__*/_react.default.createElement(RenderMediaInline, {
+        identifier: identifier,
+        mediaProvider: mediaProvider
+      });
+    }
+  }));
+};
+
+var _default = MediaInline;
+exports.default = _default;

package/dist/cjs/react/nodes/panel.js

@@ -93,7 +93,7 @@ var Panel = function Panel(props) {
     var icon = getIcon();
 
     if (icon) {
-      return /*#__PURE__*/_react.default.createElement("span", {
+      return /*#__PURE__*/_react.default.createElement("div", {
         className: _editorCommon.PanelSharedCssClassName.icon
       }, icon);
     }
@@ -102,6 +102,8 @@ var Panel = function Panel(props) {
   return /*#__PURE__*/_react.default.createElement(PanelStyled, {
     className: _editorCommon.PanelSharedCssClassName.prefix,
     "data-panel-type": panelType,
+    "data-panel-color": panelColor,
+    "data-panel-icon": panelIcon,
     backgroundColor: panelColor
   }, renderIcon(), /*#__PURE__*/_react.default.createElement("div", {
     className: _editorCommon.PanelSharedCssClassName.content

package/dist/cjs/react/nodes/table/colgroup.js

@@ -113,12 +113,12 @@ var Colgroup = function Colgroup(props) {
     }
   } // scaling down
   else if (renderWidth < tableWidth) {
-      scaleDownPercent = calcScalePercent({
-        renderWidth: renderWidth,
-        tableWidth: tableWidth,
-        maxScale: MAX_SCALING_PERCENT
-      });
-    }
+    scaleDownPercent = calcScalePercent({
+      renderWidth: renderWidth,
+      tableWidth: tableWidth,
+      maxScale: MAX_SCALING_PERCENT
+    });
+  }
 
   return /*#__PURE__*/_react.default.createElement("colgroup", null, isNumberColumnEnabled && /*#__PURE__*/_react.default.createElement("col", {
     style: {

package/dist/cjs/ui/ExtensionRenderer.js

@@ -67,13 +67,15 @@ var ExtensionRenderer = /*#__PURE__*/function (_React$Component) {
           parameters = _this$props.parameters,
           content = _this$props.content,
           text = _this$props.text,
-          type = _this$props.type;
+          type = _this$props.type,
+          localId = _this$props.localId;
       var node = {
         type: type,
         extensionKey: extensionKey,
         extensionType: extensionType,
         parameters: parameters,
-        content: content || text
+        content: content || text,
+        localId: localId
       };
       var result = null;
 

package/dist/cjs/ui/MediaCard.js

@@ -345,7 +345,8 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
           useInlinePlayer = _this$props5.useInlinePlayer,
           originalDimensions = _this$props5.originalDimensions,
           forceOpenMediaViewer = _this$props5.shouldOpenMediaViewer,
-          featureFlags = _this$props5.featureFlags;
+          featureFlags = _this$props5.featureFlags,
+          shouldEnableDownloadButton = _this$props5.shouldEnableDownloadButton;
       var isMobile = rendererAppearance === 'mobile';
       var shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
       var isInlinePlayer = isMobile ? false : shouldPlayInline;
@@ -400,7 +401,8 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
         mediaViewerDataSource: {
           list: Array.from(mediaIdentifierMap.values())
         },
-        featureFlags: featureFlags
+        featureFlags: featureFlags,
+        shouldEnableDownloadButton: shouldEnableDownloadButton
       }));
     }
   }]);

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

@@ -223,7 +223,7 @@ var Renderer = /*#__PURE__*/function (_PureComponent) {
       var nextMedia = nextProps.media || {};
       var media = this.props.media || {};
 
-      if (nextProps.portal !== this.props.portal || nextProps.appearance !== this.props.appearance || nextProps.stickyHeaders !== this.props.stickyHeaders || nextProps.disableActions !== this.props.disableActions || nextProps.allowHeadingAnchorLinks !== this.props.allowHeadingAnchorLinks || nextMedia.allowLinking !== media.allowLinking) {
+      if (nextProps.portal !== this.props.portal || nextProps.appearance !== this.props.appearance || nextProps.stickyHeaders !== this.props.stickyHeaders || nextProps.disableActions !== this.props.disableActions || nextProps.UNSAFE_allowCustomPanels !== this.props.UNSAFE_allowCustomPanels || nextProps.allowHeadingAnchorLinks !== this.props.allowHeadingAnchorLinks || nextMedia.allowLinking !== media.allowLinking) {
         this.serializer = new _.ReactSerializer(this.deriveSerializerProps(nextProps));
       }
     }

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "80.0.0",
+	"version": "82.0.0",
 	"sideEffects": false
 }

package/dist/es2019/react/index.js

@@ -192,6 +192,9 @@ export default class ReactSerializer {
       case 'mediaGroup':
         return this.getMediaGroupProps(node);
 
+      case 'mediaInline':
+        return this.getMediaInlineProps(node);
+
       case 'mediaSingle':
         return this.getMediaSingleProps(node, path);
 
@@ -400,10 +403,18 @@ export default class ReactSerializer {
   }
 
   getMediaGroupProps(node) {
+    var _this$media;
+
     return { ...this.getProps(node),
       shouldOpenMediaViewer: this.shouldOpenMediaViewer,
       allowAltTextOnImages: this.allowAltTextOnImages,
-      featureFlags: this.media && this.media.featureFlags
+      featureFlags: this.media && this.media.featureFlags,
+      enableDownloadButton: (_this$media = this.media) === null || _this$media === void 0 ? void 0 : _this$media.enableDownloadButton
+    };
+  }
+
+  getMediaInlineProps(node) {
+    return { ...this.getProps(node)
     };
   }
 

package/dist/es2019/react/nodes/index.js

@@ -85,6 +85,12 @@ const MediaGroup = Loadable({
   './mediaGroup').then(mod => mod.default),
   loading: () => null
 });
+const MediaInline = Loadable({
+  loader: () => import(
+  /* webpackChunkName: "@atlaskit-internal_renderer-node_MediaInline" */
+  './mediaInline').then(mod => mod.default),
+  loading: () => null
+});
 const Mention = Loadable({
   loader: () => import(
   /* webpackChunkName: "@atlaskit-internal_renderer-node_Mention" */
@@ -119,6 +125,7 @@ export const nodeToReact = {
   listItem: ListItem,
   media: Media,
   mediaGroup: MediaGroup,
+  mediaInline: MediaInline,
   mediaSingle: MediaSingle,
   mention: Mention,
   orderedList: OrderedList,
@@ -278,4 +285,4 @@ const isEmojiBlock = pnode => {
   return emojiCount > 0;
 };
 
-export { Blockquote, BodiedExtension, BulletList, BlockCard, Caption, CodeBlock, Date, DecisionItem, DecisionList, Doc, DocWithSelectAllTrap, Emoji, Extension, Expand, HardBreak, Heading, ListItem, InlineCard, InlineExtension, LayoutSection, LayoutColumn, Media, MediaGroup, MediaSingle, Mention, OrderedList, Panel, Paragraph, Placeholder, Rule, Status, TaskItem, TaskList, Table, TableCell, TableRow, UnknownBlock, EmbedCard };
+export { Blockquote, BodiedExtension, BulletList, BlockCard, Caption, CodeBlock, Date, DecisionItem, DecisionList, Doc, DocWithSelectAllTrap, Emoji, Extension, Expand, HardBreak, Heading, ListItem, InlineCard, InlineExtension, LayoutSection, LayoutColumn, Media, MediaGroup, MediaInline, MediaSingle, Mention, OrderedList, Panel, Paragraph, Placeholder, Rule, Status, TaskItem, TaskList, Table, TableCell, TableRow, UnknownBlock, EmbedCard };

package/dist/es2019/react/nodes/media.js

@@ -20,7 +20,8 @@ export default class Media extends PureComponent {
         allowAltTextOnImages,
         alt,
         featureFlags,
-        shouldOpenMediaViewer: allowMediaViewer
+        shouldOpenMediaViewer: allowMediaViewer,
+        enableDownloadButton
       } = this.props;
       const linkMark = this.props.marks.find(this.props.isLinkMark);
       const linkHref = linkMark === null || linkMark === void 0 ? void 0 : linkMark.attrs.href;
@@ -33,7 +34,8 @@ export default class Media extends PureComponent {
         shouldOpenMediaViewer: shouldOpenMediaViewer,
         eventHandlers: eventHandlers,
         alt: allowAltTextOnImages ? alt : undefined,
-        featureFlags: featureFlags
+        featureFlags: featureFlags,
+        shouldEnableDownloadButton: enableDownloadButton
       }));
       return linkHref ? /*#__PURE__*/React.createElement(MediaLink, {
         href: linkHref,

package/dist/es2019/react/nodes/mediaGroup.js

@@ -68,7 +68,8 @@ export default class MediaGroup extends PureComponent {
       resizeMode: 'stretchy-fit',
       cardDimensions: defaultImageCardDimensions,
       useInlinePlayer: false,
-      featureFlags: this.props.featureFlags
+      featureFlags: this.props.featureFlags,
+      enableDownloadButton: this.props.enableDownloadButton
     });
   }
 
@@ -89,7 +90,8 @@ export default class MediaGroup extends PureComponent {
           onClick
         }
       },
-      featureFlags: this.props.featureFlags
+      featureFlags: this.props.featureFlags,
+      enableDownloadButton: this.props.enableDownloadButton
     });
   }
 
@@ -119,7 +121,8 @@ export default class MediaGroup extends PureComponent {
 
         default:
           return /*#__PURE__*/React.cloneElement(child, {
-            featureFlags: this.props.featureFlags
+            featureFlags: this.props.featureFlags,
+            enableDownloadButton: this.props.enableDownloadButton
           });
       }
     }));

package/dist/es2019/react/nodes/mediaInline.js

@@ -0,0 +1,53 @@
+import React, { useEffect, useState } from 'react';
+import { MediaInlineCard } from '@atlaskit/media-card';
+import { WithProviders } from '@atlaskit/editor-common';
+export const RenderMediaInline = props => {
+  const {
+    mediaProvider
+  } = props;
+  const [viewMediaClientConfigState, setViewMediaClientConfigState] = useState({});
+  useEffect(() => {
+    updateViewMediaClientConfigState(mediaProvider);
+  }, [mediaProvider]);
+
+  const updateViewMediaClientConfigState = async mediaProvider => {
+    if (mediaProvider) {
+      const mediaClientConfig = await mediaProvider;
+      setViewMediaClientConfigState(mediaClientConfig.viewMediaClientConfig);
+    }
+  };
+
+  return /*#__PURE__*/React.createElement(MediaInlineCard, {
+    identifier: props.identifier,
+    shouldOpenMediaViewer: true,
+    mediaClientConfig: viewMediaClientConfigState
+  });
+};
+
+const MediaInline = props => {
+  const {
+    collection,
+    id,
+    providers
+  } = props;
+  const identifier = {
+    id,
+    mediaItemType: 'file',
+    collectionName: collection
+  };
+  return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(WithProviders, {
+    providers: ['mediaProvider'],
+    providerFactory: providers,
+    renderNode: providers => {
+      const {
+        mediaProvider
+      } = providers;
+      return /*#__PURE__*/React.createElement(RenderMediaInline, {
+        identifier: identifier,
+        mediaProvider: mediaProvider
+      });
+    }
+  }));
+};
+
+export default MediaInline;

package/dist/es2019/react/nodes/panel.js

@@ -77,7 +77,7 @@ const Panel = props => {
     const icon = getIcon();
 
     if (icon) {
-      return /*#__PURE__*/React.createElement("span", {
+      return /*#__PURE__*/React.createElement("div", {
         className: PanelSharedCssClassName.icon
       }, icon);
     }
@@ -86,6 +86,8 @@ const Panel = props => {
   return /*#__PURE__*/React.createElement(PanelStyled, {
     className: PanelSharedCssClassName.prefix,
     "data-panel-type": panelType,
+    "data-panel-color": panelColor,
+    "data-panel-icon": panelIcon,
     backgroundColor: panelColor
   }, renderIcon(), /*#__PURE__*/React.createElement("div", {
     className: PanelSharedCssClassName.content

package/dist/es2019/react/nodes/table/colgroup.js

@@ -98,12 +98,12 @@ export const Colgroup = props => {
     }
   } // scaling down
   else if (renderWidth < tableWidth) {
-      scaleDownPercent = calcScalePercent({
-        renderWidth,
-        tableWidth,
-        maxScale: MAX_SCALING_PERCENT
-      });
-    }
+    scaleDownPercent = calcScalePercent({
+      renderWidth,
+      tableWidth,
+      maxScale: MAX_SCALING_PERCENT
+    });
+  }
 
   return /*#__PURE__*/React.createElement("colgroup", null, isNumberColumnEnabled && /*#__PURE__*/React.createElement("col", {
     style: {

package/dist/es2019/ui/ExtensionRenderer.js

@@ -33,14 +33,16 @@ export default class ExtensionRenderer extends React.Component {
         parameters,
         content,
         text,
-        type
+        type,
+        localId
       } = this.props;
       const node = {
         type,
         extensionKey,
         extensionType,
         parameters,
-        content: content || text
+        content: content || text,
+        localId
       };
       let result = null;
 

package/dist/es2019/ui/MediaCard.js

@@ -230,7 +230,8 @@ export class MediaCardInternal extends Component {
       useInlinePlayer,
       originalDimensions,
       shouldOpenMediaViewer: forceOpenMediaViewer,
-      featureFlags
+      featureFlags,
+      shouldEnableDownloadButton
     } = this.props;
     const isMobile = rendererAppearance === 'mobile';
     const shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
@@ -286,7 +287,8 @@ export class MediaCardInternal extends Component {
       mediaViewerDataSource: {
         list: Array.from(mediaIdentifierMap.values())
       },
-      featureFlags: featureFlags
+      featureFlags: featureFlags,
+      shouldEnableDownloadButton: shouldEnableDownloadButton
     }));
   }
 

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

@@ -147,7 +147,7 @@ export class Renderer extends PureComponent {
     const nextMedia = nextProps.media || {};
     const media = this.props.media || {};
 
-    if (nextProps.portal !== this.props.portal || nextProps.appearance !== this.props.appearance || nextProps.stickyHeaders !== this.props.stickyHeaders || nextProps.disableActions !== this.props.disableActions || nextProps.allowHeadingAnchorLinks !== this.props.allowHeadingAnchorLinks || nextMedia.allowLinking !== media.allowLinking) {
+    if (nextProps.portal !== this.props.portal || nextProps.appearance !== this.props.appearance || nextProps.stickyHeaders !== this.props.stickyHeaders || nextProps.disableActions !== this.props.disableActions || nextProps.UNSAFE_allowCustomPanels !== this.props.UNSAFE_allowCustomPanels || nextProps.allowHeadingAnchorLinks !== this.props.allowHeadingAnchorLinks || nextMedia.allowLinking !== media.allowLinking) {
       this.serializer = new ReactSerializer(this.deriveSerializerProps(nextProps));
     }
   }

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "80.0.0",
+	"version": "82.0.0",
 	"sideEffects": false
 }

package/dist/esm/react/index.js

@@ -212,6 +212,9 @@ var ReactSerializer = /*#__PURE__*/function () {
         case 'mediaGroup':
           return this.getMediaGroupProps(node);
 
+        case 'mediaInline':
+          return this.getMediaInlineProps(node);
+
         case 'mediaSingle':
           return this.getMediaSingleProps(node, path);
 
@@ -461,12 +464,20 @@ var ReactSerializer = /*#__PURE__*/function () {
   }, {
     key: "getMediaGroupProps",
     value: function getMediaGroupProps(node) {
+      var _this$media;
+
       return _objectSpread(_objectSpread({}, this.getProps(node)), {}, {
         shouldOpenMediaViewer: this.shouldOpenMediaViewer,
         allowAltTextOnImages: this.allowAltTextOnImages,
-        featureFlags: this.media && this.media.featureFlags
+        featureFlags: this.media && this.media.featureFlags,
+        enableDownloadButton: (_this$media = this.media) === null || _this$media === void 0 ? void 0 : _this$media.enableDownloadButton
       });
     }
+  }, {
+    key: "getMediaInlineProps",
+    value: function getMediaInlineProps(node) {
+      return _objectSpread({}, this.getProps(node));
+    }
   }, {
     key: "getTaskItemProps",
     value: function getTaskItemProps(node) {

package/dist/esm/react/nodes/index.js

@@ -145,6 +145,18 @@ var MediaGroup = Loadable({
     return null;
   }
 });
+var MediaInline = Loadable({
+  loader: function loader() {
+    return import(
+    /* webpackChunkName: "@atlaskit-internal_renderer-node_MediaInline" */
+    './mediaInline').then(function (mod) {
+      return mod.default;
+    });
+  },
+  loading: function loading() {
+    return null;
+  }
+});
 var Mention = Loadable({
   loader: function loader() {
     return import(
@@ -191,6 +203,7 @@ export var nodeToReact = {
   listItem: ListItem,
   media: Media,
   mediaGroup: MediaGroup,
+  mediaInline: MediaInline,
   mediaSingle: MediaSingle,
   mention: Mention,
   orderedList: OrderedList,
@@ -354,4 +367,4 @@ var isEmojiBlock = function isEmojiBlock(pnode) {
   return emojiCount > 0;
 };
 
-export { Blockquote, BodiedExtension, BulletList, BlockCard, Caption, CodeBlock, Date, DecisionItem, DecisionList, Doc, DocWithSelectAllTrap, Emoji, Extension, Expand, HardBreak, Heading, ListItem, InlineCard, InlineExtension, LayoutSection, LayoutColumn, Media, MediaGroup, MediaSingle, Mention, OrderedList, Panel, Paragraph, Placeholder, Rule, Status, TaskItem, TaskList, Table, TableCell, TableRow, UnknownBlock, EmbedCard };
+export { Blockquote, BodiedExtension, BulletList, BlockCard, Caption, CodeBlock, Date, DecisionItem, DecisionList, Doc, DocWithSelectAllTrap, Emoji, Extension, Expand, HardBreak, Heading, ListItem, InlineCard, InlineExtension, LayoutSection, LayoutColumn, Media, MediaGroup, MediaInline, MediaSingle, Mention, OrderedList, Panel, Paragraph, Placeholder, Rule, Status, TaskItem, TaskList, Table, TableCell, TableRow, UnknownBlock, EmbedCard };

package/dist/esm/react/nodes/media.js

@@ -43,7 +43,8 @@ var Media = /*#__PURE__*/function (_PureComponent) {
           allowAltTextOnImages = _this$props.allowAltTextOnImages,
           alt = _this$props.alt,
           featureFlags = _this$props.featureFlags,
-          allowMediaViewer = _this$props.shouldOpenMediaViewer;
+          allowMediaViewer = _this$props.shouldOpenMediaViewer,
+          enableDownloadButton = _this$props.enableDownloadButton;
 
       var linkMark = _this.props.marks.find(_this.props.isLinkMark);
 
@@ -57,7 +58,8 @@ var Media = /*#__PURE__*/function (_PureComponent) {
         shouldOpenMediaViewer: shouldOpenMediaViewer,
         eventHandlers: eventHandlers,
         alt: allowAltTextOnImages ? alt : undefined,
-        featureFlags: featureFlags
+        featureFlags: featureFlags,
+        shouldEnableDownloadButton: enableDownloadButton
       }));
       return linkHref ? /*#__PURE__*/React.createElement(MediaLink, {
         href: linkHref,

package/dist/esm/react/nodes/mediaGroup.js

@@ -105,7 +105,8 @@ var MediaGroup = /*#__PURE__*/function (_PureComponent) {
         resizeMode: 'stretchy-fit',
         cardDimensions: defaultImageCardDimensions,
         useInlinePlayer: false,
-        featureFlags: this.props.featureFlags
+        featureFlags: this.props.featureFlags,
+        enableDownloadButton: this.props.enableDownloadButton
       });
     }
   }, {
@@ -128,7 +129,8 @@ var MediaGroup = /*#__PURE__*/function (_PureComponent) {
             onClick: onClick
           }
         }),
-        featureFlags: this.props.featureFlags
+        featureFlags: this.props.featureFlags,
+        enableDownloadButton: this.props.enableDownloadButton
       });
     }
   }, {
@@ -162,7 +164,8 @@ var MediaGroup = /*#__PURE__*/function (_PureComponent) {
 
           default:
             return /*#__PURE__*/React.cloneElement(child, {
-              featureFlags: _this2.props.featureFlags
+              featureFlags: _this2.props.featureFlags,
+              enableDownloadButton: _this2.props.enableDownloadButton
             });
         }
       }));

package/dist/esm/react/nodes/mediaInline.js

@@ -0,0 +1,80 @@
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useEffect, useState } from 'react';
+import { MediaInlineCard } from '@atlaskit/media-card';
+import { WithProviders } from '@atlaskit/editor-common';
+export var RenderMediaInline = function RenderMediaInline(props) {
+  var mediaProvider = props.mediaProvider;
+
+  var _useState = useState({}),
+      _useState2 = _slicedToArray(_useState, 2),
+      viewMediaClientConfigState = _useState2[0],
+      setViewMediaClientConfigState = _useState2[1];
+
+  useEffect(function () {
+    updateViewMediaClientConfigState(mediaProvider);
+  }, [mediaProvider]);
+
+  var updateViewMediaClientConfigState = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(mediaProvider) {
+      var mediaClientConfig;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!mediaProvider) {
+                _context.next = 5;
+                break;
+              }
+
+              _context.next = 3;
+              return mediaProvider;
+
+            case 3:
+              mediaClientConfig = _context.sent;
+              setViewMediaClientConfigState(mediaClientConfig.viewMediaClientConfig);
+
+            case 5:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+
+    return function updateViewMediaClientConfigState(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  return /*#__PURE__*/React.createElement(MediaInlineCard, {
+    identifier: props.identifier,
+    shouldOpenMediaViewer: true,
+    mediaClientConfig: viewMediaClientConfigState
+  });
+};
+
+var MediaInline = function MediaInline(props) {
+  var collection = props.collection,
+      id = props.id,
+      providers = props.providers;
+  var identifier = {
+    id: id,
+    mediaItemType: 'file',
+    collectionName: collection
+  };
+  return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(WithProviders, {
+    providers: ['mediaProvider'],
+    providerFactory: providers,
+    renderNode: function renderNode(providers) {
+      var mediaProvider = providers.mediaProvider;
+      return /*#__PURE__*/React.createElement(RenderMediaInline, {
+        identifier: identifier,
+        mediaProvider: mediaProvider
+      });
+    }
+  }));
+};
+
+export default MediaInline;

package/dist/esm/react/nodes/panel.js

@@ -72,7 +72,7 @@ var Panel = function Panel(props) {
     var icon = getIcon();
 
     if (icon) {
-      return /*#__PURE__*/React.createElement("span", {
+      return /*#__PURE__*/React.createElement("div", {
         className: PanelSharedCssClassName.icon
       }, icon);
     }
@@ -81,6 +81,8 @@ var Panel = function Panel(props) {
   return /*#__PURE__*/React.createElement(PanelStyled, {
     className: PanelSharedCssClassName.prefix,
     "data-panel-type": panelType,
+    "data-panel-color": panelColor,
+    "data-panel-icon": panelIcon,
     backgroundColor: panelColor
   }, renderIcon(), /*#__PURE__*/React.createElement("div", {
     className: PanelSharedCssClassName.content

package/dist/esm/react/nodes/table/colgroup.js

@@ -97,12 +97,12 @@ export var Colgroup = function Colgroup(props) {
     }
   } // scaling down
   else if (renderWidth < tableWidth) {
-      scaleDownPercent = calcScalePercent({
-        renderWidth: renderWidth,
-        tableWidth: tableWidth,
-        maxScale: MAX_SCALING_PERCENT
-      });
-    }
+    scaleDownPercent = calcScalePercent({
+      renderWidth: renderWidth,
+      tableWidth: tableWidth,
+      maxScale: MAX_SCALING_PERCENT
+    });
+  }
 
   return /*#__PURE__*/React.createElement("colgroup", null, isNumberColumnEnabled && /*#__PURE__*/React.createElement("col", {
     style: {

package/dist/esm/ui/ExtensionRenderer.js

@@ -55,13 +55,15 @@ var ExtensionRenderer = /*#__PURE__*/function (_React$Component) {
           parameters = _this$props.parameters,
           content = _this$props.content,
           text = _this$props.text,
-          type = _this$props.type;
+          type = _this$props.type,
+          localId = _this$props.localId;
       var node = {
         type: type,
         extensionKey: extensionKey,
         extensionType: extensionType,
         parameters: parameters,
-        content: content || text
+        content: content || text,
+        localId: localId
       };
       var result = null;
 

package/dist/esm/ui/MediaCard.js

@@ -317,7 +317,8 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
           useInlinePlayer = _this$props5.useInlinePlayer,
           originalDimensions = _this$props5.originalDimensions,
           forceOpenMediaViewer = _this$props5.shouldOpenMediaViewer,
-          featureFlags = _this$props5.featureFlags;
+          featureFlags = _this$props5.featureFlags,
+          shouldEnableDownloadButton = _this$props5.shouldEnableDownloadButton;
       var isMobile = rendererAppearance === 'mobile';
       var shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
       var isInlinePlayer = isMobile ? false : shouldPlayInline;
@@ -372,7 +373,8 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
         mediaViewerDataSource: {
           list: Array.from(mediaIdentifierMap.values())
         },
-        featureFlags: featureFlags
+        featureFlags: featureFlags,
+        shouldEnableDownloadButton: shouldEnableDownloadButton
       }));
     }
   }]);

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

@@ -174,7 +174,7 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
       var nextMedia = nextProps.media || {};
       var media = this.props.media || {};
 
-      if (nextProps.portal !== this.props.portal || nextProps.appearance !== this.props.appearance || nextProps.stickyHeaders !== this.props.stickyHeaders || nextProps.disableActions !== this.props.disableActions || nextProps.allowHeadingAnchorLinks !== this.props.allowHeadingAnchorLinks || nextMedia.allowLinking !== media.allowLinking) {
+      if (nextProps.portal !== this.props.portal || nextProps.appearance !== this.props.appearance || nextProps.stickyHeaders !== this.props.stickyHeaders || nextProps.disableActions !== this.props.disableActions || nextProps.UNSAFE_allowCustomPanels !== this.props.UNSAFE_allowCustomPanels || nextProps.allowHeadingAnchorLinks !== this.props.allowHeadingAnchorLinks || nextMedia.allowLinking !== media.allowLinking) {
         this.serializer = new ReactSerializer(this.deriveSerializerProps(nextProps));
       }
     }

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "80.0.0",
+	"version": "82.0.0",
 	"sideEffects": false
 }

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

@@ -88,6 +88,7 @@ export default class ReactSerializer implements Serializer<JSX.Element> {
     private getMediaProps;
     private getEmbedCardProps;
     private getMediaGroupProps;
+    private getMediaInlineProps;
     private getTaskItemProps;
     private getHardBreakProps;
     private getCodeBlockProps;

package/dist/types/react/nodes/bodiedExtension.d.ts

@@ -16,6 +16,7 @@ export interface Props {
     parameters?: any;
     content?: any;
     layout?: ExtensionLayout;
+    localId?: string;
 }
 declare const BodiedExtension: React.FunctionComponent<Props>;
 export default BodiedExtension;

package/dist/types/react/nodes/extension.d.ts

@@ -13,6 +13,7 @@ export interface Props {
     text?: string;
     parameters?: any;
     layout?: ExtensionLayout;
+    localId?: string;
 }
 declare type AllOrNone<T> = T | {
     [K in keyof T]?: never;
@@ -56,7 +57,8 @@ declare const _default: {
         componentWillMount?(): void;
         UNSAFE_componentWillMount?(): void;
         componentWillReceiveProps?(nextProps: Readonly<Props>, nextContext: any): void;
-        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Props>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<Props>, nextContext: any): void; /** We don't want this error to block renderer */
+        /** We keep rendering the default content */
         componentWillUpdate?(nextProps: Readonly<Props>, nextState: Readonly<import("@atlaskit/editor-common").OverflowShadowState>, nextContext: any): void;
         UNSAFE_componentWillUpdate?(nextProps: Readonly<Props>, nextState: Readonly<import("@atlaskit/editor-common").OverflowShadowState>, nextContext: any): void;
     };

package/dist/types/react/nodes/index.d.ts

@@ -60,6 +60,7 @@ declare const BlockCard: (React.ComponentClass<{
 }> & Loadable.LoadableComponent);
 declare const Media: (React.ComponentClass<import("./media").MediaProps, any> & Loadable.LoadableComponent) | (React.FunctionComponent<import("./media").MediaProps> & Loadable.LoadableComponent);
 declare const MediaGroup: (React.ComponentClass<import("./mediaGroup").MediaGroupProps, any> & Loadable.LoadableComponent) | (React.FunctionComponent<import("./mediaGroup").MediaGroupProps> & Loadable.LoadableComponent);
+declare const MediaInline: (React.ComponentClass<import("./mediaInline").MediaInlineProps, any> & Loadable.LoadableComponent) | (React.FunctionComponent<import("./mediaInline").MediaInlineProps> & Loadable.LoadableComponent);
 declare const Mention: (React.ComponentClass<import("./mention").Props, any> & Loadable.LoadableComponent) | (React.FunctionComponent<import("./mention").Props> & Loadable.LoadableComponent);
 declare const Expand: (React.ComponentClass<import("../../ui/Expand").ExpandProps, any> & Loadable.LoadableComponent) | (React.FunctionComponent<import("../../ui/Expand").ExpandProps> & Loadable.LoadableComponent);
 export declare const nodeToReact: {
@@ -93,5 +94,5 @@ export declare function isTextNode(node: Node | Mark): node is Node;
  * whose content satisfies the condition for an emoji block
  */
 export declare const isEmojiDoc: (doc: Fragment) => boolean;
-export { Blockquote, BodiedExtension, BulletList, BlockCard, Caption, CodeBlock, Date, DecisionItem, DecisionList, Doc, DocWithSelectAllTrap, Emoji, Extension, Expand, HardBreak, Heading, ListItem, InlineCard, InlineExtension, LayoutSection, LayoutColumn, Media, MediaGroup, MediaSingle, Mention, OrderedList, Panel, Paragraph, Placeholder, Rule, Status, TaskItem, TaskList, Table, TableCell, TableRow, UnknownBlock, EmbedCard, };
+export { Blockquote, BodiedExtension, BulletList, BlockCard, Caption, CodeBlock, Date, DecisionItem, DecisionList, Doc, DocWithSelectAllTrap, Emoji, Extension, Expand, HardBreak, Heading, ListItem, InlineCard, InlineExtension, LayoutSection, LayoutColumn, Media, MediaGroup, MediaInline, MediaSingle, Mention, OrderedList, Panel, Paragraph, Placeholder, Rule, Status, TaskItem, TaskList, Table, TableCell, TableRow, UnknownBlock, EmbedCard, };
 export type { BodiedExtensionProps, ExtensionProps, InlineExtensionProps };

package/dist/types/react/nodes/inlineExtension.d.ts

@@ -9,6 +9,7 @@ export interface Props {
     extensionKey: string;
     text?: string;
     parameters?: any;
+    localId?: string;
 }
 declare const InlineExtension: React.StatelessComponent<Props>;
 export default InlineExtension;

package/dist/types/react/nodes/media.d.ts

@@ -17,6 +17,7 @@ export declare type MediaProps = MediaCardProps & {
     fireAnalyticsEvent?: (event: AnalyticsEventPayload) => void;
     featureFlags?: MediaFeatureFlags;
     eventHandlers?: EventHandlers;
+    enableDownloadButton?: boolean;
 };
 export default class Media extends PureComponent<MediaProps, {}> {
     private renderCard;

package/dist/types/react/nodes/mediaGroup.d.ts

@@ -9,6 +9,7 @@ export interface MediaGroupProps {
     children?: React.ReactNode;
     eventHandlers?: EventHandlers;
     featureFlags?: MediaFeatureFlags;
+    enableDownloadButton?: boolean;
 }
 export interface MediaGroupState {
     animate: boolean;

package/dist/types/react/nodes/mediaInline.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { ProviderFactory } from '@atlaskit/editor-common';
+import { FileIdentifier } from '@atlaskit/media-client';
+import { MediaProvider } from '../../ui/MediaCard';
+export declare type RenderMediaInlineProps = {
+    identifier: FileIdentifier;
+    mediaProvider?: Promise<MediaProvider>;
+    children?: React.ReactNode;
+};
+export declare type MediaInlineProps = {
+    id: string;
+    collection?: string;
+    providers: ProviderFactory;
+};
+export declare const RenderMediaInline: React.FC<RenderMediaInlineProps>;
+declare const MediaInline: React.FC<MediaInlineProps>;
+export default MediaInline;

package/dist/types/types/mediaOptions.d.ts

@@ -1,5 +1,6 @@
 import { MediaFeatureFlags } from '@atlaskit/media-common';
 export interface MediaOptions {
     allowLinking?: boolean;
+    enableDownloadButton?: boolean;
     featureFlags?: MediaFeatureFlags;
 }

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

@@ -13,6 +13,7 @@ export interface Props {
     parameters?: any;
     content?: any;
     layout?: ExtensionLayout;
+    localId?: string;
     children: ({ result }: {
         result?: JSX.Element | null;
     }) => JSX.Element;
@@ -28,7 +29,7 @@ export default class ExtensionRenderer extends React.Component<Props, State> {
     UNSAFE_componentWillMount(): void;
     componentWillUnmount(): void;
     handleProvider: (name: keyof State, providerPromise?: Promise<any> | undefined) => void;
-    getNodeRenderer: typeof getNodeRenderer;
+    getNodeRenderer: import("memoize-one").MemoizedFn<typeof getNodeRenderer>;
     renderExtensionNode: (extensionProvider?: ExtensionProvider<any> | null | undefined) => JSX.Element;
     setupAndRenderExtensionNode: (providers: {
         extensionProvider?: Promise<ExtensionProvider<any>> | undefined;

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

@@ -37,6 +37,7 @@ export interface MediaCardProps {
     rendererContext?: RendererContext;
     alt?: string;
     featureFlags?: MediaFeatureFlags;
+    shouldEnableDownloadButton?: boolean;
 }
 export interface State {
     mediaClientConfig?: MediaClientConfig;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "80.0.0",
+  "version": "82.0.0",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -24,31 +24,30 @@
     }
   },
   "dependencies": {
-    "@atlaskit/adf-schema": "^19.0.0",
-    "@atlaskit/adf-utils": "^14.1.0",
+    "@atlaskit/adf-schema": "^19.3.0",
+    "@atlaskit/adf-utils": "^14.3.0",
     "@atlaskit/analytics-listeners": "^8.0.0",
     "@atlaskit/analytics-namespaced-context": "^6.3.0",
     "@atlaskit/analytics-next": "^8.2.0",
     "@atlaskit/button": "^16.1.0",
     "@atlaskit/code": "^14.1.0",
-    "@atlaskit/editor-common": "^59.1.0",
+    "@atlaskit/editor-common": "^60.2.0",
     "@atlaskit/editor-json-transformer": "^8.6.0",
-    "@atlaskit/editor-shared-styles": "^1.5.0",
-    "@atlaskit/icon": "^21.7.0",
-    "@atlaskit/media-card": "^70.10.0",
-    "@atlaskit/media-client": "^14.1.0",
-    "@atlaskit/media-common": "^2.8.0",
-    "@atlaskit/media-filmstrip": "^42.0.0",
+    "@atlaskit/editor-shared-styles": "^1.6.0",
+    "@atlaskit/icon": "^21.9.0",
+    "@atlaskit/media-card": "^72.0.0",
+    "@atlaskit/media-client": "^14.3.0",
+    "@atlaskit/media-common": "^2.9.0",
+    "@atlaskit/media-filmstrip": "^42.1.0",
     "@atlaskit/media-viewer": "^45.8.0",
-    "@atlaskit/mention": "^19.6.0",
     "@atlaskit/status": "^0.11.0",
     "@atlaskit/task-decision": "^17.2.0",
-    "@atlaskit/theme": "^11.4.0",
-    "@atlaskit/tooltip": "^17.4.0",
+    "@atlaskit/theme": "^12.0.0",
+    "@atlaskit/tooltip": "^17.5.0",
     "@atlaskit/width-detector": "^3.0.0",
     "@babel/runtime": "^7.0.0",
     "lodash": "^4.17.15",
-    "memoize-one": "^5.1.0",
+    "memoize-one": "^6.0.0",
     "prosemirror-model": "1.11.0",
     "prosemirror-transform": "1.2.8",
     "prosemirror-utils": "^1.0.0-0",
@@ -59,30 +58,31 @@
   },
   "peerDependencies": {
     "@atlaskit/media-core": "^32.2.0",
-    "@atlaskit/smart-card": "^16.0.0",
+    "@atlaskit/smart-card": "^16.2.0",
     "react": "^16.8.0",
     "react-dom": "^16.8.0",
     "styled-components": "^3.2.6"
   },
   "devDependencies": {
     "@atlaskit/analytics-gas-types": "^5.0.5",
-    "@atlaskit/avatar": "^20.4.0",
+    "@atlaskit/avatar": "^20.5.0",
     "@atlaskit/build-utils": "^2.6.2",
-    "@atlaskit/css-reset": "^6.1.0",
+    "@atlaskit/css-reset": "^6.2.0",
     "@atlaskit/docs": "*",
-    "@atlaskit/editor-core": "^148.0.0",
-    "@atlaskit/editor-test-helpers": "^15.3.0",
+    "@atlaskit/editor-core": "^151.0.0",
+    "@atlaskit/editor-test-helpers": "^15.5.0",
     "@atlaskit/field-range": "^9.0.0",
     "@atlaskit/logo": "^13.5.0",
     "@atlaskit/media-core": "^32.2.0",
     "@atlaskit/media-integration-test-helpers": "^2.5.0",
-    "@atlaskit/media-test-helpers": "^28.7.0",
+    "@atlaskit/media-test-helpers": "^28.8.0",
+    "@atlaskit/mention": "^19.7.0",
     "@atlaskit/navigation-next": "^9.0.0",
-    "@atlaskit/profilecard": "^15.0.0",
+    "@atlaskit/profilecard": "^15.8.0",
     "@atlaskit/radio": "^5.3.0",
-    "@atlaskit/smart-card": "^16.0.0",
+    "@atlaskit/smart-card": "^16.2.0",
     "@atlaskit/ssr": "^0.2.0",
-    "@atlaskit/util-data-test": "^15.0.0",
+    "@atlaskit/util-data-test": "^16.0.0",
     "@atlaskit/visual-regression": "*",
     "@atlaskit/webdriver-runner": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",