@atlaskit/renderer 114.11.1 → 114.12.0

package/dist/es2019/ui/annotations/draft/component.js

@@ -12,24 +12,11 @@ import { AnnotationsDraftContext } from '../context';
 import { splitText, calcTextSplitOffset, findTextString } from './text';
 import { calcInsertDraftPositionOnText } from './position';
 import { dataAttributes } from './dom';
-import { AnnotationSharedCSSByState } from '@atlaskit/editor-common/styles';
 import { segmentText } from '../../../react/utils/segment-text';
 import { renderTextSegments } from '../../../react/utils/render-text-segments';
-import { fg } from '@atlaskit/platform-feature-flags';
-
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-const markStyles = () => css({
-  color: 'inherit',
-  backgroundColor: 'unset',
-  WebkitTapHighlightColor: 'transparent'
-},
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-AnnotationSharedCSSByState().common,
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-AnnotationSharedCSSByState().focus);
 
 // Localized AnnotationSharedCSSByState().common and AnnotationSharedCSSByState().focus
-const markStylesNew = css({
+const markStyles = css({
   color: 'inherit',
   backgroundColor: 'unset',
   WebkitTapHighlightColor: 'transparent',
@@ -57,7 +44,7 @@ export const AnnotationDraft = ({
     // Ignored via go/ees005
     // eslint-disable-next-line react/jsx-props-no-spreading
   }, dataAttributes(draftPosition), {
-    css: fg('platform_editor_emotion_refactor_renderer') ? markStylesNew : markStyles
+    css: markStyles
   }), children);
 };
 export const getAnnotationIndex = (annotationPosition, fragmentCount) => {

package/dist/es2019/ui/annotations/element/mark.js

@@ -6,31 +6,11 @@
 import { useMemo, useCallback } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
-import { AnnotationSharedCSSByState } from '@atlaskit/editor-common/styles';
 import { AnnotationMarkStates } from '@atlaskit/adf-schema';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { useIntl } from 'react-intl-next';
 import { inlineCommentMessages } from '../../../messages';
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- `AnnotationSharedCSSByState` is not object-safe
-const markStylesOld = () => css`
-	color: inherit;
-	background-color: unset;
-	-webkit-tap-highlight-color: transparent;
-
-	&[data-mark-annotation-state='${AnnotationMarkStates.ACTIVE}'] {
-		${fg('editor_inline_comments_on_inline_nodes') ? AnnotationSharedCSSByState().common : ''}
-		${AnnotationSharedCSSByState().blur}
-
-		&:focus,
-			&[data-has-focus='true'] {
-			${AnnotationSharedCSSByState().focus}
-		}
-		&[data-is-hovered='true']:not([data-has-focus='true']) {
-			${fg('confluence-frontend-comments-panel') ? AnnotationSharedCSSByState().hover : ''}
-		}
-	}
-`;
-const markStylesNew = css({
+const markStyles = css({
   color: 'inherit',
   backgroundColor: 'unset',
   WebkitTapHighlightColor: 'transparent',
@@ -76,7 +56,7 @@ const markStylesWithUpdatedShadow = css({
     }
   }
 });
-const markStylesNewWithInlineComments = css({
+const markStylesWithInlineComments = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
   [`&[data-mark-annotation-state='${AnnotationMarkStates.ACTIVE}']`]: {
     // was from common in AnnotationSharedCSSByState().common
@@ -103,7 +83,7 @@ const markStylesNewWithInlineComments = css({
     }
   }
 });
-const markStylesNewWithCommentsPanel = css({
+const markStylesWithCommentsPanel = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
   [`&[data-mark-annotation-state='${AnnotationMarkStates.ACTIVE}']`]: {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
@@ -119,26 +99,7 @@ const isMobile = () => {
   // eslint-disable-next-line require-unicode-regexp
   return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
 };
-const accessibilityStylesOld = (startMarker, endMarker) => css({
-  '&::before, &::after': {
-    clipPath: 'inset(100%)',
-    clip: 'rect(1px, 1px, 1px, 1px)',
-    height: '1px',
-    overflow: 'hidden',
-    position: 'absolute',
-    whiteSpace: 'nowrap',
-    width: '1px'
-  },
-  '&::before': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
-    content: `' [${startMarker}] '`
-  },
-  '&::after': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
-    content: `' [${endMarker}] '`
-  }
-});
-const accessibilityStylesNew = css({
+const accessibilityStyles = css({
   '&::before, &::after': {
     clipPath: 'inset(100%)',
     clip: 'rect(1px, 1px, 1px, 1px)',
@@ -229,40 +190,17 @@ export const MarkComponent = ({
     'aria-details': annotationIds.join(', '),
     ...desktopAccessibilityAttributes
   };
-  const getAccessibilityStylesOld = () => {
-    if (isMobile()) {
-      return {};
-    }
-    if (state !== AnnotationMarkStates.RESOLVED) {
-      const startMarker = intl.formatMessage(inlineCommentMessages.contentRendererInlineCommentMarkerStart);
-      const endMarker = intl.formatMessage(inlineCommentMessages.contentRendererInlineCommentMarkerEnd);
-      return accessibilityStylesOld(startMarker, endMarker);
-    } else {
-      return {};
-    }
-  };
-  if (fg('platform_editor_emotion_refactor_renderer')) {
-    return jsx(useBlockLevel ? 'div' : 'mark', {
-      id,
-      [fg('editor_inline_comments_on_inline_nodes') ? 'onClickCapture' : 'onClick']: onMarkClick,
-      ...accessibility,
-      ...overriddenData,
-      ...(!useBlockLevel && {
-        css: [markStylesNew, fg('platform_renderer_nested_annotation_styling') && markStylesLayeringFix, fg('editor_inline_comments_on_inline_nodes') && markStylesNewWithInlineComments, fg('confluence-frontend-comments-panel') && markStylesNewWithCommentsPanel, !isMobile() && accessibilityStylesNew, markStylesWithUpdatedShadow],
-        style: {
-          '--ak-renderer-annotation-startmarker': intl.formatMessage(inlineCommentMessages.contentRendererInlineCommentMarkerStart),
-          '--ak-renderer-annotation-endmarker': intl.formatMessage(inlineCommentMessages.contentRendererInlineCommentMarkerEnd)
-        }
-      })
-    }, children);
-  }
   return jsx(useBlockLevel ? 'div' : 'mark', {
     id,
     [fg('editor_inline_comments_on_inline_nodes') ? 'onClickCapture' : 'onClick']: onMarkClick,
     ...accessibility,
     ...overriddenData,
     ...(!useBlockLevel && {
-      css: [markStylesOld, getAccessibilityStylesOld()]
+      css: [markStyles, fg('platform_renderer_nested_annotation_styling') && markStylesLayeringFix, fg('editor_inline_comments_on_inline_nodes') && markStylesWithInlineComments, fg('confluence-frontend-comments-panel') && markStylesWithCommentsPanel, !isMobile() && accessibilityStyles, markStylesWithUpdatedShadow],
+      style: {
+        '--ak-renderer-annotation-startmarker': intl.formatMessage(inlineCommentMessages.contentRendererInlineCommentMarkerStart),
+        '--ak-renderer-annotation-endmarker': intl.formatMessage(inlineCommentMessages.contentRendererInlineCommentMarkerEnd)
+      }
     })
   }, children);
 };

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

@@ -1,26 +1,13 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
 /**
  * @jsxRuntime classic
  * @jsx jsx
  */
 import React from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
+import { jsx } from '@emotion/react';
 import { alignmentPositionMap } from '@atlaskit/adf-schema';
-import { componentWithFG } from '@atlaskit/platform-feature-flags-react';
-var MarkWrapperOld = function MarkWrapperOld(props) {
-  var styles = props['data-align'] ? // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
-  css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t\t\t\ttext-align: ", ";\n\t\t\t"])), alignmentPositionMap[props['data-align']]) : '';
-  return jsx("div", _extends({
-    // 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'] ? alignmentPositionMap[props['data-align']] : undefined;
   return jsx("div", _extends({
     style: {
@@ -30,7 +17,6 @@ var MarkWrapperNew = function MarkWrapperNew(props) {
     // eslint-disable-next-line react/jsx-props-no-spreading
   }, props), props.children);
 };
-var MarkWrapper = componentWithFG('platform_editor_emotion_refactor_renderer', MarkWrapperNew, MarkWrapperOld);
 export default function Alignment(props) {
   return jsx(MarkWrapper
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766

package/dist/esm/react/nodes/blockCard.js

@@ -12,6 +12,8 @@ import { getCardClickHandler } from '../utils/getCardClickHandler';
 import InlineCard from './inlineCard';
 import { AnalyticsContext } from '@atlaskit/analytics-next';
 import { DatasourceTableView } from '@atlaskit/link-datasource';
+import { CardSSR } from '@atlaskit/smart-card/ssr';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { N40 } from '@atlaskit/theme/colors';
 import { calcBreakoutWidth, canRenderDatasource } from '@atlaskit/editor-common/utils';
 var datasourceContainerStyle = css({
@@ -114,6 +116,27 @@ export default function BlockCard(props) {
       url: url
     });
   }
+  var cardComponent;
+  if (smartLinks !== null && smartLinks !== void 0 && smartLinks.ssr && url && fg('platform_ssr_smartlink_cards')) {
+    cardComponent = jsx(CardSSR, _extends({
+      appearance: "block",
+      platform: platform
+      // Ignored via go/ees005
+      // eslint-disable-next-line react/jsx-props-no-spreading
+    }, cardProps, {
+      url: url,
+      onError: onError
+    }));
+  } else {
+    cardComponent = jsx(Card, _extends({
+      appearance: "block",
+      platform: platform
+      // Ignored via go/ees005
+      // eslint-disable-next-line react/jsx-props-no-spreading
+    }, cardProps, {
+      onError: onError
+    }));
+  }
   return jsx(AnalyticsContext, {
     data: analyticsData
   }, jsx("div", {
@@ -126,12 +149,5 @@ export default function BlockCard(props) {
     unsupportedComponent: UnsupportedBlock
     // Ignored via go/ees005
     // eslint-disable-next-line react/jsx-props-no-spreading
-  }, cardProps), jsx(Card, _extends({
-    appearance: "block",
-    platform: platform
-    // Ignored via go/ees005
-    // eslint-disable-next-line react/jsx-props-no-spreading
-  }, cardProps, {
-    onError: onError
-  })))));
+  }, cardProps), cardComponent)));
 }

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

@@ -1,23 +1,14 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
 /**
  * @jsxRuntime classic
  * @jsx jsx
  */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx, css } from '@emotion/react';
-import { overflowShadow, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import { N20 } from '@atlaskit/theme/colors';
 import { CodeBlockSharedCssClassName } from '@atlaskit/editor-common/styles';
 import CodeBlockButtonContainer from './codeBlockButtonContainer';
-import { fg } from '@atlaskit/platform-feature-flags';
-
-// 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 = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\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(N20, ")"), CodeBlockSharedCssClassName.DS_CODEBLOCK, relativeFontSizeToBase16(14), overflowShadow({
-  leftCoverWidth: "var(--ds-space-300, 24px)"
-}));
-var codeBlockStyleOverridesNew = css(_defineProperty({
+var codeBlockStyleOverrides = css(_defineProperty({
   tabSize: 4,
   backgroundColor: "var(--ds-surface-raised, ".concat(N20, ")"),
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -51,7 +42,7 @@ var CodeBlockContainer = function CodeBlockContainer(_ref) {
   return jsx("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: className,
-    css: fg('platform_editor_emotion_refactor_renderer') ? codeBlockStyleOverridesNew : codeBlockStyleOverridesOld
+    css: codeBlockStyleOverrides
   }, jsx(CodeBlockButtonContainer, {
     allowCopyToClipboard: allowCopyToClipboard,
     allowWrapCodeBlock: allowWrapCodeBlock,

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

@@ -1,6 +1,6 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-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 */
@@ -12,11 +12,10 @@ import React, { forwardRef, useMemo } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { akEditorTableCellMinWidth, blockNodesVerticalMargin, overflowShadow } from '@atlaskit/editor-shared-styles';
-import { codeBlockSharedStyles, CodeBlockSharedCssClassName } from '@atlaskit/editor-common/styles';
+import { CodeBlockSharedCssClassName } from '@atlaskit/editor-common/styles';
 import { useBidiWarnings } from '../../../hooks/use-bidi-warnings';
 import { RendererCssClassName } from '../../../../consts';
-import { componentWithFG } from '@atlaskit/platform-feature-flags-react';
-var codeBlockSharedStylesNew = css(_defineProperty(_defineProperty(_defineProperty({}, ".".concat(CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPED, "\n\t\t> .").concat(CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER, "\n\t\t> .").concat(CodeBlockSharedCssClassName.CODEBLOCK_CONTENT), {
+var codeBlockSharedStyles = css(_defineProperty(_defineProperty(_defineProperty({}, ".".concat(CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPED, "\n\t\t> .").concat(CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER, "\n\t\t> .").concat(CodeBlockSharedCssClassName.CODEBLOCK_CONTENT), {
   marginRight: "var(--ds-space-100, 8px)",
   code: {
     display: 'block',
@@ -115,10 +114,7 @@ var codeBlockSharedStylesNew = css(_defineProperty(_defineProperty(_defineProper
   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 = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.", " {\n\t\tcursor: text;\n\t}\n"])), CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER);
-var lightWeightCodeBlockStylesNew = css(_defineProperty({}, ".".concat(CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER), {
+var lightWeightCodeBlockStyles = css(_defineProperty({}, ".".concat(CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER), {
   cursor: 'text'
 }));
 export var LightWeightCodeBlockCssClassName = {
@@ -137,9 +133,9 @@ export var getLightWeightCodeBlockStylesForRootRendererStyleSheet = function get
   // 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 css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t\t.", "\n\t\t\t> .", "\n\t\t\t.", " {\n\t\t\tmargin-top: ", ";\n\t\t}\n\t"])), RendererCssClassName.DOCUMENT, LightWeightCodeBlockCssClassName.CONTAINER, CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, blockNodesVerticalMargin);
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t\t.", "\n\t\t\t> .", "\n\t\t\t.", " {\n\t\t\tmargin-top: ", ";\n\t\t}\n\t"])), RendererCssClassName.DOCUMENT, LightWeightCodeBlockCssClassName.CONTAINER, CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, blockNodesVerticalMargin);
 };
-var LightWeightCodeBlockOld = /*#__PURE__*/forwardRef(function (_ref, ref) {
+var LightWeightCodeBlock = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var text = _ref.text,
     _ref$codeBidiWarningT = _ref.codeBidiWarningTooltipEnabled,
     codeBidiWarningTooltipEnabled = _ref$codeBidiWarningT === void 0 ? true : _ref$codeBidiWarningT,
@@ -152,46 +148,6 @@ var LightWeightCodeBlockOld = /*#__PURE__*/forwardRef(function (_ref, ref) {
     }),
     renderBidiWarnings = _useBidiWarnings.renderBidiWarnings;
   var classNames = [LightWeightCodeBlockCssClassName.CONTAINER, className].join(' ');
-  return 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: [codeBlockSharedStyles(), lightWeightCodeBlockStylesOld]
-  }, jsx("div", {
-    className: CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER
-  }, jsx("div", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: CodeBlockSharedCssClassName.CODEBLOCK_CONTENT_WRAPPER
-  }, jsx("div", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER
-  }, textRows.map(function (_, index) {
-    return (
-      // Ignored via go/ees005
-      // eslint-disable-next-line react/no-array-index-key
-      jsx("span", {
-        key: index
-      })
-    );
-  })), jsx("div", {
-    className: CodeBlockSharedCssClassName.CODEBLOCK_CONTENT
-  }, jsx("code", null, renderBidiWarnings(text))))));
-});
-var LightWeightCodeBlockNew = /*#__PURE__*/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 = useMemo(function () {
-    return (text !== null && text !== void 0 ? text : '').split('\n');
-  }, [text]);
-  var _useBidiWarnings2 = useBidiWarnings({
-      enableWarningTooltip: codeBidiWarningTooltipEnabled
-    }),
-    renderBidiWarnings = _useBidiWarnings2.renderBidiWarnings;
-  var classNames = [LightWeightCodeBlockCssClassName.CONTAINER, className].join(' ');
   var codeBlockBackgroundImage = overflowShadow({
     leftCoverWidth: "var(--ds-space-300, 24px)"
   });
@@ -201,7 +157,7 @@ var LightWeightCodeBlockNew = /*#__PURE__*/forwardRef(function (_ref2, 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
     }
@@ -225,5 +181,4 @@ var LightWeightCodeBlockNew = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     className: CodeBlockSharedCssClassName.CODEBLOCK_CONTENT
   }, jsx("code", null, renderBidiWarnings(text))))));
 });
-var LightWeightCodeBlock = componentWithFG('platform_editor_emotion_refactor_renderer', LightWeightCodeBlockNew, LightWeightCodeBlockOld);
 export default LightWeightCodeBlock;

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

@@ -6,11 +6,10 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx, css } from '@emotion/react';
-import { WidthProvider, clearNextSiblingMarginTopStyle, clearNextSiblingBlockMarkMarginTopStyle } from '@atlaskit/editor-common/ui';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { WidthProvider } from '@atlaskit/editor-common/ui';
 
 // localized styles, was from clearNextSiblingMarginTopStyle in @atlaskit/editor-common/ui
-var clearNextSiblingMarginTopStyleNew = css({
+var clearNextSiblingMarginTopStyle = 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
@@ -19,17 +18,10 @@ var clearNextSiblingMarginTopStyleNew = css({
 });
 
 // localized styles, was from clearNextSiblingBlockMarkMarginTopStyle in @atlaskit/editor-common/ui
-var clearNextSiblingBlockMarkMarginTopStyleNew = css(_defineProperty({}, "+ .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 = css(_defineProperty({}, "+ .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 = 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
-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
-clearNextSiblingBlockMarkMarginTopStyle);
 export default function LayoutSection(props) {
   return jsx("div", {
     "data-layout-column": true,
@@ -38,6 +30,6 @@ export default function LayoutSection(props) {
       flexBasis: "".concat(props.width, "%")
     }
   }, jsx(WidthProvider, null, jsx("div", {
-    css: fg('platform_editor_emotion_refactor_renderer') ? [clearNextSiblingMarginTopStyleNew, clearNextSiblingBlockMarkMarginTopStyleNew] : layoutColumnClearMarginTopStyles
+    css: [clearNextSiblingMarginTopStyle, clearNextSiblingBlockMarkMarginTopStyle]
   }), props.children));
 }

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

@@ -7,10 +7,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _excluded = ["marks", "mediaSingleElement", "isDrafting"],
   _excluded2 = ["marks", "mediaSingleElement", "isDrafting"];
-var _templateObject;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
@@ -42,7 +40,6 @@ import { injectIntl } from 'react-intl-next';
 import { useInlineCommentsFilter } from '../../../ui/annotations/hooks/use-inline-comments-filter';
 import { useInlineCommentSubscriberContext } from '../../../ui/annotations/hooks/use-inline-comment-subscriber';
 import { AnnotationUpdateEvent } from '@atlaskit/editor-common/types';
-import { componentWithFG } from '@atlaskit/platform-feature-flags-react';
 var linkStyle = css({
   position: 'absolute',
   background: 'transparent',
@@ -56,19 +53,14 @@ var linkStyle = 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 css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\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 = css({
+var borderStyle = 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;
@@ -78,32 +70,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 = hexToEditorBorderPaletteColor(borderColor) || borderColor;
-  return 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)
-  }, jsx(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 jsx(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 = hexToEditorBorderPaletteColor(borderColor) || borderColor;
   return 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)
@@ -112,11 +83,10 @@ var MediaBorderNew = function MediaBorderNew(_ref2) {
     borderColor: borderColor
   }), children);
 };
-var MediaBorder = 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 jsx(Fragment, null, children);
   }
@@ -129,9 +99,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 jsx(Fragment, null, children);
   }
@@ -149,10 +119,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 jsx(Fragment, null, children);
@@ -169,13 +139,13 @@ var _MediaAnnotations = function MediaAnnotations(_ref5) {
   }, children) : jsx(Fragment, null, children)));
 };
 var CommentBadge = injectIntl(CommentBadgeComponent);
-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 = _objectWithoutProperties(_ref6, _excluded);
+  var marks = _ref5.marks,
+    mediaSingleElement = _ref5.mediaSingleElement,
+    _ref5$isDrafting = _ref5.isDrafting,
+    isDrafting = _ref5$isDrafting === void 0 ? false : _ref5$isDrafting,
+    rest = _objectWithoutProperties(_ref5, _excluded);
   var _useState = useState('default'),
     _useState2 = _slicedToArray(_useState, 2),
     status = _useState2[0],
@@ -252,13 +222,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 = _objectWithoutProperties(_ref7, _excluded2);
+  var marks = _ref6.marks,
+    mediaSingleElement = _ref6.mediaSingleElement,
+    _ref6$isDrafting = _ref6.isDrafting,
+    isDrafting = _ref6$isDrafting === void 0 ? false : _ref6$isDrafting,
+    rest = _objectWithoutProperties(_ref6, _excluded2);
   var _useState5 = useState('default'),
     _useState6 = _slicedToArray(_useState5, 2),
     status = _useState6[0],
@@ -377,8 +347,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 jsx(React.Fragment, null, visible && jsx(ExternalImageBadge, {
           type: _this.props.type,
           url: _this.props.type === 'external' ? _this.props.url : undefined