@atlaskit/renderer 108.17.4 → 108.19.0

package/dist/cjs/react/nodes/heading-anchor.js

@@ -26,13 +26,14 @@ var _reactIntlNext = require("react-intl-next");
 var _messages = require("../../messages");
 var _templateObject;
 var _excluded = ["children"];
+/** @jsx jsx */
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 var HeadingAnchorWrapperClassName = exports.HeadingAnchorWrapperClassName = 'heading-anchor-wrapper';
 var CopyAnchorWrapperWithRef = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var children = props.children,
     rest = (0, _objectWithoutProperties2.default)(props, _excluded);
-  return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({}, rest, {
+  return (0, _react2.jsx)("span", (0, _extends2.default)({}, rest, {
     className: HeadingAnchorWrapperClassName,
     ref: ref
   }), children);
@@ -97,12 +98,12 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
       _this.setTooltipState(_messages.headingAnchorLinkMessages.copyHeadingLinkToClipboard);
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderAnchorButton", function () {
-      return /*#__PURE__*/_react.default.createElement("button", {
+      return (0, _react2.jsx)("button", {
         css: copyAnchorButtonStyles,
         onMouseLeave: _this.resetMessage,
         onClick: _this.copyToClipboard,
         "aria-label": _this.state.tooltipMessage
-      }, /*#__PURE__*/_react.default.createElement(_link.default, {
+      }, (0, _react2.jsx)(_link.default, {
         label: _this.getCopyAriaLabel(),
         size: _this.props.level > 3 ? 'small' : 'medium',
         primaryColor: _this.state.isClicked ? "var(--ds-icon-selected, ".concat(_colors.B400, ")") : "var(--ds-icon-subtle, ".concat(_colors.N200, ")")
@@ -123,7 +124,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
         // We set the key to the message to ensure it remounts when the message
         // changes, so that it correctly repositions.
         // @see https://ecosystem.atlassian.net/projects/AK/queues/issue/AK-6548
-        return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+        return (0, _react2.jsx)(_tooltip.default, {
           tag: CopyAnchorWrapperWithRef,
           content: tooltipMessage,
           position: "top",

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

@@ -10,15 +10,16 @@ var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _ui = require("@atlaskit/editor-common/ui");
 var _templateObject;
+/** @jsx jsx */
 var layoutColumnClearMarginTopStyles = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n"])), _ui.clearNextSiblingMarginTopStyle, _ui.clearNextSiblingBlockMarkMarginTopStyle);
 function LayoutSection(props) {
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return (0, _react2.jsx)("div", {
     "data-layout-column": true,
     "data-column-width": props.width,
     style: {
       flexBasis: "".concat(props.width, "%")
     }
-  }, /*#__PURE__*/_react.default.createElement(_ui.WidthProvider, null, /*#__PURE__*/_react.default.createElement("div", {
+  }, (0, _react2.jsx)(_ui.WidthProvider, null, (0, _react2.jsx)("div", {
     css: layoutColumnClearMarginTopStyles
   }), props.children));
 }

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

@@ -15,6 +15,7 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
+var _react2 = require("@emotion/react");
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _analyticsNamespacedContext = require("@atlaskit/analytics-namespaced-context");
 var _providerFactory = require("@atlaskit/editor-common/provider-factory");
@@ -28,7 +29,7 @@ var _styles = require("./styles");
 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; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /** @jsx jsx */
 var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Media, _PureComponent);
   var _super = _createSuper(Media);
@@ -42,8 +43,7 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderCard", function () {
       var _borderMark$attrs$col, _borderMark$attrs$siz;
       var providers = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      var mediaProvider = providers.mediaProvider,
-        contextIdentifierProvider = providers.contextIdentifierProvider;
+      var contextIdentifierProvider = providers.contextIdentifierProvider;
       var _this$props = _this.props,
         allowAltTextOnImages = _this$props.allowAltTextOnImages,
         alt = _this$props.alt,
@@ -58,12 +58,11 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
       var linkHref = linkMark === null || linkMark === void 0 ? void 0 : linkMark.attrs.href;
       var eventHandlers = linkHref ? undefined : _this.props.eventHandlers;
       var shouldOpenMediaViewer = !linkHref && allowMediaViewer;
-      var mediaComponent = /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
+      var mediaComponent = (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
         data: (0, _defineProperty2.default)({}, _analyticsNamespacedContext.MEDIA_CONTEXT, {
           border: !!borderMark
         })
-      }, /*#__PURE__*/_react.default.createElement(_MediaCard.MediaCard, (0, _extends2.default)({
-        mediaProvider: mediaProvider,
+      }, (0, _react2.jsx)(_MediaCard.MediaCard, (0, _extends2.default)({
         contextIdentifierProvider: contextIdentifierProvider
       }, _this.props, {
         shouldOpenMediaViewer: shouldOpenMediaViewer,
@@ -74,15 +73,15 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
         ssr: ssr
       })));
       var paletteColorValue = (0, _editorPalette.hexToEditorBorderPaletteColor)(borderColor) || borderColor;
-      var mediaComponentWithBorder = borderMark ? /*#__PURE__*/_react.default.createElement("div", {
+      var mediaComponentWithBorder = borderMark ? (0, _react2.jsx)("div", {
         "data-mark-type": "border",
         "data-color": borderColor,
         "data-size": borderWidth,
         css: (0, _styles.borderStyle)(paletteColorValue, borderWidth)
-      }, /*#__PURE__*/_react.default.createElement(_ui.MediaBorderGapFiller, {
+      }, (0, _react2.jsx)(_ui.MediaBorderGapFiller, {
         borderColor: borderColor
       }), mediaComponent) : mediaComponent;
-      return linkHref ? /*#__PURE__*/_react.default.createElement("a", {
+      return linkHref ? (0, _react2.jsx)("a", {
         href: linkHref,
         rel: "noreferrer noopener",
         onClick: _this.handleMediaLinkClick,
@@ -124,7 +123,7 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
       if (!providers) {
         return this.renderCard();
       }
-      return /*#__PURE__*/_react.default.createElement(_providerFactory.WithProviders, {
+      return (0, _react2.jsx)(_providerFactory.WithProviders, {
         providers: ['mediaProvider', 'contextIdentifierProvider'],
         providerFactory: providers,
         renderNode: this.renderCard

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

@@ -18,6 +18,7 @@ var _providerFactory = require("@atlaskit/editor-common/provider-factory");
 var _mediaClientReact = require("@atlaskit/media-client-react");
 var _MediaCard = require("../../ui/MediaCard");
 var _reactIntlNext = require("react-intl-next");
+var _mediaInline = require("@atlaskit/editor-common/media-inline");
 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; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -28,21 +29,22 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
     clipboardAttrs = _ref.clipboardAttrs,
     mediaInlineProviders = _ref.mediaInlineProviders,
     collectionName = _ref.collection,
-    featureFlags = _ref.featureFlags,
     eventHandlers = _ref.eventHandlers,
-    identifier = _ref.identifier;
+    identifier = _ref.identifier,
+    alt = _ref.alt,
+    width = _ref.width,
+    height = _ref.height,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? '' : _ref$type;
   var _useState = (0, _react.useState)(),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     contextIdentifierProvider = _useState2[0],
     setContextIdentifierProvider = _useState2[1];
   var _useState3 = (0, _react.useState)(),
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    viewMediaClientConfigState = _useState4[0],
-    setViewMediaClientConfigState = _useState4[1];
-  var _useState5 = (0, _react.useState)(),
-    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-    fileState = _useState6[0],
-    setFileState = _useState6[1];
+    fileState = _useState4[0],
+    setFileState = _useState4[1];
+  var mediaClient = _react.default.useContext(_mediaClientReact.MediaClientContext);
   var updateContext = /*#__PURE__*/function () {
     var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(contextIdentifierProvider) {
       var resolvedContextID;
@@ -69,36 +71,40 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
     };
   }();
   var updateFileState = (0, _react.useCallback)( /*#__PURE__*/function () {
-    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(id, mediaClientConfig) {
-      var mediaClient, options, _fileState;
+    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(id) {
+      var options, _fileState;
       return _regenerator.default.wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
-            mediaClient = (0, _mediaClientReact.getMediaClient)(mediaClientConfig);
             options = {
               collectionName: collectionName
             };
-            _context2.prev = 2;
+            _context2.prev = 1;
+            if (!mediaClient) {
+              _context2.next = 7;
+              break;
+            }
             _context2.next = 5;
             return mediaClient.file.getCurrentState(id, options);
           case 5:
             _fileState = _context2.sent;
             setFileState(_fileState);
+          case 7:
             _context2.next = 11;
             break;
           case 9:
             _context2.prev = 9;
-            _context2.t0 = _context2["catch"](2);
+            _context2.t0 = _context2["catch"](1);
           case 11:
           case "end":
             return _context2.stop();
         }
-      }, _callee2, null, [[2, 9]]);
+      }, _callee2, null, [[1, 9]]);
     }));
-    return function (_x2, _x3) {
+    return function (_x2) {
       return _ref3.apply(this, arguments);
     };
-  }(), [collectionName]);
+  }(), [collectionName, mediaClient]);
   (0, _react.useEffect)(function () {
     var id = identifier.id;
     var nodeIsInCache = id && _MediaCard.mediaIdentifierMap.has(id);
@@ -112,44 +118,17 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
     };
   }, [identifier, collectionName]);
   (0, _react.useEffect)(function () {
-    var mediaProvider = mediaInlineProviders.mediaProvider,
-      contextIdentifierProvider = mediaInlineProviders.contextIdentifierProvider;
+    var contextIdentifierProvider = mediaInlineProviders.contextIdentifierProvider;
     var id = clipboardAttrs.id;
-    updateViewMediaClientConfigState(mediaProvider);
     updateContext(contextIdentifierProvider);
-    id && viewMediaClientConfigState && updateFileState(id, viewMediaClientConfigState);
-  }, [mediaInlineProviders, contextIdentifierProvider, clipboardAttrs, viewMediaClientConfigState, updateFileState]);
-  var updateViewMediaClientConfigState = /*#__PURE__*/function () {
-    var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(mediaProvider) {
-      var mediaClientConfig;
-      return _regenerator.default.wrap(function _callee3$(_context3) {
-        while (1) switch (_context3.prev = _context3.next) {
-          case 0:
-            if (!mediaProvider) {
-              _context3.next = 5;
-              break;
-            }
-            _context3.next = 3;
-            return mediaProvider;
-          case 3:
-            mediaClientConfig = _context3.sent;
-            setViewMediaClientConfigState(mediaClientConfig.viewMediaClientConfig);
-          case 5:
-          case "end":
-            return _context3.stop();
-        }
-      }, _callee3);
-    }));
-    return function updateViewMediaClientConfigState(_x4) {
-      return _ref4.apply(this, arguments);
-    };
-  }();
+    id && updateFileState(id);
+  }, [mediaInlineProviders, contextIdentifierProvider, clipboardAttrs, updateFileState]);
 
   /*
    * Only show the loading view if the media provider is not ready
    * prevents calling the media API before the provider is ready
    */
-  if (!viewMediaClientConfigState) {
+  if (!mediaClient) {
     return /*#__PURE__*/_react.default.createElement(_mediaUi.MediaInlineCardLoadingView, {
       message: "",
       isSelected: false
@@ -167,6 +146,15 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
   var mediaProvider = mediaInlineProviders.mediaProvider;
   var id = clipboardAttrs.id,
     collection = clipboardAttrs.collection;
+  if ((0, _mediaInline.shouldShowInlineImage)(type)) {
+    return /*#__PURE__*/_react.default.createElement(_mediaInline.MediaInlineImageCard, {
+      mediaClient: mediaClient,
+      identifier: identifier,
+      alt: alt,
+      width: width,
+      height: height
+    });
+  }
   return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({}, (0, _MediaCard.getClipboardAttrs)({
     id: id,
     collection: collection,
@@ -179,7 +167,7 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
     onClick: handleMediaInlineClick,
     shouldOpenMediaViewer: shouldOpenMediaViewer,
     shouldDisplayToolTip: shouldDisplayToolTip,
-    mediaClientConfig: viewMediaClientConfigState,
+    mediaClientConfig: mediaClient.mediaClientConfig,
     mediaViewerItems: Array.from(_MediaCard.mediaIdentifierMap.values())
   }) : /*#__PURE__*/_react.default.createElement(_mediaUi.MediaInlineCardErroredView, {
     message: (intl || (0, _reactIntlNext.createIntl)({
@@ -193,7 +181,11 @@ var MediaInline = function MediaInline(props) {
     providerFactory = props.providers,
     intl = props.intl,
     rendererAppearance = props.rendererAppearance,
-    featureFlags = props.featureFlags;
+    featureFlags = props.featureFlags,
+    fileType = props.type,
+    alt = props.alt,
+    width = props.width,
+    height = props.height;
   var clipboardAttrs = {
     id: id,
     collection: collection
@@ -215,7 +207,11 @@ var MediaInline = function MediaInline(props) {
         intl: intl,
         mediaInlineProviders: mediaInlineProviders,
         collection: collection,
-        featureFlags: featureFlags
+        featureFlags: featureFlags,
+        type: fileType,
+        alt: alt,
+        width: width,
+        height: height
       });
     }
   });

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

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.getMediaContainerWidth = exports.default = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
+var _react2 = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
 var _ui = require("@atlaskit/editor-common/ui");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
@@ -15,6 +16,8 @@ var _style = require("../../../ui/Renderer/style");
 var _styles = require("./styles");
 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; }
+/** @jsx jsx */
+
 var DEFAULT_WIDTH = 250;
 var DEFAULT_HEIGHT = 200;
 var isMediaElement = function isMediaElement(media) {
@@ -164,7 +167,7 @@ var MediaSingle = function MediaSingle(props) {
       featureFlags: featureFlags
     });
     var uiMediaSingleStyles = layout === 'full-width' || layout === 'wide' ? [_styles.uiMediaSingleBaseStyles, _styles.uiMediaSingleLayoutStyles] : [_styles.uiMediaSingleBaseStyles];
-    return /*#__PURE__*/_react.default.createElement(_ui.MediaSingle, {
+    return (0, _react2.jsx)(_ui.MediaSingle, {
       css: uiMediaSingleStyles,
       handleMediaSingleRef: ref,
       layout: layout,
@@ -177,9 +180,9 @@ var MediaSingle = function MediaSingle(props) {
         widthType: widthType
       },
       fullWidthMode: isFullWidth
-    }, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, mediaComponent), allowCaptions && caption);
+    }, (0, _react2.jsx)(_react.Fragment, null, mediaComponent), allowCaptions && caption);
   };
-  return /*#__PURE__*/_react.default.createElement(_ui.WidthConsumer, null, function (_ref3) {
+  return (0, _react2.jsx)(_ui.WidthConsumer, null, function (_ref3) {
     var width = _ref3.width;
     // Note: in SSR mode the `window` object is not defined,
     // therefore width here is 0, see:

package/dist/cjs/react/nodes/mediaSingle/styles.js

@@ -8,5 +8,6 @@ exports.uiMediaSingleLayoutStyles = exports.uiMediaSingleBaseStyles = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("@emotion/react");
 var _templateObject, _templateObject2;
+/** @jsx jsx */
 var uiMediaSingleBaseStyles = exports.uiMediaSingleBaseStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  transition: all 0.1s linear;\n"])));
 var uiMediaSingleLayoutStyles = exports.uiMediaSingleLayoutStyles = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  margin-left: 50%;\n  transform: translateX(-50%);\n"])));

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

@@ -19,7 +19,9 @@ var _emoji2 = _interopRequireDefault(require("./emoji"));
 var _theme = require("@atlaskit/theme");
 var _icons = require("@atlaskit/editor-common/icons");
 var _templateObject, _templateObject2;
-var _excluded = ["backgroundColor", "hasIcon"]; // AFP-2532 TODO: Fix automatic suppressions below
+var _excluded = ["backgroundColor", "hasIcon"];
+/** @jsx jsx */
+// AFP-2532 TODO: Fix automatic suppressions below
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
 var PanelStyled = function PanelStyled(_ref) {
   var backgroundColor = _ref.backgroundColor,
@@ -44,7 +46,7 @@ var PanelStyled = function PanelStyled(_ref) {
       }), _adfSchema.PanelType.CUSTOM, customStyle, hasIcon ? '' : 'padding-left: 12px;');
     };
   }
-  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+  return (0, _react2.jsx)("div", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
@@ -73,7 +75,7 @@ var Panel = function Panel(props) {
   var getIcon = function getIcon() {
     if (panelType === _adfSchema.PanelType.CUSTOM) {
       if (panelIcon && providers) {
-        return /*#__PURE__*/_react.default.createElement(_emoji2.default, {
+        return (0, _react2.jsx)(_emoji2.default, {
           id: panelIconId,
           text: panelIconText,
           shortName: panelIcon,
@@ -83,19 +85,19 @@ var Panel = function Panel(props) {
       return null;
     }
     var Icon = panelIcons[panelType];
-    return /*#__PURE__*/_react.default.createElement(Icon, {
+    return (0, _react2.jsx)(Icon, {
       label: "Panel ".concat(panelType)
     });
   };
   var icon = getIcon();
   var renderIcon = function renderIcon() {
     if (icon) {
-      return /*#__PURE__*/_react.default.createElement("div", {
+      return (0, _react2.jsx)("div", {
         className: _panel.PanelSharedCssClassName.icon
       }, icon);
     }
   };
-  return /*#__PURE__*/_react.default.createElement(PanelStyled, {
+  return (0, _react2.jsx)(PanelStyled, {
     className: _panel.PanelSharedCssClassName.prefix,
     "data-panel-type": panelType,
     "data-panel-color": panelColor,
@@ -104,7 +106,7 @@ var Panel = function Panel(props) {
     "data-panel-icon-text": panelIconText,
     backgroundColor: panelColor,
     hasIcon: Boolean(icon)
-  }, renderIcon(), /*#__PURE__*/_react.default.createElement("div", {
+  }, renderIcon(), (0, _react2.jsx)("div", {
     className: _panel.PanelSharedCssClassName.content
   }, children));
 };

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

@@ -18,6 +18,7 @@ var _table = require("./table");
 var _injectProps = require("../../utils/inject-props");
 var _table2 = require("../table");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+/** @jsx jsx */
 var tableStickyPadding = exports.tableStickyPadding = 8;
 var modeSpecficStyles = {
   none: (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    display: none;\n  "]))),
@@ -44,7 +45,7 @@ var FixedTableDiv = exports.FixedTableDiv = function FixedTableDiv(props) {
   var attrs = {
     mode: mode
   };
-  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, attrs, {
+  return (0, _react2.jsx)("div", (0, _extends2.default)({}, attrs, {
     "data-testid": "sticky-table-fixed",
     css: fixedTableCss
   }), props.children);
@@ -80,26 +81,26 @@ var StickyTable = exports.StickyTable = function StickyTable(_ref) {
     });
   }
   /* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return (0, _react2.jsx)("div", {
     css: styles
-  }, /*#__PURE__*/_react.default.createElement(FixedTableDiv, {
+  }, (0, _react2.jsx)(FixedTableDiv, {
     top: mode === 'stick' ? top : undefined,
     mode: rowHeight > 300 ? 'none' : mode,
     wrapperWidth: wrapperWidth,
     rendererAppearance: rendererAppearance
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, (0, _react2.jsx)("div", {
     className: "".concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, " is-sticky ").concat(shadowClassNames || ''),
     "data-layout": layout,
     style: {
       width: tableWidth
     }
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, (0, _react2.jsx)("div", {
     ref: innerRef,
     className: "".concat(_styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER),
     style: {
       overflow: 'hidden'
     }
-  }, /*#__PURE__*/_react.default.createElement(_table.Table, {
+  }, (0, _react2.jsx)(_table.Table, {
     columnWidths: columnWidths,
     layout: layout,
     isNumberColumnEnabled: isNumberColumnEnabled,

package/dist/cjs/react/utils/EditorMediaClientProvider.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EditorMediaClientProvider = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _mediaClientReact = require("@atlaskit/media-client-react");
+var _providerFactory = require("@atlaskit/editor-common/provider-factory");
+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 EditorMediaClientProvider = exports.EditorMediaClientProvider = function EditorMediaClientProvider(_ref) {
+  var children = _ref.children,
+    ssr = _ref.ssr;
+  var _useState = (0, _react.useState)(),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    mediaClientConfig = _useState2[0],
+    setMediaClientConfig = _useState2[1];
+  var mediaProvider = (0, _providerFactory.useProvider)('mediaProvider');
+
+  // Consumers can override the mediaClient for renderer,
+  // by not providing ssr config and mediaProvider,
+  // and provide a top level mediaClient context
+  // This is useful for testing and creating examples.
+  (0, _react.useEffect)(function () {
+    if (ssr && ssr.mode === 'server' && ssr.config) {
+      setMediaClientConfig(ssr.config);
+    } else if (mediaProvider) {
+      mediaProvider.then(function (provider) {
+        setMediaClientConfig(provider.viewMediaClientConfig);
+      });
+    }
+  }, [mediaProvider, ssr]);
+  return mediaClientConfig ? /*#__PURE__*/_react.default.createElement(_mediaClientReact.MediaClientProvider, {
+    clientConfig: mediaClientConfig
+  }, children) : children;
+};

package/dist/cjs/ui/Expand.js

@@ -22,7 +22,9 @@ var _reactIntlNext = require("react-intl-next");
 var _activeHeaderIdProvider = require("./active-header-id-provider");
 var _uniqueId2 = _interopRequireDefault(require("lodash/uniqueId"));
 var _utils = require("../utils");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4; // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+/** @jsx jsx */
+// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 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 titleStyles = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  outline: none;\n  border: none;\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: normal;\n  display: flex;\n  flex: 1;\n  margin: 0;\n  padding: 0 0 0 ", ";\n  text-align: left;\n"])), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), _editorSharedStyles.akEditorLineHeight, "var(--ds-space-050, 4px)");
@@ -34,7 +36,7 @@ var Container = function Container(props) {
       theme: themeProps
     }), paddingBottom);
   };
-  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+  return (0, _react2.jsx)("div", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
@@ -45,7 +47,7 @@ var TitleContainer = function TitleContainer(props) {
       theme: themeProps
     }), "var(--ds-space-100, 8px)", paddingBottom);
   };
-  return /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
+  return (0, _react2.jsx)("button", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
@@ -58,7 +60,7 @@ var ContentContainer = function ContentContainer(props) {
       theme: themeProps
     }), "var(--ds-space-200, 16px)", (0, _constants.gridSize)() * 5 - (0, _constants.gridSize)() / 2, visibility);
   };
-  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+  return (0, _react2.jsx)("div", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
@@ -105,18 +107,18 @@ function Expand(_ref) {
   var handleBlur = (0, _react.useCallback)(function () {
     return setFocused(false);
   }, []);
-  return /*#__PURE__*/_react.default.createElement(Container, {
+  return (0, _react2.jsx)(Container, {
     "data-node-type": nodeType,
     "data-title": title,
     "data-expanded": expanded,
     expanded: expanded,
     focused: focused
-  }, nestedHeaderIds && nestedHeaderIds.length > 0 ? /*#__PURE__*/_react.default.createElement(_activeHeaderIdProvider.ActiveHeaderIdConsumer, {
+  }, nestedHeaderIds && nestedHeaderIds.length > 0 ? (0, _react2.jsx)(_activeHeaderIdProvider.ActiveHeaderIdConsumer, {
     nestedHeaderIds: nestedHeaderIds,
     onNestedHeaderIdMatch: function onNestedHeaderIdMatch() {
       return setExpanded(true);
     }
-  }) : null, /*#__PURE__*/_react.default.createElement(TitleContainer, {
+  }) : null, (0, _react2.jsx)(TitleContainer, {
     onClick: function onClick(e) {
       e.stopPropagation();
       fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent);
@@ -131,27 +133,27 @@ function Expand(_ref) {
     "aria-expanded": expanded,
     contentEditable: false,
     expanded: expanded
-  }, isMobile ? /*#__PURE__*/_react.default.createElement(_ui.ExpandIconWrapper, {
+  }, isMobile ? (0, _react2.jsx)(_ui.ExpandIconWrapper, {
     expanded: expanded
-  }, /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
+  }, (0, _react2.jsx)(_chevronRight.default, {
     label: label
-  })) : /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+  })) : (0, _react2.jsx)(_tooltip.default, {
     content: label,
     position: "top",
     tag: _ui.ExpandLayoutWrapperWithRef,
     testId: 'tooltip'
-  }, /*#__PURE__*/_react.default.createElement(_ui.ExpandIconWrapper, {
+  }, (0, _react2.jsx)(_ui.ExpandIconWrapper, {
     expanded: expanded
-  }, /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
+  }, (0, _react2.jsx)(_chevronRight.default, {
     label: label
-  }))), /*#__PURE__*/_react.default.createElement("span", {
+  }))), (0, _react2.jsx)("span", {
     css: titleStyles,
     id: id
-  }, title || intl.formatMessage(_ui.expandMessages.expandDefaultTitle))), /*#__PURE__*/_react.default.createElement(ContentContainer, {
+  }, title || intl.formatMessage(_ui.expandMessages.expandDefaultTitle))), (0, _react2.jsx)(ContentContainer, {
     expanded: expanded
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, (0, _react2.jsx)("div", {
     className: "".concat(nodeType, "-content-wrapper")
-  }, /*#__PURE__*/_react.default.createElement(_ui.WidthProvider, null, /*#__PURE__*/_react.default.createElement("div", {
+  }, (0, _react2.jsx)(_ui.WidthProvider, null, (0, _react2.jsx)("div", {
     css: _ui.clearNextSiblingMarginTopStyle
   }), children))));
 }