@atlaskit/renderer 130.2.17 → 130.3.0

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

@@ -0,0 +1,185 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PanelStyledEmotion = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@emotion/react");
+var _adfSchema = require("@atlaskit/adf-schema");
+var _consts = require("@atlaskit/editor-shared-styles/consts");
+var _editorPalette = require("@atlaskit/editor-palette");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _excluded = ["backgroundColor", "hasIcon"];
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+/**
+ * Emotion branch of the `platform_editor_static_css` experiment.
+ * Used via `componentWithCondition` in `panel.tsx`.
+ *
+ * Cleanup: delete this file once the experiment has shipped.
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- intentional: emotion fallback for compiled migration
+// New custom icons are a little smaller than predefined icons.
+// To fix alignment issues with custom icons, vertical alignment is updated.
+var panelEmojiSpriteVerticalAlignment = -(8 * 3 - _consts.akEditorCustomIconSize) / 2;
+var panelEmojiImageVerticalAlignment = panelEmojiSpriteVerticalAlignment - 1;
+var blockNodesVerticalMargin = '0.75rem';
+var akEditorTableCellMinWidth = 48;
+var panelBaseStyles = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '&.ak-editor-panel': {
+    borderRadius: "var(--ds-radius-small, 3px)",
+    margin: "".concat(blockNodesVerticalMargin, " 0 0"),
+    paddingTop: "var(--ds-space-100, 8px)",
+    paddingRight: "var(--ds-space-200, 16px)",
+    paddingBottom: "var(--ds-space-100, 8px)",
+    paddingLeft: "var(--ds-space-100, 8px)",
+    minWidth: "".concat(akEditorTableCellMinWidth, "px"),
+    display: 'flex',
+    position: 'relative',
+    alignItems: 'normal',
+    wordBreak: 'break-word',
+    backgroundColor: "var(--ds-background-accent-blue-subtlest, #E9F2FE)",
+    color: 'inherit',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.ak-editor-panel__icon': {
+      flexShrink: 0,
+      height: "var(--ds-space-300, 24px)",
+      width: "var(--ds-space-300, 24px)",
+      boxSizing: 'content-box',
+      paddingRight: "var(--ds-space-100, 8px)",
+      textAlign: 'center',
+      userSelect: 'none',
+      MozUserSelect: 'none',
+      WebkitUserSelect: 'none',
+      MsUserSelect: 'none',
+      // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
+      marginTop: '0.1em',
+      color: "var(--ds-icon-information, #357DE8)",
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '> span': {
+        verticalAlign: 'middle',
+        display: 'inline-flex'
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '.emoji-common-emoji-sprite': {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+        verticalAlign: "".concat(panelEmojiSpriteVerticalAlignment, "px")
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '.emoji-common-emoji-image': {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+        verticalAlign: "".concat(panelEmojiImageVerticalAlignment, "px"),
+        // Vertical align only works for inline-block elements in Firefox
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
+        '@-moz-document url-prefix()': {
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+          img: {
+            display: 'inline-block'
+          }
+        }
+      }
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.ak-editor-panel__content': {
+      margin: "var(--ds-space-025, 2px)".concat(" 0 ", "var(--ds-space-025, 2px)"),
+      flex: '1 0 0',
+      minWidth: 0
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&[data-panel-type="note"]': {
+      backgroundColor: "var(--ds-background-accent-purple-subtlest, #F8EEFE)",
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '.ak-editor-panel__icon': {
+        color: "var(--ds-icon-discovery, #AF59E1)"
+      }
+    },
+    // 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-panel-type="tip"]': {
+      backgroundColor: "var(--ds-background-accent-green-subtlest, #DCFFF1)",
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '.ak-editor-panel__icon': {
+        color: "var(--ds-icon-success, #6A9A23)"
+      }
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&[data-panel-type="warning"]': {
+      backgroundColor: "var(--ds-background-accent-yellow-subtlest, #FEF7C8)",
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '.ak-editor-panel__icon': {
+        color: "var(--ds-icon-warning, #E06C00)"
+      }
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&[data-panel-type="error"]': {
+      backgroundColor: "var(--ds-background-accent-red-subtlest, #FFECEB)",
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '.ak-editor-panel__icon': {
+        color: "var(--ds-icon-danger, #C9372C)"
+      }
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&[data-panel-type="success"]': {
+      backgroundColor: "var(--ds-background-accent-green-subtlest, #DCFFF1)",
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '.ak-editor-panel__icon': {
+        color: "var(--ds-icon-success, #6A9A23)"
+      }
+    }
+  }
+});
+var panelHasNoIconStyles = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '&.ak-editor-panel': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&[data-panel-type="custom"]': {
+      paddingLeft: "var(--ds-space-150, 12px)",
+      paddingRight: "var(--ds-space-150, 12px)"
+    }
+  }
+});
+var panelNestedIconStyles = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '&.ak-editor-panel__no-icon': {
+    paddingLeft: "var(--ds-space-150, 12px)",
+    paddingRight: "var(--ds-space-150, 12px)"
+  }
+});
+var nestedPanelStyles = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.ak-editor-panel__content .ak-editor-panel': {
+    border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)")
+  }
+});
+var panelCustomBackground = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '&.ak-editor-panel': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '&[data-panel-type="custom"]': {
+      backgroundColor: 'var(--ak-renderer-panel-custom-bg-color)'
+    }
+  }
+});
+var PanelStyledEmotion = exports.PanelStyledEmotion = function PanelStyledEmotion(_ref) {
+  var backgroundColor = _ref.backgroundColor,
+    hasIcon = _ref.hasIcon,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var customBackgroundColor = backgroundColor ? (0, _editorPalette.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : undefined;
+  return (0, _react2.jsx)("div", (0, _extends2.default)({
+    style:
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
+    {
+      '--ak-renderer-panel-custom-bg-color': customBackgroundColor
+    },
+    css: [panelBaseStyles, !hasIcon && panelHasNoIconStyles, props['data-panel-type'] === _adfSchema.PanelType.CUSTOM && backgroundColor && panelCustomBackground, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && panelNestedIconStyles, nestedPanelStyles]
+    // Ignored via go/ees005
+    // eslint-disable-next-line react/jsx-props-no-spreading
+  }, props), props.children);
+};
+PanelStyledEmotion.displayName = 'PanelStyledEmotion';

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

@@ -5,187 +5,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
-var _lightbulb = _interopRequireDefault(require("@atlaskit/icon/core/lightbulb"));
 var _adfSchema = require("@atlaskit/adf-schema");
+var _icons = require("@atlaskit/editor-common/icons");
 var _panel = require("@atlaskit/editor-common/panel");
-var _editorPalette = require("@atlaskit/editor-palette");
 var _emoji = _interopRequireDefault(require("@atlaskit/icon/core/emoji"));
+var _lightbulb = _interopRequireDefault(require("@atlaskit/icon/core/lightbulb"));
+var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _emoji2 = _interopRequireDefault(require("./emoji"));
-var _icons = require("@atlaskit/editor-common/icons");
-var _consts = require("@atlaskit/editor-shared-styles/consts");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _excluded = ["backgroundColor", "hasIcon"];
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-/* eslint-disable @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
-// New custom icons are a little smaller than predefined icons.
-// To fix alignment issues with custom icons, vertical alignment is updated.
-var panelEmojiSpriteVerticalAlignment = -(8 * 3 - _consts.akEditorCustomIconSize) / 2;
-var panelEmojiImageVerticalAlignment = panelEmojiSpriteVerticalAlignment - 1;
-var blockNodesVerticalMargin = '0.75rem';
-var akEditorTableCellMinWidth = 48;
-var panelBaseStyles = (0, _react2.css)({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  '&.ak-editor-panel': {
-    borderRadius: "var(--ds-radius-small, 3px)",
-    margin: "".concat(blockNodesVerticalMargin, " 0 0"),
-    paddingTop: "var(--ds-space-100, 8px)",
-    paddingRight: "var(--ds-space-200, 16px)",
-    paddingBottom: "var(--ds-space-100, 8px)",
-    paddingLeft: "var(--ds-space-100, 8px)",
-    minWidth: "".concat(akEditorTableCellMinWidth, "px"),
-    display: 'flex',
-    position: 'relative',
-    alignItems: 'normal',
-    wordBreak: 'break-word',
-    backgroundColor: "var(--ds-background-accent-blue-subtlest, #E9F2FE)",
-    color: 'inherit',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-    '.ak-editor-panel__icon': {
-      flexShrink: 0,
-      height: "var(--ds-space-300, 24px)",
-      width: "var(--ds-space-300, 24px)",
-      boxSizing: 'content-box',
-      paddingRight: "var(--ds-space-100, 8px)",
-      textAlign: 'center',
-      userSelect: 'none',
-      MozUserSelect: 'none',
-      WebkitUserSelect: 'none',
-      MsUserSelect: 'none',
-      // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
-      marginTop: '0.1em',
-      color: "var(--ds-icon-information, #357DE8)",
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '> span': {
-        verticalAlign: 'middle',
-        display: 'inline-flex'
-      },
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '.emoji-common-emoji-sprite': {
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
-        verticalAlign: "".concat(panelEmojiSpriteVerticalAlignment, "px")
-      },
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '.emoji-common-emoji-image': {
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
-        verticalAlign: "".concat(panelEmojiImageVerticalAlignment, "px"),
-        // Vertical align only works for inline-block elements in Firefox
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
-        '@-moz-document url-prefix()': {
-          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-          img: {
-            display: 'inline-block'
-          }
-        }
-      }
-    },
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-    '.ak-editor-panel__content': {
-      margin: "var(--ds-space-025, 2px)".concat(" 0 ", "var(--ds-space-025, 2px)"),
-      flex: '1 0 0',
-      /*
-      https://ishadeed.com/article/min-max-css/#setting-min-width-to-zero-with-flexbox
-      The default value for min-width is auto, which is computed to zero. When an element is a flex item, the value of min-width doesn’t compute to zero. The minimum size of a flex item is equal to the size of its contents.
-      */
-      minWidth: 0
-    },
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-    '&[data-panel-type="note"]': {
-      backgroundColor: "var(--ds-background-accent-purple-subtlest, #F8EEFE)",
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '.ak-editor-panel__icon': {
-        color: "var(--ds-icon-discovery, #AF59E1)"
-      }
-    },
-    // 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-panel-type="tip"]': {
-      backgroundColor: "var(--ds-background-accent-green-subtlest, #DCFFF1)",
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '.ak-editor-panel__icon': {
-        color: "var(--ds-icon-success, #6A9A23)"
-      }
-    },
-    // 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-panel-type="warning"]': {
-      backgroundColor: "var(--ds-background-accent-yellow-subtlest, #FEF7C8)",
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '.ak-editor-panel__icon': {
-        color: "var(--ds-icon-warning, #E06C00)"
-      }
-    },
-    // 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-panel-type="error"]': {
-      backgroundColor: "var(--ds-background-accent-red-subtlest, #FFECEB)",
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '.ak-editor-panel__icon': {
-        color: "var(--ds-icon-danger, #C9372C)"
-      }
-    },
-    // 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-panel-type="success"]': {
-      backgroundColor: "var(--ds-background-accent-green-subtlest, #DCFFF1)",
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '.ak-editor-panel__icon': {
-        color: "var(--ds-icon-success, #6A9A23)"
-      }
-    }
-  }
-});
-var panelHasNoIconStyles = (0, _react2.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
-  '&.ak-editor-panel': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-    '&[data-panel-type="custom"]': {
-      paddingLeft: "var(--ds-space-150, 12px)",
-      paddingRight: "var(--ds-space-150, 12px)"
-    }
-  }
-});
-var panelNestedIconStyles = (0, _react2.css)({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  '&.ak-editor-panel__no-icon': {
-    paddingLeft: "var(--ds-space-150, 12px)",
-    paddingRight: "var(--ds-space-150, 12px)"
-  }
-});
-var nestedPanelStyles = (0, _react2.css)({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  '.ak-editor-panel__content .ak-editor-panel': {
-    border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)")
-  }
-});
-var panelCustomBackground = (0, _react2.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
-  '&.ak-editor-panel': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-    '&[data-panel-type="custom"]': {
-      backgroundColor: 'var(--ak-renderer-panel-custom-bg-color)'
-    }
-  }
-});
-var PanelStyled = function PanelStyled(_ref) {
-  var backgroundColor = _ref.backgroundColor,
-    hasIcon = _ref.hasIcon,
-    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var customBackgroundColor = backgroundColor ? (0, _editorPalette.hexToEditorBackgroundPaletteColor)(backgroundColor) || backgroundColor : undefined;
-  return (0, _react2.jsx)("div", (0, _extends2.default)({
-    style:
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
-    {
-      '--ak-renderer-panel-custom-bg-color': customBackgroundColor
-    },
-    css: [panelBaseStyles, !hasIcon && panelHasNoIconStyles, props['data-panel-type'] === _adfSchema.PanelType.CUSTOM && backgroundColor && panelCustomBackground, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') && panelNestedIconStyles, nestedPanelStyles]
-    // Ignored via go/ees005
-    // eslint-disable-next-line react/jsx-props-no-spreading
-  }, props), props.children);
-};
-PanelStyled.displayName = 'PanelStyled';
+var _panelCompiled = require("./panel-compiled");
+var _panelEmotion = require("./panel-emotion");
 var panelIcons = {
   info: _icons.PanelInfoIcon,
   success: _icons.PanelSuccessIcon,
@@ -195,6 +25,9 @@ var panelIcons = {
   error: _icons.PanelErrorIcon,
   custom: _emoji.default
 };
+var PanelStyledMigration = (0, _platformFeatureFlagsReact.componentWithCondition)(function () {
+  return (0, _expValEquals.expValEquals)('platform_editor_renderer_static_css', 'isEnabled', true);
+}, _panelCompiled.PanelStyledCompiled, _panelEmotion.PanelStyledEmotion);
 var Panel = function Panel(props) {
   var allowCustomPanels = props.allowCustomPanels,
     type = props.panelType,
@@ -211,7 +44,7 @@ var Panel = function Panel(props) {
   var getIcon = function getIcon() {
     if (panelType === _adfSchema.PanelType.CUSTOM) {
       if (panelIcon && providers) {
-        return (0, _react2.jsx)(_emoji2.default, {
+        return /*#__PURE__*/_react.default.createElement(_emoji2.default, {
           id: panelIconId,
           text: panelIconText,
           shortName: panelIcon,
@@ -221,7 +54,7 @@ var Panel = function Panel(props) {
       return null;
     }
     var Icon = panelIcons[panelType];
-    return (0, _react2.jsx)(Icon, {
+    return /*#__PURE__*/_react.default.createElement(Icon, {
       label: "".concat(panelType, " panel")
     });
   };
@@ -229,12 +62,12 @@ var Panel = function Panel(props) {
   var renderIcon = function renderIcon() {
     if (icon) {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-      return (0, _react2.jsx)("div", {
+      return /*#__PURE__*/_react.default.createElement("div", {
         className: _panel.PanelSharedCssClassName.icon
       }, icon);
     }
   };
-  return (0, _react2.jsx)(PanelStyled
+  return /*#__PURE__*/_react.default.createElement(PanelStyledMigration
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
   , {
     className: _panel.PanelSharedCssClassName.prefix,
@@ -246,7 +79,7 @@ var Panel = function Panel(props) {
     "data-panel-icon-text": panelIconText,
     backgroundColor: panelColor,
     hasIcon: Boolean(icon)
-  }, renderIcon(), (0, _react2.jsx)("div", {
+  }, renderIcon(), /*#__PURE__*/_react.default.createElement("div", {
     className: _panel.PanelSharedCssClassName.content
   }, children));
 };

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

@@ -71,7 +71,7 @@ var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var TABLE_INFO_TIMEOUT = 10000;
 var RENDER_EVENT_SAMPLE_RATE = 0.2;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "0.0.0-development";
+var packageVersion = "130.2.18";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/dist/es2019/react/marks/link-compiled.compiled.css

@@ -0,0 +1,6 @@
+
+._syaz13af{color:var(--ds-link,#1868db)}._1bnx8stv:hover{text-decoration-line:underline}
+._30l313af:hover{color:var(--ds-link,#1868db)}
+._9oik1r31:hover{text-decoration-color:currentColor}
+._jf4cnqa1:hover{text-decoration-style:solid}
+._9h8h12zz:active{color:var(--ds-link-pressed,#1558bc)}

package/dist/es2019/react/marks/link-compiled.js

@@ -0,0 +1,17 @@
+/* link-compiled.tsx generated by @compiled/babel-plugin v0.39.1 */
+import _extends from "@babel/runtime/helpers/extends";
+import "./link-compiled.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+/**
+ * Compiled branch of the `platform_editor_static_css` experiment.
+ * Used via `componentWithCondition` in `link.tsx`.
+ *
+ * Cleanup: delete this file once the experiment has shipped.
+ */
+
+import LinkUrl from '@atlaskit/smart-card/link-url';
+const anchorStyles = null;
+export const LinkUrlCompiled = props => /*#__PURE__*/React.createElement(LinkUrl, _extends({}, props, {
+  className: ax(["_syaz13af _9oik1r31 _1bnx8stv _jf4cnqa1 _30l313af _9h8h12zz"])
+}));

package/dist/es2019/react/marks/link-emotion.js

@@ -0,0 +1,31 @@
+import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+/**
+ * Emotion branch of the `platform_editor_static_css` experiment.
+ * Used via `componentWithCondition` in `link.tsx`.
+ *
+ * Cleanup: delete this file once the experiment has shipped.
+ */
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- intentional: emotion fallback for compiled migration
+import { css, jsx } from '@emotion/react';
+import LinkUrl from '@atlaskit/smart-card/link-url';
+const anchorStyles = css({
+  color: "var(--ds-link, #1868DB)",
+  '&:hover': {
+    color: "var(--ds-link, #1868DB)",
+    textDecoration: 'underline'
+  },
+  '&:active': {
+    color: "var(--ds-link-pressed, #1558BC)"
+  }
+});
+export const LinkUrlEmotion = props =>
+// Ignored via go/ees005
+// eslint-disable-next-line react/jsx-props-no-spreading
+jsx(LinkUrl, _extends({
+  css: anchorStyles
+}, props));

package/dist/es2019/react/marks/link.js

@@ -1,26 +1,17 @@
 import _extends from "@babel/runtime/helpers/extends";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import React, { Fragment } from 'react';
-/* eslint-disable @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic */
-import { jsx, css } from '@emotion/react';
+import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
 import { getEventHandler } from '../../utils';
 import { PLATFORM, MODE } from '../../analytics/events';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
-import LinkUrl from '@atlaskit/smart-card/link-url';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { AnalyticsContext } from '@atlaskit/analytics-next';
-const anchorStyles = css({
-  color: "var(--ds-link, #1868DB)",
-  '&:hover': {
-    color: "var(--ds-link, #1868DB)",
-    textDecoration: 'underline'
-  },
-  '&:active': {
-    color: "var(--ds-link-pressed, #1558BC)"
-  }
-});
+import { LinkUrlCompiled } from './link-compiled';
+import { LinkUrlEmotion } from './link-emotion';
+const LinkUrlMigration = componentWithCondition(() => expValEquals('platform_editor_renderer_static_css', 'isEnabled', true), LinkUrlCompiled, LinkUrlEmotion);
+/**
+ * Render an ADF link mark in renderer.
+ */
 export default function Link(props) {
   const {
     href,
@@ -51,7 +42,7 @@ export default function Link(props) {
   }
   const handler = getEventHandler(eventHandlers, 'link');
   if (isMediaLink) {
-    return jsx(Fragment, null, props.children);
+    return /*#__PURE__*/React.createElement(Fragment, null, props.children);
   }
   const analyticsData = {
     attributes: {
@@ -60,12 +51,11 @@ export default function Link(props) {
     // Below is added for the future implementation of Linking Platform namespaced analytic context
     location: 'renderer'
   };
-  return jsx(AnalyticsContext, {
+  return /*#__PURE__*/React.createElement(AnalyticsContext, {
     data: analyticsData
-  }, jsx(LinkUrl, _extends({
-    css: anchorStyles
-    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
-    ,
+  }, /*#__PURE__*/React.createElement(LinkUrlMigration
+  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+  , _extends({
     onClick: e => {
       if (fireAnalyticsEvent) {
         fireAnalyticsEvent({

package/dist/es2019/react/nodes/bodiedExtension.js

@@ -18,7 +18,8 @@ const BodiedExtension = props => {
     parameters,
     extensionViewportSizes,
     localId,
-    shouldDisplayExtensionAsInline
+    shouldDisplayExtensionAsInline,
+    fireAnalyticsEvent
   } = props;
   const {
     createAnalyticsEvent
@@ -55,7 +56,8 @@ const BodiedExtension = props => {
         // Return the content directly if it's a valid JSX.Element
         return renderExtension(result, layout, {
           isTopLevel: path.length < 1,
-          rendererAppearance: props.rendererAppearance
+          rendererAppearance: props.rendererAppearance,
+          fireAnalyticsEvent
         }, removeOverflow, parameters === null || parameters === void 0 ? void 0 : parameters.extensionId, extensionViewportSizes, undefined, localId, shouldDisplayExtensionAsInline, node);
       }
     } catch {
@@ -66,7 +68,8 @@ const BodiedExtension = props => {
     // Always return default content if anything goes wrong
     return renderExtension(children, layout, {
       isTopLevel: path.length < 1,
-      rendererAppearance: props.rendererAppearance
+      rendererAppearance: props.rendererAppearance,
+      fireAnalyticsEvent
     }, removeOverflow, parameters === null || parameters === void 0 ? void 0 : parameters.extensionId, extensionViewportSizes, undefined, localId, shouldDisplayExtensionAsInline, node);
   }))));
 };