@atlaskit/renderer 114.11.1 → 114.11.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/renderer
 
+## 114.11.2
+
+### Patch Changes
+
+- [#147828](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/147828)
+  [`874be077a3f5f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/874be077a3f5f) -
+  Wrap RendererFunctionalComponent into memo
+
 ## 114.11.1
 
 ### Patch Changes

package/dist/cjs/react/marks/alignment.js

@@ -6,28 +6,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = Alignment;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _adfSchema = require("@atlaskit/adf-schema");
-var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
-var _templateObject;
 /**
  * @jsxRuntime classic
  * @jsx jsx
  */
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-var MarkWrapperOld = function MarkWrapperOld(props) {
-  var styles = props['data-align'] ? // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
-  (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\ttext-align: ", ";\n\t\t\t"])), _adfSchema.alignmentPositionMap[props['data-align']]) : '';
-  return (0, _react2.jsx)("div", (0, _extends2.default)({
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
-    css: styles
-    // Ignored via go/ees005
-    // eslint-disable-next-line react/jsx-props-no-spreading
-  }, props), props.children);
-};
-var MarkWrapperNew = function MarkWrapperNew(props) {
+
+var MarkWrapper = function MarkWrapper(props) {
   var dataAlign = props['data-align'] ? _adfSchema.alignmentPositionMap[props['data-align']] : undefined;
   return (0, _react2.jsx)("div", (0, _extends2.default)({
     style: {
@@ -37,7 +26,6 @@ var MarkWrapperNew = function MarkWrapperNew(props) {
     // eslint-disable-next-line react/jsx-props-no-spreading
   }, props), props.children);
 };
-var MarkWrapper = (0, _platformFeatureFlagsReact.componentWithFG)('platform_editor_emotion_refactor_renderer', MarkWrapperNew, MarkWrapperOld);
 function Alignment(props) {
   return (0, _react2.jsx)(MarkWrapper
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766

package/dist/cjs/react/nodes/codeBlock/components/codeBlockContainer.js

@@ -6,24 +6,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("@emotion/react");
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _colors = require("@atlaskit/theme/colors");
 var _styles = require("@atlaskit/editor-common/styles");
 var _codeBlockButtonContainer = _interopRequireDefault(require("./codeBlockButtonContainer"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _templateObject;
 /**
  * @jsxRuntime classic
  * @jsx jsx
  */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-var codeBlockStyleOverridesOld = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\ttab-size: 4;\n\tbackground-color: ", ";\n\n\t&:hover {\n\t\tbutton {\n\t\t\topacity: 1;\n\t\t}\n\t}\n\n\tbutton {\n\t\topacity: 0;\n\t\ttransition: opacity 0.2s ease 0s;\n\t}\n\n\t", " {\n\t\tfont-size: ", ";\n\t\tline-height: 1.5rem;\n\t\tbackground-image: ", ";\n\t\tbackground-attachment: local, local, local, local, scroll, scroll, scroll, scroll;\n\t\tbackground-position:\n\t\t\t0 0,\n\t\t\t0 0,\n\t\t\t100% 0,\n\t\t\t100% 0,\n\t\t\t100% 0,\n\t\t\t100% 0,\n\t\t\t0 0,\n\t\t\t0 0;\n\t}\n"])), "var(--ds-surface-raised, ".concat(_colors.N20, ")"), _styles.CodeBlockSharedCssClassName.DS_CODEBLOCK, (0, _editorSharedStyles.relativeFontSizeToBase16)(14), (0, _editorSharedStyles.overflowShadow)({
-  leftCoverWidth: "var(--ds-space-300, 24px)"
-}));
-var codeBlockStyleOverridesNew = (0, _react.css)((0, _defineProperty2.default)({
+
+var codeBlockStyleOverrides = (0, _react.css)((0, _defineProperty2.default)({
   tabSize: 4,
   backgroundColor: "var(--ds-surface-raised, ".concat(_colors.N20, ")"),
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -57,7 +50,7 @@ var CodeBlockContainer = function CodeBlockContainer(_ref) {
   return (0, _react.jsx)("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: className,
-    css: (0, _platformFeatureFlags.fg)('platform_editor_emotion_refactor_renderer') ? codeBlockStyleOverridesNew : codeBlockStyleOverridesOld
+    css: codeBlockStyleOverrides
   }, (0, _react.jsx)(_codeBlockButtonContainer.default, {
     allowCopyToClipboard: allowCopyToClipboard,
     allowWrapCodeBlock: allowWrapCodeBlock,

package/dist/cjs/react/nodes/codeBlock/components/lightWeightCodeBlock.js

@@ -12,10 +12,9 @@ var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _styles = require("@atlaskit/editor-common/styles");
-var _useBidiWarnings3 = require("../../../hooks/use-bidi-warnings");
+var _useBidiWarnings2 = require("../../../hooks/use-bidi-warnings");
 var _consts = require("../../../../consts");
-var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
-var _templateObject, _templateObject2;
+var _templateObject;
 /* eslint-disable @atlaskit/ui-styling-standard/no-imported-style-values */
 /* eslint-disable @atlaskit/ui-styling-standard/no-unsafe-values */
 /* eslint-disable @atlaskit/ui-styling-standard/no-nested-selectors */
@@ -26,7 +25,7 @@ var _templateObject, _templateObject2;
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-var codeBlockSharedStylesNew = (0, _react2.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(_styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPED, "\n\t\t> .").concat(_styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER, "\n\t\t> .").concat(_styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT), {
+var codeBlockSharedStyles = (0, _react2.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(_styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPED, "\n\t\t> .").concat(_styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER, "\n\t\t> .").concat(_styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT), {
   marginRight: "var(--ds-space-100, 8px)",
   code: {
     display: 'block',
@@ -125,10 +124,7 @@ var codeBlockSharedStylesNew = (0, _react2.css)((0, _defineProperty2.default)((0
   color: "var(--ds-text-subtlest, #505F79)",
   boxSizing: 'content-box'
 })));
-
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-var lightWeightCodeBlockStylesOld = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tcursor: text;\n\t}\n"])), _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER);
-var lightWeightCodeBlockStylesNew = (0, _react2.css)((0, _defineProperty2.default)({}, ".".concat(_styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER), {
+var lightWeightCodeBlockStyles = (0, _react2.css)((0, _defineProperty2.default)({}, ".".concat(_styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER), {
   cursor: 'text'
 }));
 var LightWeightCodeBlockCssClassName = exports.LightWeightCodeBlockCssClassName = {
@@ -147,9 +143,9 @@ var getLightWeightCodeBlockStylesForRootRendererStyleSheet = exports.getLightWei
   // NOTE: This must be added after other .code-block styles in the root
   // Renderer stylesheet.
   // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
-  return (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t\t.", "\n\t\t\t> .", "\n\t\t\t.", " {\n\t\t\tmargin-top: ", ";\n\t\t}\n\t"])), _consts.RendererCssClassName.DOCUMENT, LightWeightCodeBlockCssClassName.CONTAINER, _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, _editorSharedStyles.blockNodesVerticalMargin);
+  return (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t\t.", "\n\t\t\t> .", "\n\t\t\t.", " {\n\t\t\tmargin-top: ", ";\n\t\t}\n\t"])), _consts.RendererCssClassName.DOCUMENT, LightWeightCodeBlockCssClassName.CONTAINER, _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, _editorSharedStyles.blockNodesVerticalMargin);
 };
-var LightWeightCodeBlockOld = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+var LightWeightCodeBlock = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var text = _ref.text,
     _ref$codeBidiWarningT = _ref.codeBidiWarningTooltipEnabled,
     codeBidiWarningTooltipEnabled = _ref$codeBidiWarningT === void 0 ? true : _ref$codeBidiWarningT,
@@ -157,51 +153,11 @@ var LightWeightCodeBlockOld = /*#__PURE__*/(0, _react.forwardRef)(function (_ref
   var textRows = (0, _react.useMemo)(function () {
     return (text !== null && text !== void 0 ? text : '').split('\n');
   }, [text]);
-  var _useBidiWarnings = (0, _useBidiWarnings3.useBidiWarnings)({
+  var _useBidiWarnings = (0, _useBidiWarnings2.useBidiWarnings)({
       enableWarningTooltip: codeBidiWarningTooltipEnabled
     }),
     renderBidiWarnings = _useBidiWarnings.renderBidiWarnings;
   var classNames = [LightWeightCodeBlockCssClassName.CONTAINER, className].join(' ');
-  return (0, _react2.jsx)("div", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: classNames,
-    ref: ref
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    ,
-    css: [(0, _styles.codeBlockSharedStyles)(), lightWeightCodeBlockStylesOld]
-  }, (0, _react2.jsx)("div", {
-    className: _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER
-  }, (0, _react2.jsx)("div", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER
-  }, (0, _react2.jsx)("div", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: _styles.CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER
-  }, textRows.map(function (_, index) {
-    return (
-      // Ignored via go/ees005
-      // eslint-disable-next-line react/no-array-index-key
-      (0, _react2.jsx)("span", {
-        key: index
-      })
-    );
-  })), (0, _react2.jsx)("div", {
-    className: _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT
-  }, (0, _react2.jsx)("code", null, renderBidiWarnings(text))))));
-});
-var LightWeightCodeBlockNew = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
-  var text = _ref2.text,
-    _ref2$codeBidiWarning = _ref2.codeBidiWarningTooltipEnabled,
-    codeBidiWarningTooltipEnabled = _ref2$codeBidiWarning === void 0 ? true : _ref2$codeBidiWarning,
-    className = _ref2.className;
-  var textRows = (0, _react.useMemo)(function () {
-    return (text !== null && text !== void 0 ? text : '').split('\n');
-  }, [text]);
-  var _useBidiWarnings2 = (0, _useBidiWarnings3.useBidiWarnings)({
-      enableWarningTooltip: codeBidiWarningTooltipEnabled
-    }),
-    renderBidiWarnings = _useBidiWarnings2.renderBidiWarnings;
-  var classNames = [LightWeightCodeBlockCssClassName.CONTAINER, className].join(' ');
   var codeBlockBackgroundImage = (0, _editorSharedStyles.overflowShadow)({
     leftCoverWidth: "var(--ds-space-300, 24px)"
   });
@@ -211,7 +167,7 @@ var LightWeightCodeBlockNew = /*#__PURE__*/(0, _react.forwardRef)(function (_ref
     ref: ref
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     ,
-    css: [codeBlockSharedStylesNew, lightWeightCodeBlockStylesNew],
+    css: [codeBlockSharedStyles, lightWeightCodeBlockStyles],
     style: {
       '--ak-renderer-codeblock-content-wrapper-bg-img': codeBlockBackgroundImage
     }
@@ -235,5 +191,4 @@ var LightWeightCodeBlockNew = /*#__PURE__*/(0, _react.forwardRef)(function (_ref
     className: _styles.CodeBlockSharedCssClassName.CODEBLOCK_CONTENT
   }, (0, _react2.jsx)("code", null, renderBidiWarnings(text))))));
 });
-var LightWeightCodeBlock = (0, _platformFeatureFlagsReact.componentWithFG)('platform_editor_emotion_refactor_renderer', LightWeightCodeBlockNew, LightWeightCodeBlockOld);
 var _default = exports.default = LightWeightCodeBlock;

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

@@ -9,7 +9,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _ui = require("@atlaskit/editor-common/ui");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -18,7 +17,7 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
 // localized styles, was from clearNextSiblingMarginTopStyle in @atlaskit/editor-common/ui
-var clearNextSiblingMarginTopStyleNew = (0, _react2.css)({
+var clearNextSiblingMarginTopStyle = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& + *': {
     // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
@@ -27,17 +26,10 @@ var clearNextSiblingMarginTopStyleNew = (0, _react2.css)({
 });
 
 // localized styles, was from clearNextSiblingBlockMarkMarginTopStyle in @atlaskit/editor-common/ui
-var clearNextSiblingBlockMarkMarginTopStyleNew = (0, _react2.css)((0, _defineProperty2.default)({}, "+ .fabric-editor-block-mark > p,\n\t  + .fabric-editor-block-mark > h1,\n\t  + .fabric-editor-block-mark > h2,\n\t  + .fabric-editor-block-mark > h3,\n\t  + .fabric-editor-block-mark > h4,\n\t  + .fabric-editor-block-mark > h5,\n\t  + .fabric-editor-block-mark > h6\n\t", {
+var clearNextSiblingBlockMarkMarginTopStyle = (0, _react2.css)((0, _defineProperty2.default)({}, "+ .fabric-editor-block-mark > p,\n\t  + .fabric-editor-block-mark > h1,\n\t  + .fabric-editor-block-mark > h2,\n\t  + .fabric-editor-block-mark > h3,\n\t  + .fabric-editor-block-mark > h4,\n\t  + .fabric-editor-block-mark > h5,\n\t  + .fabric-editor-block-mark > h6\n\t", {
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
   marginTop: '0 !important'
 }));
-
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-var layoutColumnClearMarginTopStyles = (0, _react2.css)(
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-_ui.clearNextSiblingMarginTopStyle,
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-_ui.clearNextSiblingBlockMarkMarginTopStyle);
 function LayoutSection(props) {
   return (0, _react2.jsx)("div", {
     "data-layout-column": true,
@@ -46,6 +38,6 @@ function LayoutSection(props) {
       flexBasis: "".concat(props.width, "%")
     }
   }, (0, _react2.jsx)(_ui.WidthProvider, null, (0, _react2.jsx)("div", {
-    css: (0, _platformFeatureFlags.fg)('platform_editor_emotion_refactor_renderer') ? [clearNextSiblingMarginTopStyleNew, clearNextSiblingBlockMarkMarginTopStyleNew] : layoutColumnClearMarginTopStyles
+    css: [clearNextSiblingMarginTopStyle, clearNextSiblingBlockMarkMarginTopStyle]
   }), props.children));
 }

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

@@ -15,7 +15,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _analyticsNext = require("@atlaskit/analytics-next");
@@ -36,10 +35,8 @@ var _reactIntlNext = require("react-intl-next");
 var _useInlineCommentsFilter = require("../../../ui/annotations/hooks/use-inline-comments-filter");
 var _useInlineCommentSubscriber = require("../../../ui/annotations/hooks/use-inline-comment-subscriber");
 var _types = require("@atlaskit/editor-common/types");
-var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
 var _excluded = ["marks", "mediaSingleElement", "isDrafting"],
   _excluded2 = ["marks", "mediaSingleElement", "isDrafting"];
-var _templateObject;
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -65,19 +62,14 @@ var linkStyle = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
   height: '100% !important'
 });
-
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Ignored via go/DSP-18766
-var borderStyleOld = function borderStyleOld(color, width) {
-  return (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tposition: absolute;\n\twidth: 100% !important;\n\theight: 100% !important;\n\tborder-radius: ", "px;\n\tbox-shadow: 0 0 0 ", "px ", ";\n"])), width, width, color);
-};
-var borderStyleNew = (0, _react2.css)({
+var borderStyle = (0, _react2.css)({
   position: 'absolute',
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
   width: '100% !important',
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
   height: '100% !important'
 });
-var MediaBorderOld = function MediaBorderOld(_ref) {
+var MediaBorder = function MediaBorder(_ref) {
   var _mark$attrs$color, _mark$attrs$size;
   var mark = _ref.mark,
     children = _ref.children;
@@ -87,32 +79,11 @@ var MediaBorderOld = function MediaBorderOld(_ref) {
   var borderColor = (_mark$attrs$color = mark === null || mark === void 0 ? void 0 : mark.attrs.color) !== null && _mark$attrs$color !== void 0 ? _mark$attrs$color : '';
   var borderWidth = (_mark$attrs$size = mark === null || mark === void 0 ? void 0 : mark.attrs.size) !== null && _mark$attrs$size !== void 0 ? _mark$attrs$size : 0;
   var paletteColorValue = (0, _editorPalette.hexToEditorBorderPaletteColor)(borderColor) || borderColor;
-  return (0, _react2.jsx)("div", {
-    "data-mark-type": "border",
-    "data-color": borderColor,
-    "data-size": borderWidth
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    ,
-    css: borderStyleOld(paletteColorValue, borderWidth)
-  }, (0, _react2.jsx)(_ui.MediaBorderGapFiller, {
-    borderColor: borderColor
-  }), children);
-};
-var MediaBorderNew = function MediaBorderNew(_ref2) {
-  var _mark$attrs$color2, _mark$attrs$size2;
-  var mark = _ref2.mark,
-    children = _ref2.children;
-  if (!mark) {
-    return (0, _react2.jsx)(_react.Fragment, null, children);
-  }
-  var borderColor = (_mark$attrs$color2 = mark === null || mark === void 0 ? void 0 : mark.attrs.color) !== null && _mark$attrs$color2 !== void 0 ? _mark$attrs$color2 : '';
-  var borderWidth = (_mark$attrs$size2 = mark === null || mark === void 0 ? void 0 : mark.attrs.size) !== null && _mark$attrs$size2 !== void 0 ? _mark$attrs$size2 : 0;
-  var paletteColorValue = (0, _editorPalette.hexToEditorBorderPaletteColor)(borderColor) || borderColor;
   return (0, _react2.jsx)("div", {
     "data-mark-type": "border",
     "data-color": borderColor,
     "data-size": borderWidth,
-    css: borderStyleNew,
+    css: borderStyle,
     style: {
       borderRadius: "".concat(borderWidth, "px"),
       boxShadow: "0 0 0 ".concat(borderWidth, "px ").concat(paletteColorValue)
@@ -121,11 +92,10 @@ var MediaBorderNew = function MediaBorderNew(_ref2) {
     borderColor: borderColor
   }), children);
 };
-var MediaBorder = (0, _platformFeatureFlagsReact.componentWithFG)('platform_editor_emotion_refactor_renderer', MediaBorderNew, MediaBorderOld);
-var MediaLink = function MediaLink(_ref3) {
-  var mark = _ref3.mark,
-    children = _ref3.children,
-    onClick = _ref3.onClick;
+var MediaLink = function MediaLink(_ref2) {
+  var mark = _ref2.mark,
+    children = _ref2.children,
+    onClick = _ref2.onClick;
   if (!mark) {
     return (0, _react2.jsx)(_react.Fragment, null, children);
   }
@@ -138,9 +108,9 @@ var MediaLink = function MediaLink(_ref3) {
     css: linkStyle
   }, children);
 };
-var MediaAnnotation = function MediaAnnotation(_ref4) {
-  var mark = _ref4.mark,
-    children = _ref4.children;
+var MediaAnnotation = function MediaAnnotation(_ref3) {
+  var mark = _ref3.mark,
+    children = _ref3.children;
   if (!mark) {
     return (0, _react2.jsx)(_react.Fragment, null, children);
   }
@@ -158,10 +128,10 @@ var MediaAnnotation = function MediaAnnotation(_ref4) {
     useBlockLevel: true
   }, children);
 };
-var _MediaAnnotations = function MediaAnnotations(_ref5) {
-  var _ref5$marks = _ref5.marks,
-    marks = _ref5$marks === void 0 ? [] : _ref5$marks,
-    children = _ref5.children;
+var _MediaAnnotations = function MediaAnnotations(_ref4) {
+  var _ref4$marks = _ref4.marks,
+    marks = _ref4$marks === void 0 ? [] : _ref4$marks,
+    children = _ref4.children;
   // Early Exit
   if (marks.length === 0) {
     return (0, _react2.jsx)(_react.Fragment, null, children);
@@ -178,13 +148,13 @@ var _MediaAnnotations = function MediaAnnotations(_ref5) {
   }, children) : (0, _react2.jsx)(_react.Fragment, null, children)));
 };
 var CommentBadge = (0, _reactIntlNext.injectIntl)(_mediaSingle.CommentBadge);
-var CommentBadgeWrapper = function CommentBadgeWrapper(_ref6) {
+var CommentBadgeWrapper = function CommentBadgeWrapper(_ref5) {
   var _marks$map;
-  var marks = _ref6.marks,
-    mediaSingleElement = _ref6.mediaSingleElement,
-    _ref6$isDrafting = _ref6.isDrafting,
-    isDrafting = _ref6$isDrafting === void 0 ? false : _ref6$isDrafting,
-    rest = (0, _objectWithoutProperties2.default)(_ref6, _excluded);
+  var marks = _ref5.marks,
+    mediaSingleElement = _ref5.mediaSingleElement,
+    _ref5$isDrafting = _ref5.isDrafting,
+    isDrafting = _ref5$isDrafting === void 0 ? false : _ref5$isDrafting,
+    rest = (0, _objectWithoutProperties2.default)(_ref5, _excluded);
   var _useState = (0, _react.useState)('default'),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     status = _useState2[0],
@@ -261,13 +231,13 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref6) {
  * when clean up platform_editor_add_media_from_url feature flag
  */
 
-var CommentBadgeNextWrapper = function CommentBadgeNextWrapper(_ref7) {
+var CommentBadgeNextWrapper = function CommentBadgeNextWrapper(_ref6) {
   var _marks$map2;
-  var marks = _ref7.marks,
-    mediaSingleElement = _ref7.mediaSingleElement,
-    _ref7$isDrafting = _ref7.isDrafting,
-    isDrafting = _ref7$isDrafting === void 0 ? false : _ref7$isDrafting,
-    rest = (0, _objectWithoutProperties2.default)(_ref7, _excluded2);
+  var marks = _ref6.marks,
+    mediaSingleElement = _ref6.mediaSingleElement,
+    _ref6$isDrafting = _ref6.isDrafting,
+    isDrafting = _ref6$isDrafting === void 0 ? false : _ref6$isDrafting,
+    rest = (0, _objectWithoutProperties2.default)(_ref6, _excluded2);
   var _useState5 = (0, _react.useState)('default'),
     _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
     status = _useState6[0],
@@ -386,8 +356,8 @@ var Media = /*#__PURE__*/function (_PureComponent) {
         mediaWidth: width,
         mediaHeight: height,
         useMinimumZIndex: true
-      }, function (_ref9) {
-        var visible = _ref9.visible;
+      }, function (_ref8) {
+        var visible = _ref8.visible;
         return (0, _react2.jsx)(_react.default.Fragment, null, visible && (0, _react2.jsx)(_mediaSingle.ExternalImageBadge, {
           type: _this.props.type,
           url: _this.props.type === 'external' ? _this.props.url : undefined

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

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
@@ -18,11 +17,8 @@ var _emojiEditorEmoji = _interopRequireDefault(require("@atlaskit/icon/core/migr
 var _emoji = _interopRequireDefault(require("./emoji"));
 var _icons = require("@atlaskit/editor-common/icons");
 var _consts = require("@atlaskit/editor-shared-styles/consts");
-var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _templateObject, _templateObject2;
-var _excluded = ["backgroundColor", "hasIcon"],
-  _excluded2 = ["backgroundColor", "hasIcon"];
+var _excluded = ["backgroundColor", "hasIcon"];
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -167,29 +163,10 @@ var panelCustomBackground = (0, _react2.css)({
     }
   }
 });
-var PanelStyledOld = function PanelStyledOld(_ref) {
+var PanelStyled = function PanelStyled(_ref) {
   var backgroundColor = _ref.backgroundColor,
     hasIcon = _ref.hasIcon,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- nested css mixins are violations
-  var styles = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t\t&.", " {\n\t\t\t", "\n\n\t\t\t&[data-panel-type=", "] {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\t"])), _panel.PanelSharedCssClassName.prefix, (0, _panel.panelSharedStylesWithoutPrefix)(), _adfSchema.PanelType.CUSTOM, hasIcon ? '' : 'padding-left: 12px;padding-right: 12px;');
-  if (props['data-panel-type'] === _adfSchema.PanelType.CUSTOM && backgroundColor) {
-    // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- nested css mixins are violations
-    styles = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t&.", " {\n\t\t\t\t", "\n\t\t\t}\n\n\t\t\t&[data-panel-type=", "] {\n\t\t\t\tbackground-color: ", ";\n\t\t\t\t", "\n\t\t\t}\n\t\t"])), _panel.PanelSharedCssClassName.prefix, (0, _panel.panelSharedStylesWithoutPrefix)(), _adfSchema.PanelType.CUSTOM, (0, _editorPalette.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor, hasIcon ? '' : 'padding-left: 12px;padding-right: 12px;');
-  }
-  return (
-    // eslint-disable-next-line
-    // Ignored via go/ees005
-    // eslint-disable-next-line react/jsx-props-no-spreading, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    (0, _react2.jsx)("div", (0, _extends2.default)({
-      css: styles
-    }, props), props.children)
-  );
-};
-var PanelStyledNew = function PanelStyledNew(_ref2) {
-  var backgroundColor = _ref2.backgroundColor,
-    hasIcon = _ref2.hasIcon,
-    props = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
   var customBackgroundColor = backgroundColor ? (0, _editorPalette.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : undefined;
   return (0, _react2.jsx)("div", (0, _extends2.default)({
     style:
@@ -202,7 +179,6 @@ var PanelStyledNew = function PanelStyledNew(_ref2) {
     // eslint-disable-next-line react/jsx-props-no-spreading
   }, props), props.children);
 };
-var PanelStyled = (0, _platformFeatureFlagsReact.componentWithFG)('platform_editor_emotion_refactor_renderer', PanelStyledNew, PanelStyledOld);
 PanelStyled.displayName = 'PanelStyled';
 var panelIcons = {
   info: _icons.PanelInfoIcon,

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

@@ -17,7 +17,6 @@ var _colors = require("@atlaskit/theme/colors");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _table = require("./table");
 var _injectProps = require("../../utils/inject-props");
-var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -42,7 +41,7 @@ var modeSpecficStyles = {
 
 // refactored based on fixedTableDivStaticStyles
 // TODO: DSP-4123 - Quality ticket
-var fixedTableDivStaticStylesNew = (0, _react2.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
+var fixedTableDivStaticStyles = (0, _react2.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
   zIndex: 'var(--ak-renderer-sticky-header-zindex)'
 }, "& .".concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, ", & .").concat(_styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table"), {
   marginTop: 0,
@@ -60,59 +59,7 @@ var fixedTableDivStaticStylesNew = (0, _react2.css)((0, _defineProperty2.default
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   zIndex: 'var(--ak-renderer-sticky-header-zindex)'
 }));
-
-// TODO: DSP-4123 - Quality ticket
-var fixedTableDivStaticStyles = function fixedTableDivStaticStyles(top, width, allowTableResizing) {
-  var stickyHeaderZIndex;
-  if (allowTableResizing) {
-    stickyHeaderZIndex = 13;
-  } else {
-    stickyHeaderZIndex = _editorSharedStyles.akEditorStickyHeaderZIndex;
-  }
-
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  return (0, _react2.css)(typeof top === 'number' && "top: ".concat(top, "px;"), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    width: "".concat(width, "px"),
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    zIndex: stickyHeaderZIndex
-  }, "& .".concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, ", & .").concat(_styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table"), {
-    marginTop: 0,
-    marginBottom: 0,
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    tr: {
-      background: "var(--ds-surface, white)"
-    }
-  }), "borderTop", "".concat(tableStickyPadding, "px solid ", "var(--ds-surface, white)")), "background", "var(--ds-surface-overlay, white)"), "boxShadow", "0 6px 4px -4px ".concat("var(--ds-shadow-overflow-perimeter, ".concat(_colors.N40A, ")"))), "div[data-expanded='false'] &", {
-    display: 'none'
-  }), "& .".concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, ".is-sticky.right-shadow::after, & .").concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, ".is-sticky.left-shadow::before"), {
-    top: '0px',
-    height: '100%'
-  }), "&.fixed-table-div-custom-table-resizing[mode='stick']", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    zIndex: stickyHeaderZIndex
-  }));
-};
-var FixedTableDivOld = function FixedTableDivOld(props) {
-  var top = props.top,
-    wrapperWidth = props.wrapperWidth,
-    mode = props.mode,
-    allowTableResizing = props.allowTableResizing;
-  var fixedTableCss = [fixedTableDivStaticStyles(top, wrapperWidth, allowTableResizing), modeSpecficStyles === null || modeSpecficStyles === void 0 ? void 0 : modeSpecficStyles[mode]];
-  var attrs = {
-    mode: mode
-  };
-  return (0, _react2.jsx)("div", (0, _extends2.default)({}, attrs, {
-    "data-testid": "sticky-table-fixed"
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: allowTableResizing ? 'fixed-table-div-custom-table-resizing' : ''
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    ,
-    css: fixedTableCss
-  }), props.children);
-};
-var FixedTableDivNew = function FixedTableDivNew(props) {
+var FixedTableDiv = function FixedTableDiv(props) {
   var top = props.top,
     wrapperWidth = props.wrapperWidth,
     mode = props.mode,
@@ -131,7 +78,7 @@ var FixedTableDivNew = function FixedTableDivNew(props) {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
     className: allowTableResizing ? 'fixed-table-div-custom-table-resizing' : '',
-    css: [fixedTableDivStaticStylesNew, modeSpecficStyles === null || modeSpecficStyles === void 0 ? void 0 : modeSpecficStyles[mode]],
+    css: [fixedTableDivStaticStyles, modeSpecficStyles === null || modeSpecficStyles === void 0 ? void 0 : modeSpecficStyles[mode]],
     style: {
       '--ak-renderer-sticky-header-zindex': stickyHeaderZIndex,
       width: "".concat(wrapperWidth, "px"),
@@ -139,7 +86,6 @@ var FixedTableDivNew = function FixedTableDivNew(props) {
     }
   }), props.children);
 };
-var FixedTableDiv = (0, _platformFeatureFlagsReact.componentWithFG)('platform_editor_emotion_refactor_renderer', FixedTableDivNew, FixedTableDivOld);
 var StickyTable = exports.StickyTable = function StickyTable(_ref) {
   var top = _ref.top,
     left = _ref.left,