@atlaskit/editor-common 64.0.0 → 66.0.1

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

@@ -13,9 +13,9 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _reactIntlNext = require("react-intl-next");
+var _react2 = require("@emotion/react");
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _reactIntlNext = require("react-intl-next");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
@@ -41,7 +41,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 BlockNode = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background: ", ";\n  border: 1px dashed ", ";\n  border-radius: ", "px;\n  box-sizing: border-box;\n  cursor: default;\n  display: flex;\n  font-size: ", ";\n  margin: 10px 0;\n  min-height: 24px;\n  padding: 10px;\n  text-align: center;\n  vertical-align: text-bottom;\n  min-width: 120px;\n  align-items: center;\n  justify-content: center;\n"])), _colors.N30, _colors.N50, (0, _constants.borderRadius)(), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()));
+var blockNodeStyle = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  border: 1px dashed ", ";\n  border-radius: ", "px;\n  box-sizing: border-box;\n  cursor: default;\n  display: flex;\n  font-size: ", ";\n  margin: 10px 0;\n  min-height: 24px;\n  padding: 10px;\n  text-align: center;\n  vertical-align: text-bottom;\n  min-width: 120px;\n  align-items: center;\n  justify-content: center;\n"])), _colors.N30, _colors.N50, (0, _constants.borderRadius)(), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()));
 
 var UnsupportedBlockNode = function UnsupportedBlockNode(_ref) {
   var node = _ref.node,
@@ -59,15 +59,18 @@ var UnsupportedBlockNode = function UnsupportedBlockNode(_ref) {
   var tooltipOnShowHandler = (0, _react.useCallback)(function () {
     return dispatchAnalyticsEvent && (0, _trackUnsupportedContent.trackUnsupportedContentTooltipDisplayedFor)(dispatchAnalyticsEvent, _analytics.ACTION_SUBJECT_ID.ON_UNSUPPORTED_BLOCK, originalNodeType);
   }, [dispatchAnalyticsEvent, originalNodeType]);
-  return /*#__PURE__*/_react.default.createElement(BlockNode, null, message, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+  return (0, _react2.jsx)("div", {
+    css: blockNodeStyle,
+    className: "unsupported"
+  }, message, (0, _react2.jsx)(_tooltip.default, {
     content: tooltipContent,
     hideTooltipOnClick: false,
     position: "bottom",
     onShow: tooltipOnShowHandler,
     strategy: "absolute"
-  }, /*#__PURE__*/_react.default.createElement("span", {
+  }, (0, _react2.jsx)("span", {
     style: style
-  }, /*#__PURE__*/_react.default.createElement(_questionCircle.default, {
+  }, (0, _react2.jsx)(_questionCircle.default, {
     label: "?",
     size: "small"
   }))));

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

@@ -13,9 +13,9 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _reactIntlNext = require("react-intl-next");
+var _react2 = require("@emotion/react");
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _reactIntlNext = require("react-intl-next");
 
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 
@@ -41,7 +41,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 InlineNode = _styledComponents.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background: ", ";\n  border: 1px dashed ", ";\n  border-radius: ", "px;\n  box-sizing: border-box;\n  cursor: default;\n  display: inline-flex;\n  font-size: ", ";\n  margin: 0 2px;\n  min-height: 24px;\n  padding: 0 10px;\n  vertical-align: middle;\n  white-space: nowrap;\n"])), _colors.N30, _colors.N50, (0, _constants.borderRadius)(), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()));
+var inlineNodeStyle = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background: ", ";\n  border: 1px dashed ", ";\n  border-radius: ", "px;\n  box-sizing: border-box;\n  cursor: default;\n  display: inline-flex;\n  font-size: ", ";\n  margin: 0 2px;\n  min-height: 24px;\n  padding: 0 10px;\n  vertical-align: middle;\n  white-space: nowrap;\n"])), _colors.N30, _colors.N50, (0, _constants.borderRadius)(), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()));
 
 var UnsupportedInlineNode = function UnsupportedInlineNode(_ref) {
   var node = _ref.node,
@@ -59,15 +59,17 @@ var UnsupportedInlineNode = function UnsupportedInlineNode(_ref) {
   var tooltipOnShowHandler = (0, _react.useCallback)(function () {
     return dispatchAnalyticsEvent && (0, _trackUnsupportedContent.trackUnsupportedContentTooltipDisplayedFor)(dispatchAnalyticsEvent, _analytics.ACTION_SUBJECT_ID.ON_UNSUPPORTED_INLINE, originalNodeType);
   }, [dispatchAnalyticsEvent, originalNodeType]);
-  return /*#__PURE__*/_react.default.createElement(InlineNode, null, message, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+  return (0, _react2.jsx)("span", {
+    css: inlineNodeStyle
+  }, message, (0, _react2.jsx)(_tooltip.default, {
     content: tooltipContent,
     hideTooltipOnClick: false,
     position: "bottom",
     onShow: tooltipOnShowHandler,
     strategy: "absolute"
-  }, /*#__PURE__*/_react.default.createElement("span", {
+  }, (0, _react2.jsx)("span", {
     style: style
-  }, /*#__PURE__*/_react.default.createElement(_questionCircle.default, {
+  }, (0, _react2.jsx)(_questionCircle.default, {
     label: "?",
     size: "small"
   }))));

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

@@ -9,6 +9,8 @@ exports.WidthProvider = exports.WidthContext = exports.WidthConsumer = void 0;
 exports.createWidthContext = createWidthContext;
 exports.getBreakpoint = getBreakpoint;
 
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
@@ -23,13 +25,11 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = _interopRequireDefault(require("react"));
 
-var _rafSchd = _interopRequireDefault(require("raf-schd"));
+var _react2 = require("@emotion/react");
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _rafSchd = _interopRequireDefault(require("raf-schd"));
 
 var _widthDetector = require("@atlaskit/width-detector");
 
@@ -70,8 +70,6 @@ var Provider = WidthContext.Provider,
     Consumer = WidthContext.Consumer;
 exports.WidthConsumer = Consumer;
 
-var RelativeContainer = /*#__PURE__*/_react.default.memo(_styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  width: 100%;\n"]))));
-
 var WidthProvider = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(WidthProvider, _React$Component);
 
@@ -102,12 +100,13 @@ var WidthProvider = /*#__PURE__*/function (_React$Component) {
   (0, _createClass2.default)(WidthProvider, [{
     key: "render",
     value: function render() {
-      return /*#__PURE__*/_react.default.createElement(RelativeContainer, {
+      return (0, _react2.jsx)("div", {
+        css: (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n          position: relative;\n          width: 100%;\n        "]))),
         className: this.props.className
-      }, /*#__PURE__*/_react.default.createElement(_widthDetector.WidthObserver, {
+      }, (0, _react2.jsx)(_widthDetector.WidthObserver, {
         setWidth: this.setWidth,
         offscreen: true
-      }), /*#__PURE__*/_react.default.createElement(Provider, {
+      }), (0, _react2.jsx)(Provider, {
         value: createWidthContext(this.state.width)
       }, this.props.children));
     }

package/dist/cjs/ui/clear-next-sibling-margin-top.js

@@ -5,15 +5,14 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ClearNextSiblingMarginTop = void 0;
+exports.clearNextSiblingMarginTopStyle = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _react = require("@emotion/react");
 
 var _templateObject;
 
 // We use !important to ensure next sibling gets the margin reset no matter what
-var ClearNextSiblingMarginTop = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  & + * {\n    margin-top: 0 !important;\n  }\n"])));
-
-exports.ClearNextSiblingMarginTop = ClearNextSiblingMarginTop;
+var clearNextSiblingMarginTopStyle = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  & + * {\n    margin-top: 0 !important;\n  }\n"])));
+exports.clearNextSiblingMarginTopStyle = clearNextSiblingMarginTopStyle;

package/dist/cjs/ui/index.js

@@ -19,12 +19,6 @@ Object.defineProperty(exports, "Caption", {
     return _Caption.default;
   }
 });
-Object.defineProperty(exports, "ClearNextSiblingMarginTop", {
-  enumerable: true,
-  get: function get() {
-    return _clearNextSiblingMarginTop.ClearNextSiblingMarginTop;
-  }
-});
 Object.defineProperty(exports, "DEFAULT_IMAGE_HEIGHT", {
   enumerable: true,
   get: function get() {
@@ -49,10 +43,10 @@ Object.defineProperty(exports, "ExpandIconWrapper", {
     return _Expand.ExpandIconWrapper;
   }
 });
-Object.defineProperty(exports, "ExpandLayoutWrapper", {
+Object.defineProperty(exports, "ExpandLayoutWrapperWithRef", {
   enumerable: true,
   get: function get() {
-    return _Expand.ExpandLayoutWrapper;
+    return _Expand.ExpandLayoutWrapperWithRef;
   }
 });
 Object.defineProperty(exports, "HelperMessage", {
@@ -61,28 +55,10 @@ Object.defineProperty(exports, "HelperMessage", {
     return _Messages.HelperMessage;
   }
 });
-Object.defineProperty(exports, "IntlLegacyFallbackProvider", {
-  enumerable: true,
-  get: function get() {
-    return _IntlLegacyFallbackProvider.IntlLegacyFallbackProvider;
-  }
-});
-Object.defineProperty(exports, "IntlNextErrorBoundary", {
-  enumerable: true,
-  get: function get() {
-    return _IntlNextErrorBoundary.IntlNextErrorBoundary;
-  }
-});
-Object.defineProperty(exports, "LegacyToNextIntlProvider", {
-  enumerable: true,
-  get: function get() {
-    return _LegacyToNextIntlProvider.LegacyToNextIntlProvider;
-  }
-});
-Object.defineProperty(exports, "MediaLink", {
+Object.defineProperty(exports, "IntlErrorBoundary", {
   enumerable: true,
   get: function get() {
-    return _link.MediaLink;
+    return _IntlErrorBoundary.IntlErrorBoundary;
   }
 });
 Object.defineProperty(exports, "MediaSingle", {
@@ -106,7 +82,7 @@ Object.defineProperty(exports, "Popup", {
 Object.defineProperty(exports, "REACT_INTL_ERROR_MESSAGE", {
   enumerable: true,
   get: function get() {
-    return _IntlNextErrorBoundary.REACT_INTL_ERROR_MESSAGE;
+    return _IntlErrorBoundary.REACT_INTL_ERROR_MESSAGE;
   }
 });
 Object.defineProperty(exports, "UnsupportedBlock", {
@@ -169,6 +145,18 @@ Object.defineProperty(exports, "calcPxFromPct", {
     return _grid.calcPxFromPct;
   }
 });
+Object.defineProperty(exports, "clearNextSiblingMarginTopStyle", {
+  enumerable: true,
+  get: function get() {
+    return _clearNextSiblingMarginTop.clearNextSiblingMarginTopStyle;
+  }
+});
+Object.defineProperty(exports, "expandLayoutWrapperStyle", {
+  enumerable: true,
+  get: function get() {
+    return _Expand.expandLayoutWrapperStyle;
+  }
+});
 Object.defineProperty(exports, "expandMessages", {
   enumerable: true,
   get: function get() {
@@ -199,6 +187,12 @@ Object.defineProperty(exports, "mapBreakpointToLayoutMaxWidth", {
     return _BaseTheme.mapBreakpointToLayoutMaxWidth;
   }
 });
+Object.defineProperty(exports, "mediaLinkStyle", {
+  enumerable: true,
+  get: function get() {
+    return _link.mediaLinkStyle;
+  }
+});
 Object.defineProperty(exports, "overflowShadow", {
   enumerable: true,
   get: function get() {
@@ -274,11 +268,7 @@ var _Messages = require("./Messages");
 
 var _clearNextSiblingMarginTop = require("./clear-next-sibling-margin-top");
 
-var _IntlNextErrorBoundary = require("./IntlNextErrorBoundary");
-
-var _IntlLegacyFallbackProvider = require("./IntlLegacyFallbackProvider");
-
-var _LegacyToNextIntlProvider = require("./LegacyToNextIntlProvider");
+var _IntlErrorBoundary = require("./IntlErrorBoundary");
 
 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); }
 

package/dist/cjs/utils/compare-props.js

@@ -0,0 +1,136 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.serializeValue = exports.getShallowPropsDifference = exports.getPropsDifference = exports.getKeysAddedRemovedCommon = exports.getKeys = void 0;
+
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var getKeys = Object.keys;
+exports.getKeys = getKeys;
+
+var getKeysAddedRemovedCommon = function getKeysAddedRemovedCommon(object1, object2) {
+  var oldKeys = object1 !== null ? getKeys(object1) : [];
+  var newKeys = object2 !== null ? getKeys(object2) : [];
+  var removed = oldKeys.filter(function (key) {
+    return !newKeys.includes(key);
+  });
+  var added = newKeys.filter(function (key) {
+    return !oldKeys.includes(key);
+  });
+  var common = oldKeys.filter(function (key) {
+    return newKeys.includes(key);
+  });
+  return {
+    added: added,
+    common: common,
+    removed: removed
+  };
+};
+
+exports.getKeysAddedRemovedCommon = getKeysAddedRemovedCommon;
+
+var serializeValue = function serializeValue(value) {
+  var valueType = (0, _typeof2.default)(value);
+
+  if (value === null) {
+    return 'null';
+  } else if (value === undefined) {
+    return 'undefined';
+  } else if (valueType === 'string' || valueType === 'number') {
+    return value;
+  } else if (valueType === 'symbol') {
+    return value.toString();
+  } // Calling toString of function returns whole function text with body.
+  // So, just return function with name.
+  else if (valueType === 'function') {
+    return "function:".concat(value.name);
+  } else if (valueType === 'object') {
+    return {
+      type: 'object',
+      keys: Object.keys(value)
+    };
+  }
+};
+
+exports.serializeValue = serializeValue;
+
+var getPropsDifference = function getPropsDifference(object1, object2) {
+  var curDepth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+  var maxDepth = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 2;
+  var keysToIgnore = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : [];
+
+  var _getKeysAddedRemovedC = getKeysAddedRemovedCommon(object1, object2),
+      added = _getKeysAddedRemovedC.added,
+      common = _getKeysAddedRemovedC.common,
+      removed = _getKeysAddedRemovedC.removed;
+
+  var changed = [];
+  common.forEach(function (key) {
+    var value1 = object1[key];
+    var value2 = object2[key];
+    var value1Type = (0, _typeof2.default)(value1);
+    var value2Type = (0, _typeof2.default)(value2); // Do comparision only if values doesn't match (or reference to same object in memory).
+    // Or if key does not exist in keys to ignore.
+
+    if (value1 !== value2 && keysToIgnore.indexOf(key) === -1) {
+      // if both key value are objects and not referencing same object in memory.
+      //  then get recursive difference.
+      if ( /*#__PURE__*/_react.default.isValidElement(value1) || /*#__PURE__*/_react.default.isValidElement(value2)) {
+        changed.push({
+          key: key,
+          reactElementChanged: true
+        });
+      } else if (value1Type === 'object' && value2Type === 'object') {
+        if (curDepth <= maxDepth) {
+          var difference = getPropsDifference(value1, value2, curDepth + 1, maxDepth);
+          changed.push({
+            key: key,
+            difference: difference
+          });
+        } else {
+          changed.push({
+            key: key,
+            maxDepthReached: true
+          });
+        }
+      } else {
+        changed.push({
+          key: key,
+          oldValue: serializeValue(value1),
+          newValue: serializeValue(value2)
+        });
+      }
+    }
+  });
+  return {
+    added: added,
+    changed: changed,
+    removed: removed
+  };
+};
+
+exports.getPropsDifference = getPropsDifference;
+
+var getShallowPropsDifference = function getShallowPropsDifference(object1, object2) {
+  var _getKeysAddedRemovedC2 = getKeysAddedRemovedCommon(object1, object2),
+      added = _getKeysAddedRemovedC2.added,
+      common = _getKeysAddedRemovedC2.common,
+      removed = _getKeysAddedRemovedC2.removed;
+
+  var changed = common.filter(function (key) {
+    return object1[key] !== object2[key];
+  });
+  return {
+    added: added,
+    changed: changed,
+    removed: removed
+  };
+};
+
+exports.getShallowPropsDifference = getShallowPropsDifference;

package/dist/cjs/utils/index.js

@@ -179,12 +179,24 @@ Object.defineProperty(exports, "getModeFromTheme", {
     return _getModeFromTheme.getModeFromTheme;
   }
 });
+Object.defineProperty(exports, "getPropsDifference", {
+  enumerable: true,
+  get: function get() {
+    return _compareProps.getPropsDifference;
+  }
+});
 Object.defineProperty(exports, "getResponseEndTime", {
   enumerable: true,
   get: function get() {
     return _navigation.getResponseEndTime;
   }
 });
+Object.defineProperty(exports, "getShallowPropsDifference", {
+  enumerable: true,
+  get: function get() {
+    return _compareProps.getShallowPropsDifference;
+  }
+});
 Object.defineProperty(exports, "getTTISeverity", {
   enumerable: true,
   get: function get() {
@@ -335,6 +347,12 @@ Object.defineProperty(exports, "todayTimestampInUTC", {
     return _date.todayTimestampInUTC;
   }
 });
+Object.defineProperty(exports, "useComponentRenderTracking", {
+  enumerable: true,
+  get: function get() {
+    return _useComponentRenderTracking.useComponentRenderTracking;
+  }
+});
 Object.defineProperty(exports, "validateADFEntity", {
   enumerable: true,
   get: function get() {
@@ -404,4 +422,8 @@ var _browserExtensions = require("./browser-extensions");
 
 var _renderCount = require("./profiler/render-count");
 
-var _validateUsingSpec = require("./validate-using-spec");
+var _validateUsingSpec = require("./validate-using-spec");
+
+var _compareProps = require("./compare-props");
+
+var _useComponentRenderTracking = require("./performance/hooks/use-component-render-tracking");

package/dist/cjs/utils/performance/hooks/use-component-render-tracking/index.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useComponentRenderTracking = useComponentRenderTracking;
+
+var _react = require("react");
+
+var _adfSchema = require("@atlaskit/adf-schema");
+
+var _compareProps = require("../../../compare-props");
+
+function useComponentRenderTracking(_ref) {
+  var onRender = _ref.onRender,
+      propsDiffingOptions = _ref.propsDiffingOptions,
+      _ref$zeroBasedCount = _ref.zeroBasedCount,
+      zeroBasedCount = _ref$zeroBasedCount === void 0 ? true : _ref$zeroBasedCount;
+  var propsRef = (0, _react.useRef)();
+  var renderCountRef = (0, _react.useRef)(zeroBasedCount ? 0 : 1);
+
+  var _useRef = (0, _react.useRef)(_adfSchema.uuid.generate()),
+      componentId = _useRef.current;
+
+  (0, _react.useEffect)(function () {
+    var lastProps = propsRef.current;
+    var renderCount = renderCountRef.current;
+    var propsDifference;
+
+    if (propsDiffingOptions !== null && propsDiffingOptions !== void 0 && propsDiffingOptions.enabled && lastProps) {
+      propsDifference = propsDiffingOptions !== null && propsDiffingOptions !== void 0 && propsDiffingOptions.useShallow ? (0, _compareProps.getShallowPropsDifference)(lastProps, propsDiffingOptions.props) : (0, _compareProps.getPropsDifference)(lastProps, propsDiffingOptions.props, 0, 2, propsDiffingOptions === null || propsDiffingOptions === void 0 ? void 0 : propsDiffingOptions.propsToIgnore);
+    }
+
+    var result = {
+      renderCount: renderCount,
+      propsDifference: propsDifference,
+      componentId: componentId
+    };
+    onRender(result);
+
+    if (propsDiffingOptions !== null && propsDiffingOptions !== void 0 && propsDiffingOptions.enabled) {
+      propsRef.current = propsDiffingOptions.props;
+    }
+
+    renderCountRef.current = renderCountRef.current + 1;
+  }); // No dependencies run on each render
+}

package/dist/cjs/utils/validator.js

@@ -399,7 +399,7 @@ var getValidNode = function getValidNode(originalNode) {
             mediaCollection = collection;
           }
 
-          if (mediaId && mediaCollection && adfStage === 'stage0') {
+          if (mediaId && mediaCollection) {
             return {
               type: type,
               attrs: attrs,

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "64.0.0",
+	"version": "66.0.1",
 	"sideEffects": false
 }

package/dist/es2019/i18n/cs.js

@@ -1,13 +1,13 @@
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
-// Czech
+//Czech
 export default {
-  'fabric.editor.codeBidiWarningLabel': 'Obousměrné znaky mění pořadí vykreslování textu. Může to být použito k zakrytí škodlivého kódu.',
   'fabric.editor.captionPlaceholder': 'Přidejte popisek',
+  'fabric.editor.codeBidiWarningLabel': 'Obousměrné znaky mění pořadí vykreslování textu. Může to být použito k zakrytí škodlivého kódu.',
   'fabric.editor.collapseNode': 'Sbalit obsah',
   'fabric.editor.expandDefaultTitle': 'Klikněte sem pro rozbalení...',
   'fabric.editor.expandNode': 'Rozbalit obsah',

package/dist/es2019/i18n/da.js

@@ -1,13 +1,13 @@
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
-// Danish
+//Danish (Denmark)
 export default {
-  'fabric.editor.codeBidiWarningLabel': 'Tegn med tovejsfunktionalitet ændrer rækkefølgen, som teksten er gengivet i. Dette kan udnyttes til at skjule skadelig kode.',
   'fabric.editor.captionPlaceholder': 'Tilføj en billedtekst',
+  'fabric.editor.codeBidiWarningLabel': 'Tegn med tovejsfunktionalitet ændrer rækkefølgen, som teksten er gengivet i. Dette kan udnyttes til at skjule skadelig kode.',
   'fabric.editor.collapseNode': 'skjul indhold',
   'fabric.editor.expandDefaultTitle': 'Klik her for at udvide...',
   'fabric.editor.expandNode': 'Udvid indhold',

package/dist/es2019/i18n/de.js

@@ -1,13 +1,13 @@
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
-// German
+//German (Germany)
 export default {
-  'fabric.editor.codeBidiWarningLabel': 'Bidirektionale Zeichen ändern die Reihenfolge, in der Text gerendert wird. Dies könnte verwendet werden, um bösartigen Code zu verbergen.',
   'fabric.editor.captionPlaceholder': 'Eine Bildunterschrift hinzufügen',
+  'fabric.editor.codeBidiWarningLabel': 'Bidirektionale Zeichen ändern die Reihenfolge, in der Text gerendert wird. Dies könnte verwendet werden, um bösartigen Code zu verbergen.',
   'fabric.editor.collapseNode': 'Inhaltsanzeige reduzieren',
   'fabric.editor.expandDefaultTitle': 'Klicken Sie hier, um zu erweitern …',
   'fabric.editor.expandNode': 'Inhaltsanzeige erweitern',

package/dist/es2019/i18n/en.js

@@ -0,0 +1,19 @@
+/**
+ * NOTE:
+ *
+ * This file is automatically generated by Traduki 2.0.
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
+ */
+//
+export default {
+  'fabric.editor.captionPlaceholder': 'Add a caption',
+  'fabric.editor.codeBidiWarningLabel': 'Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code.',
+  'fabric.editor.collapseNode': 'Collapse content',
+  'fabric.editor.expandDefaultTitle': 'Click here to expand...',
+  'fabric.editor.expandNode': 'Expand content',
+  'fabric.editor.expandPlaceholder': 'Give this expand a title...',
+  'fabric.editor.openLink': 'Open link in a new tab',
+  'fabric.editor.unsupportedBlockContent': 'This editor does not support displaying this content',
+  'fabric.editor.unsupportedContentTooltip': 'Content is not available in this editor, this will be preserved when you edit and save',
+  'fabric.editor.unsupportedInlineContent': 'Unsupported content'
+};

package/dist/es2019/i18n/en_GB.js

@@ -0,0 +1,19 @@
+/**
+ * NOTE:
+ *
+ * This file is automatically generated by Traduki 2.0.
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
+ */
+//English (United Kingdom)
+export default {
+  'fabric.editor.captionPlaceholder': 'Add a caption',
+  'fabric.editor.codeBidiWarningLabel': 'Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code.',
+  'fabric.editor.collapseNode': 'Collapse content',
+  'fabric.editor.expandDefaultTitle': 'Click here to expand...',
+  'fabric.editor.expandNode': 'Expand content',
+  'fabric.editor.expandPlaceholder': 'Give this expand a title...',
+  'fabric.editor.openLink': 'Open link in a new tab',
+  'fabric.editor.unsupportedBlockContent': 'This editor does not support displaying this content',
+  'fabric.editor.unsupportedContentTooltip': 'Content is not available in this editor, this will be preserved when you edit and save',
+  'fabric.editor.unsupportedInlineContent': 'Unsupported content'
+};

package/dist/es2019/i18n/en_ZZ.js

@@ -0,0 +1,19 @@
+/**
+ * NOTE:
+ *
+ * This file is automatically generated by Traduki 2.0.
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
+ */
+//
+export default {
+  'fabric.editor.captionPlaceholder': '⁣⁢Add a caption؜‌‍‌‌‌‌‍⁠‍⁣⁤',
+  'fabric.editor.codeBidiWarningLabel': '⁣⁢Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code.‌⁡؜‍⁠⁠‌؜‌⁣⁤',
+  'fabric.editor.collapseNode': '⁣⁢Collapse content‍⁡‌⁠؜‍‍‌؜⁠‌⁡‍⁡‌⁣⁤',
+  'fabric.editor.expandDefaultTitle': '⁣⁢Click here to expand...‍؜‍⁡‍‍؜⁡⁠‌⁡؜⁣⁤',
+  'fabric.editor.expandNode': '⁣⁢Expand content⁡⁠⁠؜‍⁠؜‍‌؜؜⁡⁣⁤',
+  'fabric.editor.expandPlaceholder': '⁣⁢Give this expand a title...؜⁠⁡‍؜؜؜⁡⁣⁤',
+  'fabric.editor.openLink': '⁣⁢Open link in a new tab⁠⁡⁡‌‍‌⁠‌‌⁡⁡⁣⁤',
+  'fabric.editor.unsupportedBlockContent': '⁣⁢This editor does not support displaying this content؜‍؜⁡‍؜‌؜⁡⁣⁤',
+  'fabric.editor.unsupportedContentTooltip': '⁣⁢Content is not available in this editor, this will be preserved when you edit and save⁠‌‌؜‍‌‌⁡؜‍⁠‍⁡⁣⁤',
+  'fabric.editor.unsupportedInlineContent': '⁣⁢Unsupported content⁠‍⁡؜⁠⁠⁣⁤'
+};

package/dist/es2019/i18n/es.js

@@ -1,13 +1,13 @@
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
-// Spanish
+//Spanish (International)
 export default {
-  'fabric.editor.codeBidiWarningLabel': 'Los caracteres bidireccionales cambian el orden de renderización del texto. Esto podría utilizarse para ocultar código malicioso.',
   'fabric.editor.captionPlaceholder': 'Añadir un subtítulo',
+  'fabric.editor.codeBidiWarningLabel': 'Los caracteres bidireccionales cambian el orden de renderización del texto. Esto podría utilizarse para ocultar código malicioso.',
   'fabric.editor.collapseNode': 'contraer contenido',
   'fabric.editor.expandDefaultTitle': 'Haz clic aquí para ampliar...',
   'fabric.editor.expandNode': 'Ampliar contenido',