@atlaskit/renderer 108.18.0 → 108.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (97) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/afm-cc/tsconfig.json +109 -0
  3. package/dist/cjs/react/marks/alignment.js +3 -2
  4. package/dist/cjs/react/marks/breakout.js +3 -2
  5. package/dist/cjs/react/marks/link.js +4 -3
  6. package/dist/cjs/react/nodes/blockCard.js +13 -11
  7. package/dist/cjs/react/nodes/codeBlock/codeBlock.js +5 -2
  8. package/dist/cjs/react/nodes/codeBlock/components/codeBlockButtonContainer.js +6 -4
  9. package/dist/cjs/react/nodes/codeBlock/components/codeBlockContainer.js +3 -2
  10. package/dist/cjs/react/nodes/codeBlock/components/codeBlockCopyButton.js +11 -8
  11. package/dist/cjs/react/nodes/codeBlock/components/codeBlockWrapButton.js +11 -8
  12. package/dist/cjs/react/nodes/codeBlock/components/lightWeightCodeBlock.js +8 -7
  13. package/dist/cjs/react/nodes/codeBlock/windowedCodeBlock.js +6 -5
  14. package/dist/cjs/react/nodes/embedCard.js +9 -8
  15. package/dist/cjs/react/nodes/heading-anchor.js +5 -4
  16. package/dist/cjs/react/nodes/layoutColumn.js +3 -2
  17. package/dist/cjs/react/nodes/media/index.js +11 -8
  18. package/dist/cjs/react/nodes/mediaInline.js +47 -20
  19. package/dist/cjs/react/nodes/mediaSingle/index.js +6 -3
  20. package/dist/cjs/react/nodes/mediaSingle/styles.js +1 -0
  21. package/dist/cjs/react/nodes/panel.js +9 -7
  22. package/dist/cjs/react/nodes/table/sticky.js +7 -6
  23. package/dist/cjs/ui/Expand.js +18 -16
  24. package/dist/cjs/ui/MediaCard.js +74 -71
  25. package/dist/cjs/ui/Renderer/index.js +28 -35
  26. package/dist/cjs/ui/Renderer/truncated-wrapper.js +3 -2
  27. package/dist/cjs/ui/SortingIcon.js +5 -4
  28. package/dist/cjs/ui/annotations/draft/component.js +9 -8
  29. package/dist/cjs/ui/annotations/element/mark.js +2 -1
  30. package/dist/es2019/react/marks/alignment.js +4 -3
  31. package/dist/es2019/react/marks/breakout.js +4 -3
  32. package/dist/es2019/react/marks/link.js +5 -4
  33. package/dist/es2019/react/nodes/blockCard.js +13 -12
  34. package/dist/es2019/react/nodes/codeBlock/codeBlock.js +4 -2
  35. package/dist/es2019/react/nodes/codeBlock/components/codeBlockButtonContainer.js +6 -5
  36. package/dist/es2019/react/nodes/codeBlock/components/codeBlockContainer.js +4 -3
  37. package/dist/es2019/react/nodes/codeBlock/components/codeBlockCopyButton.js +7 -5
  38. package/dist/es2019/react/nodes/codeBlock/components/codeBlockWrapButton.js +9 -7
  39. package/dist/es2019/react/nodes/codeBlock/components/lightWeightCodeBlock.js +9 -8
  40. package/dist/es2019/react/nodes/codeBlock/windowedCodeBlock.js +6 -4
  41. package/dist/es2019/react/nodes/embedCard.js +10 -9
  42. package/dist/es2019/react/nodes/heading-anchor.js +6 -5
  43. package/dist/es2019/react/nodes/layoutColumn.js +4 -3
  44. package/dist/es2019/react/nodes/media/index.js +13 -7
  45. package/dist/es2019/react/nodes/mediaInline.js +20 -12
  46. package/dist/es2019/react/nodes/mediaSingle/index.js +6 -3
  47. package/dist/es2019/react/nodes/mediaSingle/styles.js +1 -0
  48. package/dist/es2019/react/nodes/panel.js +8 -7
  49. package/dist/es2019/react/nodes/table/sticky.js +8 -7
  50. package/dist/es2019/ui/Expand.js +17 -16
  51. package/dist/es2019/ui/MediaCard.js +29 -25
  52. package/dist/es2019/ui/Renderer/index.js +31 -36
  53. package/dist/es2019/ui/Renderer/truncated-wrapper.js +4 -3
  54. package/dist/es2019/ui/SortingIcon.js +6 -5
  55. package/dist/es2019/ui/annotations/draft/component.js +10 -9
  56. package/dist/es2019/ui/annotations/element/mark.js +3 -2
  57. package/dist/esm/react/marks/alignment.js +4 -3
  58. package/dist/esm/react/marks/breakout.js +4 -3
  59. package/dist/esm/react/marks/link.js +5 -4
  60. package/dist/esm/react/nodes/blockCard.js +13 -12
  61. package/dist/esm/react/nodes/codeBlock/codeBlock.js +4 -2
  62. package/dist/esm/react/nodes/codeBlock/components/codeBlockButtonContainer.js +6 -5
  63. package/dist/esm/react/nodes/codeBlock/components/codeBlockContainer.js +4 -3
  64. package/dist/esm/react/nodes/codeBlock/components/codeBlockCopyButton.js +7 -5
  65. package/dist/esm/react/nodes/codeBlock/components/codeBlockWrapButton.js +9 -7
  66. package/dist/esm/react/nodes/codeBlock/components/lightWeightCodeBlock.js +9 -8
  67. package/dist/esm/react/nodes/codeBlock/windowedCodeBlock.js +6 -4
  68. package/dist/esm/react/nodes/embedCard.js +10 -9
  69. package/dist/esm/react/nodes/heading-anchor.js +6 -5
  70. package/dist/esm/react/nodes/layoutColumn.js +4 -3
  71. package/dist/esm/react/nodes/media/index.js +14 -8
  72. package/dist/esm/react/nodes/mediaInline.js +48 -21
  73. package/dist/esm/react/nodes/mediaSingle/index.js +6 -3
  74. package/dist/esm/react/nodes/mediaSingle/styles.js +1 -0
  75. package/dist/esm/react/nodes/panel.js +8 -7
  76. package/dist/esm/react/nodes/table/sticky.js +8 -7
  77. package/dist/esm/ui/Expand.js +17 -16
  78. package/dist/esm/ui/MediaCard.js +74 -71
  79. package/dist/esm/ui/Renderer/index.js +31 -36
  80. package/dist/esm/ui/Renderer/truncated-wrapper.js +4 -3
  81. package/dist/esm/ui/SortingIcon.js +6 -5
  82. package/dist/esm/ui/annotations/draft/component.js +10 -9
  83. package/dist/esm/ui/annotations/element/mark.js +3 -2
  84. package/dist/types/react/nodes/media/index.d.ts +3 -2
  85. package/dist/types/react/nodes/mediaInline.d.ts +1 -2
  86. package/dist/types/ui/MediaCard.d.ts +5 -6
  87. package/dist/types/ui/Renderer/index.d.ts +1 -2
  88. package/dist/types-ts4.5/react/nodes/media/index.d.ts +3 -2
  89. package/dist/types-ts4.5/react/nodes/mediaInline.d.ts +1 -2
  90. package/dist/types-ts4.5/ui/MediaCard.d.ts +5 -6
  91. package/dist/types-ts4.5/ui/Renderer/index.d.ts +1 -2
  92. package/package.json +2 -1
  93. package/dist/cjs/react/utils/EditorMediaClientProvider.js +0 -40
  94. package/dist/es2019/react/utils/EditorMediaClientProvider.js +0 -27
  95. package/dist/esm/react/utils/EditorMediaClientProvider.js +0 -30
  96. package/dist/types/react/utils/EditorMediaClientProvider.d.ts +0 -5
  97. package/dist/types-ts4.5/react/utils/EditorMediaClientProvider.d.ts +0 -5
@@ -26,13 +26,14 @@ var _reactIntlNext = require("react-intl-next");
26
26
  var _messages = require("../../messages");
27
27
  var _templateObject;
28
28
  var _excluded = ["children"];
29
+ /** @jsx jsx */
29
30
  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); }; }
30
31
  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; } }
31
32
  var HeadingAnchorWrapperClassName = exports.HeadingAnchorWrapperClassName = 'heading-anchor-wrapper';
32
33
  var CopyAnchorWrapperWithRef = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
33
34
  var children = props.children,
34
35
  rest = (0, _objectWithoutProperties2.default)(props, _excluded);
35
- return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({}, rest, {
36
+ return (0, _react2.jsx)("span", (0, _extends2.default)({}, rest, {
36
37
  className: HeadingAnchorWrapperClassName,
37
38
  ref: ref
38
39
  }), children);
@@ -97,12 +98,12 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
97
98
  _this.setTooltipState(_messages.headingAnchorLinkMessages.copyHeadingLinkToClipboard);
98
99
  });
99
100
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderAnchorButton", function () {
100
- return /*#__PURE__*/_react.default.createElement("button", {
101
+ return (0, _react2.jsx)("button", {
101
102
  css: copyAnchorButtonStyles,
102
103
  onMouseLeave: _this.resetMessage,
103
104
  onClick: _this.copyToClipboard,
104
105
  "aria-label": _this.state.tooltipMessage
105
- }, /*#__PURE__*/_react.default.createElement(_link.default, {
106
+ }, (0, _react2.jsx)(_link.default, {
106
107
  label: _this.getCopyAriaLabel(),
107
108
  size: _this.props.level > 3 ? 'small' : 'medium',
108
109
  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) {
123
124
  // We set the key to the message to ensure it remounts when the message
124
125
  // changes, so that it correctly repositions.
125
126
  // @see https://ecosystem.atlassian.net/projects/AK/queues/issue/AK-6548
126
- return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
127
+ return (0, _react2.jsx)(_tooltip.default, {
127
128
  tag: CopyAnchorWrapperWithRef,
128
129
  content: tooltipMessage,
129
130
  position: "top",
@@ -10,15 +10,16 @@ var _react = _interopRequireDefault(require("react"));
10
10
  var _react2 = require("@emotion/react");
11
11
  var _ui = require("@atlaskit/editor-common/ui");
12
12
  var _templateObject;
13
+ /** @jsx jsx */
13
14
  var layoutColumnClearMarginTopStyles = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n ", "\n ", "\n"])), _ui.clearNextSiblingMarginTopStyle, _ui.clearNextSiblingBlockMarkMarginTopStyle);
14
15
  function LayoutSection(props) {
15
- return /*#__PURE__*/_react.default.createElement("div", {
16
+ return (0, _react2.jsx)("div", {
16
17
  "data-layout-column": true,
17
18
  "data-column-width": props.width,
18
19
  style: {
19
20
  flexBasis: "".concat(props.width, "%")
20
21
  }
21
- }, /*#__PURE__*/_react.default.createElement(_ui.WidthProvider, null, /*#__PURE__*/_react.default.createElement("div", {
22
+ }, (0, _react2.jsx)(_ui.WidthProvider, null, (0, _react2.jsx)("div", {
22
23
  css: layoutColumnClearMarginTopStyles
23
24
  }), props.children));
24
25
  }
@@ -15,6 +15,7 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
15
15
  var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
16
16
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
17
17
  var _react = _interopRequireWildcard(require("react"));
18
+ var _react2 = require("@emotion/react");
18
19
  var _analyticsNext = require("@atlaskit/analytics-next");
19
20
  var _analyticsNamespacedContext = require("@atlaskit/analytics-namespaced-context");
20
21
  var _providerFactory = require("@atlaskit/editor-common/provider-factory");
@@ -28,7 +29,7 @@ var _styles = require("./styles");
28
29
  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); }
29
30
  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; }
30
31
  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); }; }
31
- 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; } }
32
+ 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 */
32
33
  var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
33
34
  (0, _inherits2.default)(Media, _PureComponent);
34
35
  var _super = _createSuper(Media);
@@ -42,7 +43,8 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
42
43
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderCard", function () {
43
44
  var _borderMark$attrs$col, _borderMark$attrs$siz;
44
45
  var providers = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
45
- var contextIdentifierProvider = providers.contextIdentifierProvider;
46
+ var mediaProvider = providers.mediaProvider,
47
+ contextIdentifierProvider = providers.contextIdentifierProvider;
46
48
  var _this$props = _this.props,
47
49
  allowAltTextOnImages = _this$props.allowAltTextOnImages,
48
50
  alt = _this$props.alt,
@@ -57,11 +59,12 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
57
59
  var linkHref = linkMark === null || linkMark === void 0 ? void 0 : linkMark.attrs.href;
58
60
  var eventHandlers = linkHref ? undefined : _this.props.eventHandlers;
59
61
  var shouldOpenMediaViewer = !linkHref && allowMediaViewer;
60
- var mediaComponent = /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
62
+ var mediaComponent = (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
61
63
  data: (0, _defineProperty2.default)({}, _analyticsNamespacedContext.MEDIA_CONTEXT, {
62
64
  border: !!borderMark
63
65
  })
64
- }, /*#__PURE__*/_react.default.createElement(_MediaCard.MediaCard, (0, _extends2.default)({
66
+ }, (0, _react2.jsx)(_MediaCard.MediaCard, (0, _extends2.default)({
67
+ mediaProvider: mediaProvider,
65
68
  contextIdentifierProvider: contextIdentifierProvider
66
69
  }, _this.props, {
67
70
  shouldOpenMediaViewer: shouldOpenMediaViewer,
@@ -72,15 +75,15 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
72
75
  ssr: ssr
73
76
  })));
74
77
  var paletteColorValue = (0, _editorPalette.hexToEditorBorderPaletteColor)(borderColor) || borderColor;
75
- var mediaComponentWithBorder = borderMark ? /*#__PURE__*/_react.default.createElement("div", {
78
+ var mediaComponentWithBorder = borderMark ? (0, _react2.jsx)("div", {
76
79
  "data-mark-type": "border",
77
80
  "data-color": borderColor,
78
81
  "data-size": borderWidth,
79
82
  css: (0, _styles.borderStyle)(paletteColorValue, borderWidth)
80
- }, /*#__PURE__*/_react.default.createElement(_ui.MediaBorderGapFiller, {
83
+ }, (0, _react2.jsx)(_ui.MediaBorderGapFiller, {
81
84
  borderColor: borderColor
82
85
  }), mediaComponent) : mediaComponent;
83
- return linkHref ? /*#__PURE__*/_react.default.createElement("a", {
86
+ return linkHref ? (0, _react2.jsx)("a", {
84
87
  href: linkHref,
85
88
  rel: "noreferrer noopener",
86
89
  onClick: _this.handleMediaLinkClick,
@@ -122,7 +125,7 @@ var Media = exports.default = /*#__PURE__*/function (_PureComponent) {
122
125
  if (!providers) {
123
126
  return this.renderCard();
124
127
  }
125
- return /*#__PURE__*/_react.default.createElement(_providerFactory.WithProviders, {
128
+ return (0, _react2.jsx)(_providerFactory.WithProviders, {
126
129
  providers: ['mediaProvider', 'contextIdentifierProvider'],
127
130
  providerFactory: providers,
128
131
  renderNode: this.renderCard
@@ -28,6 +28,7 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
28
28
  clipboardAttrs = _ref.clipboardAttrs,
29
29
  mediaInlineProviders = _ref.mediaInlineProviders,
30
30
  collectionName = _ref.collection,
31
+ featureFlags = _ref.featureFlags,
31
32
  eventHandlers = _ref.eventHandlers,
32
33
  identifier = _ref.identifier;
33
34
  var _useState = (0, _react.useState)(),
@@ -36,9 +37,12 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
36
37
  setContextIdentifierProvider = _useState2[1];
37
38
  var _useState3 = (0, _react.useState)(),
38
39
  _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
39
- fileState = _useState4[0],
40
- setFileState = _useState4[1];
41
- var mediaClient = _react.default.useContext(_mediaClientReact.MediaClientContext);
40
+ viewMediaClientConfigState = _useState4[0],
41
+ setViewMediaClientConfigState = _useState4[1];
42
+ var _useState5 = (0, _react.useState)(),
43
+ _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
44
+ fileState = _useState6[0],
45
+ setFileState = _useState6[1];
42
46
  var updateContext = /*#__PURE__*/function () {
43
47
  var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(contextIdentifierProvider) {
44
48
  var resolvedContextID;
@@ -65,40 +69,36 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
65
69
  };
66
70
  }();
67
71
  var updateFileState = (0, _react.useCallback)( /*#__PURE__*/function () {
68
- var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(id) {
69
- var options, _fileState;
72
+ var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(id, mediaClientConfig) {
73
+ var mediaClient, options, _fileState;
70
74
  return _regenerator.default.wrap(function _callee2$(_context2) {
71
75
  while (1) switch (_context2.prev = _context2.next) {
72
76
  case 0:
77
+ mediaClient = (0, _mediaClientReact.getMediaClient)(mediaClientConfig);
73
78
  options = {
74
79
  collectionName: collectionName
75
80
  };
76
- _context2.prev = 1;
77
- if (!mediaClient) {
78
- _context2.next = 7;
79
- break;
80
- }
81
+ _context2.prev = 2;
81
82
  _context2.next = 5;
82
83
  return mediaClient.file.getCurrentState(id, options);
83
84
  case 5:
84
85
  _fileState = _context2.sent;
85
86
  setFileState(_fileState);
86
- case 7:
87
87
  _context2.next = 11;
88
88
  break;
89
89
  case 9:
90
90
  _context2.prev = 9;
91
- _context2.t0 = _context2["catch"](1);
91
+ _context2.t0 = _context2["catch"](2);
92
92
  case 11:
93
93
  case "end":
94
94
  return _context2.stop();
95
95
  }
96
- }, _callee2, null, [[1, 9]]);
96
+ }, _callee2, null, [[2, 9]]);
97
97
  }));
98
- return function (_x2) {
98
+ return function (_x2, _x3) {
99
99
  return _ref3.apply(this, arguments);
100
100
  };
101
- }(), [collectionName, mediaClient]);
101
+ }(), [collectionName]);
102
102
  (0, _react.useEffect)(function () {
103
103
  var id = identifier.id;
104
104
  var nodeIsInCache = id && _MediaCard.mediaIdentifierMap.has(id);
@@ -112,17 +112,44 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
112
112
  };
113
113
  }, [identifier, collectionName]);
114
114
  (0, _react.useEffect)(function () {
115
- var contextIdentifierProvider = mediaInlineProviders.contextIdentifierProvider;
115
+ var mediaProvider = mediaInlineProviders.mediaProvider,
116
+ contextIdentifierProvider = mediaInlineProviders.contextIdentifierProvider;
116
117
  var id = clipboardAttrs.id;
118
+ updateViewMediaClientConfigState(mediaProvider);
117
119
  updateContext(contextIdentifierProvider);
118
- id && updateFileState(id);
119
- }, [mediaInlineProviders, contextIdentifierProvider, clipboardAttrs, updateFileState]);
120
+ id && viewMediaClientConfigState && updateFileState(id, viewMediaClientConfigState);
121
+ }, [mediaInlineProviders, contextIdentifierProvider, clipboardAttrs, viewMediaClientConfigState, updateFileState]);
122
+ var updateViewMediaClientConfigState = /*#__PURE__*/function () {
123
+ var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(mediaProvider) {
124
+ var mediaClientConfig;
125
+ return _regenerator.default.wrap(function _callee3$(_context3) {
126
+ while (1) switch (_context3.prev = _context3.next) {
127
+ case 0:
128
+ if (!mediaProvider) {
129
+ _context3.next = 5;
130
+ break;
131
+ }
132
+ _context3.next = 3;
133
+ return mediaProvider;
134
+ case 3:
135
+ mediaClientConfig = _context3.sent;
136
+ setViewMediaClientConfigState(mediaClientConfig.viewMediaClientConfig);
137
+ case 5:
138
+ case "end":
139
+ return _context3.stop();
140
+ }
141
+ }, _callee3);
142
+ }));
143
+ return function updateViewMediaClientConfigState(_x4) {
144
+ return _ref4.apply(this, arguments);
145
+ };
146
+ }();
120
147
 
121
148
  /*
122
149
  * Only show the loading view if the media provider is not ready
123
150
  * prevents calling the media API before the provider is ready
124
151
  */
125
- if (!mediaClient) {
152
+ if (!viewMediaClientConfigState) {
126
153
  return /*#__PURE__*/_react.default.createElement(_mediaUi.MediaInlineCardLoadingView, {
127
154
  message: "",
128
155
  isSelected: false
@@ -152,7 +179,7 @@ var RenderMediaInline = exports.RenderMediaInline = function RenderMediaInline(_
152
179
  onClick: handleMediaInlineClick,
153
180
  shouldOpenMediaViewer: shouldOpenMediaViewer,
154
181
  shouldDisplayToolTip: shouldDisplayToolTip,
155
- mediaClientConfig: mediaClient.mediaClientConfig,
182
+ mediaClientConfig: viewMediaClientConfigState,
156
183
  mediaViewerItems: Array.from(_MediaCard.mediaIdentifierMap.values())
157
184
  }) : /*#__PURE__*/_react.default.createElement(_mediaUi.MediaInlineCardErroredView, {
158
185
  message: (intl || (0, _reactIntlNext.createIntl)({
@@ -8,6 +8,7 @@ Object.defineProperty(exports, "__esModule", {
8
8
  exports.getMediaContainerWidth = exports.default = void 0;
9
9
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
10
10
  var _react = _interopRequireWildcard(require("react"));
11
+ var _react2 = require("@emotion/react");
11
12
  var _reactIntlNext = require("react-intl-next");
12
13
  var _ui = require("@atlaskit/editor-common/ui");
13
14
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
@@ -15,6 +16,8 @@ var _style = require("../../../ui/Renderer/style");
15
16
  var _styles = require("./styles");
16
17
  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); }
17
18
  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; }
19
+ /** @jsx jsx */
20
+
18
21
  var DEFAULT_WIDTH = 250;
19
22
  var DEFAULT_HEIGHT = 200;
20
23
  var isMediaElement = function isMediaElement(media) {
@@ -164,7 +167,7 @@ var MediaSingle = function MediaSingle(props) {
164
167
  featureFlags: featureFlags
165
168
  });
166
169
  var uiMediaSingleStyles = layout === 'full-width' || layout === 'wide' ? [_styles.uiMediaSingleBaseStyles, _styles.uiMediaSingleLayoutStyles] : [_styles.uiMediaSingleBaseStyles];
167
- return /*#__PURE__*/_react.default.createElement(_ui.MediaSingle, {
170
+ return (0, _react2.jsx)(_ui.MediaSingle, {
168
171
  css: uiMediaSingleStyles,
169
172
  handleMediaSingleRef: ref,
170
173
  layout: layout,
@@ -177,9 +180,9 @@ var MediaSingle = function MediaSingle(props) {
177
180
  widthType: widthType
178
181
  },
179
182
  fullWidthMode: isFullWidth
180
- }, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, mediaComponent), allowCaptions && caption);
183
+ }, (0, _react2.jsx)(_react.Fragment, null, mediaComponent), allowCaptions && caption);
181
184
  };
182
- return /*#__PURE__*/_react.default.createElement(_ui.WidthConsumer, null, function (_ref3) {
185
+ return (0, _react2.jsx)(_ui.WidthConsumer, null, function (_ref3) {
183
186
  var width = _ref3.width;
184
187
  // Note: in SSR mode the `window` object is not defined,
185
188
  // therefore width here is 0, see:
@@ -8,5 +8,6 @@ exports.uiMediaSingleLayoutStyles = exports.uiMediaSingleBaseStyles = void 0;
8
8
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
9
9
  var _react = require("@emotion/react");
10
10
  var _templateObject, _templateObject2;
11
+ /** @jsx jsx */
11
12
  var uiMediaSingleBaseStyles = exports.uiMediaSingleBaseStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n transition: all 0.1s linear;\n"])));
12
13
  var uiMediaSingleLayoutStyles = exports.uiMediaSingleLayoutStyles = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 50%;\n transform: translateX(-50%);\n"])));
@@ -19,7 +19,9 @@ var _emoji2 = _interopRequireDefault(require("./emoji"));
19
19
  var _theme = require("@atlaskit/theme");
20
20
  var _icons = require("@atlaskit/editor-common/icons");
21
21
  var _templateObject, _templateObject2;
22
- var _excluded = ["backgroundColor", "hasIcon"]; // AFP-2532 TODO: Fix automatic suppressions below
22
+ var _excluded = ["backgroundColor", "hasIcon"];
23
+ /** @jsx jsx */
24
+ // AFP-2532 TODO: Fix automatic suppressions below
23
25
  // eslint-disable-next-line @atlassian/tangerine/import/entry-points
24
26
  var PanelStyled = function PanelStyled(_ref) {
25
27
  var backgroundColor = _ref.backgroundColor,
@@ -44,7 +46,7 @@ var PanelStyled = function PanelStyled(_ref) {
44
46
  }), _adfSchema.PanelType.CUSTOM, customStyle, hasIcon ? '' : 'padding-left: 12px;');
45
47
  };
46
48
  }
47
- return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
49
+ return (0, _react2.jsx)("div", (0, _extends2.default)({
48
50
  css: styles
49
51
  }, props), props.children);
50
52
  };
@@ -73,7 +75,7 @@ var Panel = function Panel(props) {
73
75
  var getIcon = function getIcon() {
74
76
  if (panelType === _adfSchema.PanelType.CUSTOM) {
75
77
  if (panelIcon && providers) {
76
- return /*#__PURE__*/_react.default.createElement(_emoji2.default, {
78
+ return (0, _react2.jsx)(_emoji2.default, {
77
79
  id: panelIconId,
78
80
  text: panelIconText,
79
81
  shortName: panelIcon,
@@ -83,19 +85,19 @@ var Panel = function Panel(props) {
83
85
  return null;
84
86
  }
85
87
  var Icon = panelIcons[panelType];
86
- return /*#__PURE__*/_react.default.createElement(Icon, {
88
+ return (0, _react2.jsx)(Icon, {
87
89
  label: "Panel ".concat(panelType)
88
90
  });
89
91
  };
90
92
  var icon = getIcon();
91
93
  var renderIcon = function renderIcon() {
92
94
  if (icon) {
93
- return /*#__PURE__*/_react.default.createElement("div", {
95
+ return (0, _react2.jsx)("div", {
94
96
  className: _panel.PanelSharedCssClassName.icon
95
97
  }, icon);
96
98
  }
97
99
  };
98
- return /*#__PURE__*/_react.default.createElement(PanelStyled, {
100
+ return (0, _react2.jsx)(PanelStyled, {
99
101
  className: _panel.PanelSharedCssClassName.prefix,
100
102
  "data-panel-type": panelType,
101
103
  "data-panel-color": panelColor,
@@ -104,7 +106,7 @@ var Panel = function Panel(props) {
104
106
  "data-panel-icon-text": panelIconText,
105
107
  backgroundColor: panelColor,
106
108
  hasIcon: Boolean(icon)
107
- }, renderIcon(), /*#__PURE__*/_react.default.createElement("div", {
109
+ }, renderIcon(), (0, _react2.jsx)("div", {
108
110
  className: _panel.PanelSharedCssClassName.content
109
111
  }, children));
110
112
  };
@@ -18,6 +18,7 @@ var _table = require("./table");
18
18
  var _injectProps = require("../../utils/inject-props");
19
19
  var _table2 = require("../table");
20
20
  var _templateObject, _templateObject2, _templateObject3, _templateObject4;
21
+ /** @jsx jsx */
21
22
  var tableStickyPadding = exports.tableStickyPadding = 8;
22
23
  var modeSpecficStyles = {
23
24
  none: (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: none;\n "]))),
@@ -44,7 +45,7 @@ var FixedTableDiv = exports.FixedTableDiv = function FixedTableDiv(props) {
44
45
  var attrs = {
45
46
  mode: mode
46
47
  };
47
- return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, attrs, {
48
+ return (0, _react2.jsx)("div", (0, _extends2.default)({}, attrs, {
48
49
  "data-testid": "sticky-table-fixed",
49
50
  css: fixedTableCss
50
51
  }), props.children);
@@ -80,26 +81,26 @@ var StickyTable = exports.StickyTable = function StickyTable(_ref) {
80
81
  });
81
82
  }
82
83
  /* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
83
- return /*#__PURE__*/_react.default.createElement("div", {
84
+ return (0, _react2.jsx)("div", {
84
85
  css: styles
85
- }, /*#__PURE__*/_react.default.createElement(FixedTableDiv, {
86
+ }, (0, _react2.jsx)(FixedTableDiv, {
86
87
  top: mode === 'stick' ? top : undefined,
87
88
  mode: rowHeight > 300 ? 'none' : mode,
88
89
  wrapperWidth: wrapperWidth,
89
90
  rendererAppearance: rendererAppearance
90
- }, /*#__PURE__*/_react.default.createElement("div", {
91
+ }, (0, _react2.jsx)("div", {
91
92
  className: "".concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, " is-sticky ").concat(shadowClassNames || ''),
92
93
  "data-layout": layout,
93
94
  style: {
94
95
  width: tableWidth
95
96
  }
96
- }, /*#__PURE__*/_react.default.createElement("div", {
97
+ }, (0, _react2.jsx)("div", {
97
98
  ref: innerRef,
98
99
  className: "".concat(_styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER),
99
100
  style: {
100
101
  overflow: 'hidden'
101
102
  }
102
- }, /*#__PURE__*/_react.default.createElement(_table.Table, {
103
+ }, (0, _react2.jsx)(_table.Table, {
103
104
  columnWidths: columnWidths,
104
105
  layout: layout,
105
106
  isNumberColumnEnabled: isNumberColumnEnabled,
@@ -22,7 +22,9 @@ var _reactIntlNext = require("react-intl-next");
22
22
  var _activeHeaderIdProvider = require("./active-header-id-provider");
23
23
  var _uniqueId2 = _interopRequireDefault(require("lodash/uniqueId"));
24
24
  var _utils = require("../utils");
25
- var _templateObject, _templateObject2, _templateObject3, _templateObject4; // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
25
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
26
+ /** @jsx jsx */
27
+ // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
26
28
  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); }
27
29
  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; }
28
30
  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) {
34
36
  theme: themeProps
35
37
  }), paddingBottom);
36
38
  };
37
- return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
39
+ return (0, _react2.jsx)("div", (0, _extends2.default)({
38
40
  css: styles
39
41
  }, props), props.children);
40
42
  };
@@ -45,7 +47,7 @@ var TitleContainer = function TitleContainer(props) {
45
47
  theme: themeProps
46
48
  }), "var(--ds-space-100, 8px)", paddingBottom);
47
49
  };
48
- return /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
50
+ return (0, _react2.jsx)("button", (0, _extends2.default)({
49
51
  css: styles
50
52
  }, props), props.children);
51
53
  };
@@ -58,7 +60,7 @@ var ContentContainer = function ContentContainer(props) {
58
60
  theme: themeProps
59
61
  }), "var(--ds-space-200, 16px)", (0, _constants.gridSize)() * 5 - (0, _constants.gridSize)() / 2, visibility);
60
62
  };
61
- return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
63
+ return (0, _react2.jsx)("div", (0, _extends2.default)({
62
64
  css: styles
63
65
  }, props), props.children);
64
66
  };
@@ -105,18 +107,18 @@ function Expand(_ref) {
105
107
  var handleBlur = (0, _react.useCallback)(function () {
106
108
  return setFocused(false);
107
109
  }, []);
108
- return /*#__PURE__*/_react.default.createElement(Container, {
110
+ return (0, _react2.jsx)(Container, {
109
111
  "data-node-type": nodeType,
110
112
  "data-title": title,
111
113
  "data-expanded": expanded,
112
114
  expanded: expanded,
113
115
  focused: focused
114
- }, nestedHeaderIds && nestedHeaderIds.length > 0 ? /*#__PURE__*/_react.default.createElement(_activeHeaderIdProvider.ActiveHeaderIdConsumer, {
116
+ }, nestedHeaderIds && nestedHeaderIds.length > 0 ? (0, _react2.jsx)(_activeHeaderIdProvider.ActiveHeaderIdConsumer, {
115
117
  nestedHeaderIds: nestedHeaderIds,
116
118
  onNestedHeaderIdMatch: function onNestedHeaderIdMatch() {
117
119
  return setExpanded(true);
118
120
  }
119
- }) : null, /*#__PURE__*/_react.default.createElement(TitleContainer, {
121
+ }) : null, (0, _react2.jsx)(TitleContainer, {
120
122
  onClick: function onClick(e) {
121
123
  e.stopPropagation();
122
124
  fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent);
@@ -131,27 +133,27 @@ function Expand(_ref) {
131
133
  "aria-expanded": expanded,
132
134
  contentEditable: false,
133
135
  expanded: expanded
134
- }, isMobile ? /*#__PURE__*/_react.default.createElement(_ui.ExpandIconWrapper, {
136
+ }, isMobile ? (0, _react2.jsx)(_ui.ExpandIconWrapper, {
135
137
  expanded: expanded
136
- }, /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
138
+ }, (0, _react2.jsx)(_chevronRight.default, {
137
139
  label: label
138
- })) : /*#__PURE__*/_react.default.createElement(_tooltip.default, {
140
+ })) : (0, _react2.jsx)(_tooltip.default, {
139
141
  content: label,
140
142
  position: "top",
141
143
  tag: _ui.ExpandLayoutWrapperWithRef,
142
144
  testId: 'tooltip'
143
- }, /*#__PURE__*/_react.default.createElement(_ui.ExpandIconWrapper, {
145
+ }, (0, _react2.jsx)(_ui.ExpandIconWrapper, {
144
146
  expanded: expanded
145
- }, /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
147
+ }, (0, _react2.jsx)(_chevronRight.default, {
146
148
  label: label
147
- }))), /*#__PURE__*/_react.default.createElement("span", {
149
+ }))), (0, _react2.jsx)("span", {
148
150
  css: titleStyles,
149
151
  id: id
150
- }, title || intl.formatMessage(_ui.expandMessages.expandDefaultTitle))), /*#__PURE__*/_react.default.createElement(ContentContainer, {
152
+ }, title || intl.formatMessage(_ui.expandMessages.expandDefaultTitle))), (0, _react2.jsx)(ContentContainer, {
151
153
  expanded: expanded
152
- }, /*#__PURE__*/_react.default.createElement("div", {
154
+ }, (0, _react2.jsx)("div", {
153
155
  className: "".concat(nodeType, "-content-wrapper")
154
- }, /*#__PURE__*/_react.default.createElement(_ui.WidthProvider, null, /*#__PURE__*/_react.default.createElement("div", {
156
+ }, (0, _react2.jsx)(_ui.WidthProvider, null, (0, _react2.jsx)("div", {
155
157
  css: _ui.clearNextSiblingMarginTopStyle
156
158
  }), children))));
157
159
  }