@atlaskit/renderer 108.17.3 → 108.18.0

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

@@ -15,7 +15,6 @@ 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");
@@ -29,7 +28,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; } } /** @jsx jsx */
+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 Media = exports.default = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Media, _PureComponent);
   var _super = _createSuper(Media);
@@ -43,8 +42,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,
@@ -59,12 +57,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 = (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
+      var mediaComponent = /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
         data: (0, _defineProperty2.default)({}, _analyticsNamespacedContext.MEDIA_CONTEXT, {
           border: !!borderMark
         })
-      }, (0, _react2.jsx)(_MediaCard.MediaCard, (0, _extends2.default)({
-        mediaProvider: mediaProvider,
+      }, /*#__PURE__*/_react.default.createElement(_MediaCard.MediaCard, (0, _extends2.default)({
         contextIdentifierProvider: contextIdentifierProvider
       }, _this.props, {
         shouldOpenMediaViewer: shouldOpenMediaViewer,
@@ -75,15 +72,15 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
         ssr: ssr
       })));
       var paletteColorValue = (0, _editorPalette.hexToEditorBorderPaletteColor)(borderColor) || borderColor;
-      var mediaComponentWithBorder = borderMark ? (0, _react2.jsx)("div", {
+      var mediaComponentWithBorder = borderMark ? /*#__PURE__*/_react.default.createElement("div", {
         "data-mark-type": "border",
         "data-color": borderColor,
         "data-size": borderWidth,
         css: (0, _styles.borderStyle)(paletteColorValue, borderWidth)
-      }, (0, _react2.jsx)(_ui.MediaBorderGapFiller, {
+      }, /*#__PURE__*/_react.default.createElement(_ui.MediaBorderGapFiller, {
         borderColor: borderColor
       }), mediaComponent) : mediaComponent;
-      return linkHref ? (0, _react2.jsx)("a", {
+      return linkHref ? /*#__PURE__*/_react.default.createElement("a", {
         href: linkHref,
         rel: "noreferrer noopener",
         onClick: _this.handleMediaLinkClick,
@@ -125,7 +122,7 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
       if (!providers) {
         return this.renderCard();
       }
-      return (0, _react2.jsx)(_providerFactory.WithProviders, {
+      return /*#__PURE__*/_react.default.createElement(_providerFactory.WithProviders, {
         providers: ['mediaProvider', 'contextIdentifierProvider'],
         providerFactory: providers,
         renderNode: this.renderCard

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

@@ -28,7 +28,6 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
     clipboardAttrs = _ref.clipboardAttrs,
     mediaInlineProviders = _ref.mediaInlineProviders,
     collectionName = _ref.collection,
-    featureFlags = _ref.featureFlags,
     eventHandlers = _ref.eventHandlers,
     identifier = _ref.identifier;
   var _useState = (0, _react.useState)(),
@@ -37,12 +36,9 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
     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 +65,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 +112,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
@@ -179,7 +152,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)({

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

@@ -8,7 +8,6 @@ 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");
@@ -16,8 +15,6 @@ 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) {
@@ -167,7 +164,7 @@ var MediaSingle = function MediaSingle(props) {
       featureFlags: featureFlags
     });
     var uiMediaSingleStyles = layout === 'full-width' || layout === 'wide' ? [_styles.uiMediaSingleBaseStyles, _styles.uiMediaSingleLayoutStyles] : [_styles.uiMediaSingleBaseStyles];
-    return (0, _react2.jsx)(_ui.MediaSingle, {
+    return /*#__PURE__*/_react.default.createElement(_ui.MediaSingle, {
       css: uiMediaSingleStyles,
       handleMediaSingleRef: ref,
       layout: layout,
@@ -180,9 +177,9 @@ var MediaSingle = function MediaSingle(props) {
         widthType: widthType
       },
       fullWidthMode: isFullWidth
-    }, (0, _react2.jsx)(_react.Fragment, null, mediaComponent), allowCaptions && caption);
+    }, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, mediaComponent), allowCaptions && caption);
   };
-  return (0, _react2.jsx)(_ui.WidthConsumer, null, function (_ref3) {
+  return /*#__PURE__*/_react.default.createElement(_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,6 +8,5 @@ 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,9 +19,7 @@ var _emoji2 = _interopRequireDefault(require("./emoji"));
 var _theme = require("@atlaskit/theme");
 var _icons = require("@atlaskit/editor-common/icons");
 var _templateObject, _templateObject2;
-var _excluded = ["backgroundColor", "hasIcon"];
-/** @jsx jsx */
-// AFP-2532 TODO: Fix automatic suppressions below
+var _excluded = ["backgroundColor", "hasIcon"]; // 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,
@@ -46,7 +44,7 @@ var PanelStyled = function PanelStyled(_ref) {
       }), _adfSchema.PanelType.CUSTOM, customStyle, hasIcon ? '' : 'padding-left: 12px;');
     };
   }
-  return (0, _react2.jsx)("div", (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
@@ -75,7 +73,7 @@ var Panel = function Panel(props) {
   var getIcon = function getIcon() {
     if (panelType === _adfSchema.PanelType.CUSTOM) {
       if (panelIcon && providers) {
-        return (0, _react2.jsx)(_emoji2.default, {
+        return /*#__PURE__*/_react.default.createElement(_emoji2.default, {
           id: panelIconId,
           text: panelIconText,
           shortName: panelIcon,
@@ -85,19 +83,19 @@ var Panel = function Panel(props) {
       return null;
     }
     var Icon = panelIcons[panelType];
-    return (0, _react2.jsx)(Icon, {
+    return /*#__PURE__*/_react.default.createElement(Icon, {
       label: "Panel ".concat(panelType)
     });
   };
   var icon = getIcon();
   var renderIcon = function renderIcon() {
     if (icon) {
-      return (0, _react2.jsx)("div", {
+      return /*#__PURE__*/_react.default.createElement("div", {
         className: _panel.PanelSharedCssClassName.icon
       }, icon);
     }
   };
-  return (0, _react2.jsx)(PanelStyled, {
+  return /*#__PURE__*/_react.default.createElement(PanelStyled, {
     className: _panel.PanelSharedCssClassName.prefix,
     "data-panel-type": panelType,
     "data-panel-color": panelColor,
@@ -106,7 +104,7 @@ var Panel = function Panel(props) {
     "data-panel-icon-text": panelIconText,
     backgroundColor: panelColor,
     hasIcon: Boolean(icon)
-  }, renderIcon(), (0, _react2.jsx)("div", {
+  }, renderIcon(), /*#__PURE__*/_react.default.createElement("div", {
     className: _panel.PanelSharedCssClassName.content
   }, children));
 };

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

@@ -18,7 +18,6 @@ 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  "]))),
@@ -45,7 +44,7 @@ var FixedTableDiv = exports.FixedTableDiv = function FixedTableDiv(props) {
   var attrs = {
     mode: mode
   };
-  return (0, _react2.jsx)("div", (0, _extends2.default)({}, attrs, {
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, attrs, {
     "data-testid": "sticky-table-fixed",
     css: fixedTableCss
   }), props.children);
@@ -81,26 +80,26 @@ var StickyTable = exports.StickyTable = function StickyTable(_ref) {
     });
   }
   /* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
-  return (0, _react2.jsx)("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     css: styles
-  }, (0, _react2.jsx)(FixedTableDiv, {
+  }, /*#__PURE__*/_react.default.createElement(FixedTableDiv, {
     top: mode === 'stick' ? top : undefined,
     mode: rowHeight > 300 ? 'none' : mode,
     wrapperWidth: wrapperWidth,
     rendererAppearance: rendererAppearance
-  }, (0, _react2.jsx)("div", {
+  }, /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, " is-sticky ").concat(shadowClassNames || ''),
     "data-layout": layout,
     style: {
       width: tableWidth
     }
-  }, (0, _react2.jsx)("div", {
+  }, /*#__PURE__*/_react.default.createElement("div", {
     ref: innerRef,
     className: "".concat(_styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER),
     style: {
       overflow: 'hidden'
     }
-  }, (0, _react2.jsx)(_table.Table, {
+  }, /*#__PURE__*/_react.default.createElement(_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,9 +22,7 @@ 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;
-/** @jsx jsx */
-// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
+var _templateObject, _templateObject2, _templateObject3, _templateObject4; // 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)");
@@ -36,7 +34,7 @@ var Container = function Container(props) {
       theme: themeProps
     }), paddingBottom);
   };
-  return (0, _react2.jsx)("div", (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
@@ -47,7 +45,7 @@ var TitleContainer = function TitleContainer(props) {
       theme: themeProps
     }), "var(--ds-space-100, 8px)", paddingBottom);
   };
-  return (0, _react2.jsx)("button", (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
@@ -60,7 +58,7 @@ var ContentContainer = function ContentContainer(props) {
       theme: themeProps
     }), "var(--ds-space-200, 16px)", (0, _constants.gridSize)() * 5 - (0, _constants.gridSize)() / 2, visibility);
   };
-  return (0, _react2.jsx)("div", (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
@@ -107,18 +105,18 @@ function Expand(_ref) {
   var handleBlur = (0, _react.useCallback)(function () {
     return setFocused(false);
   }, []);
-  return (0, _react2.jsx)(Container, {
+  return /*#__PURE__*/_react.default.createElement(Container, {
     "data-node-type": nodeType,
     "data-title": title,
     "data-expanded": expanded,
     expanded: expanded,
     focused: focused
-  }, nestedHeaderIds && nestedHeaderIds.length > 0 ? (0, _react2.jsx)(_activeHeaderIdProvider.ActiveHeaderIdConsumer, {
+  }, nestedHeaderIds && nestedHeaderIds.length > 0 ? /*#__PURE__*/_react.default.createElement(_activeHeaderIdProvider.ActiveHeaderIdConsumer, {
     nestedHeaderIds: nestedHeaderIds,
     onNestedHeaderIdMatch: function onNestedHeaderIdMatch() {
       return setExpanded(true);
     }
-  }) : null, (0, _react2.jsx)(TitleContainer, {
+  }) : null, /*#__PURE__*/_react.default.createElement(TitleContainer, {
     onClick: function onClick(e) {
       e.stopPropagation();
       fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent);
@@ -133,27 +131,27 @@ function Expand(_ref) {
     "aria-expanded": expanded,
     contentEditable: false,
     expanded: expanded
-  }, isMobile ? (0, _react2.jsx)(_ui.ExpandIconWrapper, {
+  }, isMobile ? /*#__PURE__*/_react.default.createElement(_ui.ExpandIconWrapper, {
     expanded: expanded
-  }, (0, _react2.jsx)(_chevronRight.default, {
+  }, /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
     label: label
-  })) : (0, _react2.jsx)(_tooltip.default, {
+  })) : /*#__PURE__*/_react.default.createElement(_tooltip.default, {
     content: label,
     position: "top",
     tag: _ui.ExpandLayoutWrapperWithRef,
     testId: 'tooltip'
-  }, (0, _react2.jsx)(_ui.ExpandIconWrapper, {
+  }, /*#__PURE__*/_react.default.createElement(_ui.ExpandIconWrapper, {
     expanded: expanded
-  }, (0, _react2.jsx)(_chevronRight.default, {
+  }, /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
     label: label
-  }))), (0, _react2.jsx)("span", {
+  }))), /*#__PURE__*/_react.default.createElement("span", {
     css: titleStyles,
     id: id
-  }, title || intl.formatMessage(_ui.expandMessages.expandDefaultTitle))), (0, _react2.jsx)(ContentContainer, {
+  }, title || intl.formatMessage(_ui.expandMessages.expandDefaultTitle))), /*#__PURE__*/_react.default.createElement(ContentContainer, {
     expanded: expanded
-  }, (0, _react2.jsx)("div", {
+  }, /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(nodeType, "-content-wrapper")
-  }, (0, _react2.jsx)(_ui.WidthProvider, null, (0, _react2.jsx)("div", {
+  }, /*#__PURE__*/_react.default.createElement(_ui.WidthProvider, null, /*#__PURE__*/_react.default.createElement("div", {
     css: _ui.clearNextSiblingMarginTopStyle
   }), children))));
 }