@atlaskit/renderer 114.11.0 → 114.11.2

package/dist/esm/ui/Renderer/style.js

@@ -1,204 +1,2 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
-/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation */
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
-import { fg } from '@atlaskit/platform-feature-flags';
-// Ignored via go/ees005
-// eslint-disable-next-line import/no-namespace
-import * as colors from '@atlaskit/theme/colors';
-import { N60A, Y300, Y75, N40A } from '@atlaskit/theme/colors';
-import { getGlobalTheme } from '@atlaskit/tokens';
-import { mediaInlineImageStyles } from '@atlaskit/editor-common/media-inline';
-import { tableSharedStyle, columnLayoutSharedStyle, columnLayoutResponsiveSharedStyle, columnLayoutResponsiveRendererStyles, blockquoteSharedStyles, headingsSharedStyles, ruleSharedStyles, whitespaceSharedStyles, paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, mediaSingleSharedStyle, TableSharedCssClassName, tableMarginTop, codeMarkSharedStyles, shadowSharedStyle, dateSharedStyle, richMediaClassName, tasksAndDecisionsStyles, getSmartCardSharedStyles, smartCardSharedStyles, tableCellPadding, textColorStyles, backgroundColorStyles, codeBlockInListSafariFix, SmartCardSharedCssClassName } from '@atlaskit/editor-common/styles';
-import { shadowClassNames, shadowObserverClassNames } from '@atlaskit/editor-common/ui';
-import { browser } from '@atlaskit/editor-common/browser';
-import { editorFontSize, blockNodesVerticalMargin, akEditorTableToolbar, akEditorTableBorder, akEditorTableNumberColumnWidth, gridMediumMaxWidth, akEditorFullWidthLayoutWidth, akEditorStickyHeaderZIndex, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
-import { RendererCssClassName } from '../../consts';
-import { HeadingAnchorWrapperClassName } from '../../react/nodes/heading-anchor';
-import { getLightWeightCodeBlockStylesForRootRendererStyleSheet } from '../../react/nodes/codeBlock/components/lightWeightCodeBlock';
-import { isTableResizingEnabled, isStickyScrollbarEnabled } from '../../react/nodes/table';
-import { SORTABLE_COLUMN_ICON_CLASSNAME } from '@atlaskit/editor-common/table';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 export var FullPagePadding = 32;
-var tableShadowWidth = 32;
-export var TELEPOINTER_ID = 'ai-streaming-telepointer';
-var telepointerStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t#", " {\n\t\tdisplay: inline-block;\n\t\tposition: relative;\n\t\twidth: 1.5px;\n\t\theight: 25px;\n\t\tbackground-color: ", ";\n\t\tmargin-left: ", ";\n\n\t\t&::after {\n\t\t\tcontent: 'AI';\n\t\t\tposition: absolute;\n\t\t\tdisplay: block;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t\tfont-size: 10px;\n\t\t\tfont-weight: ", ";\n\t\t\twidth: 12.5px;\n\t\t\theight: 13px;\n\t\t\tpadding-top: 1px;\n\t\t\tpadding-left: 1.5px;\n\t\t\tline-height: initial;\n\t\t\tborder-radius: 0px 2px 2px 0px;\n\t\t\tcolor: ", ";\n\t\t\tbackground-color: ", ";\n\t\t}\n\t}\n"])), TELEPOINTER_ID, "var(--ds-background-brand-bold, #0C66E4)", "var(--ds-space-025, 2px)", "var(--ds-font-weight-bold, 700)", "var(--ds-text-inverse, white)", "var(--ds-background-brand-bold, #0C66E4)");
-
-/**
- * **DEPRECATED**
- *
- * Originally defined in `@atlaskit/theme/typography`, but moved here as it has since been deleted in favor of typography tokens.
- * This should be removed as part of editor token work. More info:
- * https://atlassian.slack.com/archives/C075G5D7ZP1/p1733449725865539?thread_ts=1732159801.409789&cid=C075G5D7ZP1
- * */
-var headingSizesImport = {
-  h900: {
-    size: 35,
-    lineHeight: 40
-  },
-  h800: {
-    size: 29,
-    lineHeight: 32
-  },
-  h700: {
-    size: 24,
-    lineHeight: 28
-  },
-  h600: {
-    size: 20,
-    lineHeight: 24
-  },
-  h500: {
-    size: 16,
-    lineHeight: 20
-  },
-  h400: {
-    size: 14,
-    lineHeight: 16
-  },
-  h300: {
-    size: 12,
-    lineHeight: 16
-  },
-  h200: {
-    size: 12,
-    lineHeight: 16
-  },
-  h100: {
-    size: 11,
-    lineHeight: 16
-  }
-};
-var getLineHeight = function getLineHeight(fontCode) {
-  return headingSizesImport[fontCode].lineHeight / headingSizesImport[fontCode].size;
-};
-var headingSizes = {
-  h1: {
-    lineHeight: getLineHeight('h700')
-  },
-  h2: {
-    lineHeight: getLineHeight('h600')
-  },
-  h3: {
-    lineHeight: getLineHeight('h500')
-  },
-  h4: {
-    lineHeight: getLineHeight('h400')
-  },
-  h5: {
-    lineHeight: getLineHeight('h300')
-  },
-  h6: {
-    lineHeight: getLineHeight('h100')
-  }
-};
-var headingAnchorStyle = function headingAnchorStyle(headingTag) {
-  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t/**\n     * The copy link button doesn't reserve space in the DOM so that\n     * the text alignment isn't impacted by the button/icon's space.\n     */\n\t.", " {\n\t\tposition: absolute;\n\t\theight: ", "em;\n\n\t\tmargin-left: ", ";\n\n\t\tbutton {\n\t\t\tpadding-left: 0;\n\t\t\tpadding-right: 0;\n\t\t}\n\t}\n\n\t/**\n     * Applies hover effects to the heading anchor link button\n     * to fade in when the user rolls over the heading.\n     *\n     * The link is persistent on mobile, so we use feature detection\n     * to enable hover effects for systems that support it (desktop).\n     *\n     * @see https://caniuse.com/mdn-css_at-rules_media_hover\n     */\n\t@media (hover: hover) and (pointer: fine) {\n\t\t.", " {\n\t\t\t> button {\n\t\t\t\topacity: 0;\n\t\t\t\ttransform: translate(-8px, 0px);\n\t\t\t\ttransition:\n\t\t\t\t\topacity 0.2s ease 0s,\n\t\t\t\t\ttransform 0.2s ease 0s;\n\t\t\t}\n\t\t}\n\n\t\t&:hover {\n\t\t\t.", " > button {\n\t\t\t\topacity: 1;\n\t\t\t\ttransform: none !important;\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n     * Adds the visibility of the button when in focus through keyboard navigation.\n     */\n\t.", " {\n\t\tbutton:focus {\n\t\t\topacity: 1;\n\t\t\ttransform: none !important;\n\t\t}\n\t}\n"])), HeadingAnchorWrapperClassName, headingSizes[headingTag].lineHeight, "var(--ds-space-075, 6px)", HeadingAnchorWrapperClassName, HeadingAnchorWrapperClassName, HeadingAnchorWrapperClassName);
-};
-var alignedHeadingAnchorStyle = function alignedHeadingAnchorStyle(_ref) {
-  var allowNestedHeaderLinks = _ref.allowNestedHeaderLinks;
-  if (!allowNestedHeaderLinks) {
-    return '';
-  }
-  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\t\t.fabric-editor-block-mark[data-align] > {\n\t\t\th1,\n\t\t\th2,\n\t\t\th3,\n\t\t\th4,\n\t\t\th5,\n\t\t\th6 {\n\t\t\t\tposition: relative;\n\t\t\t}\n\t\t}\n\n\t\t/**\n     * For right-alignment we flip the link to be before the heading\n     * text so that the text is flush up against the edge of the editor's\n     * container edge.\n     */\n\t\t.fabric-editor-block-mark:not([data-align='center'])[data-align] {\n\t\t\t.", " {\n\t\t\t\tmargin: 0 ", " 0 0;\n\t\t\t\t// If the anchor is right aligned then the left side of the heading\n\t\t\t\t// is aligned with the left side of the anchor.\n\t\t\t\t// In order to align as expected we transform it the width of the element (plus our expected 6px)\n\t\t\t\t// to the left\n\t\t\t\ttransform: translateX(calc(-100% - ", "));\n\t\t\t}\n\n\t\t\t@media (hover: hover) and (pointer: fine) {\n\t\t\t\t.", " > button {\n\t\t\t\t\ttransform: translate(8px, 0px);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"])), HeadingAnchorWrapperClassName, "var(--ds-space-075, 6px)", "var(--ds-space-075, 6px)", HeadingAnchorWrapperClassName);
-};
-var tableSortableColumnStyle = function tableSortableColumnStyle(_ref2) {
-  var allowColumnSorting = _ref2.allowColumnSorting,
-    allowNestedHeaderLinks = _ref2.allowNestedHeaderLinks;
-  if (!allowColumnSorting) {
-    return '';
-  }
-  var headingsCss = '';
-  if (allowNestedHeaderLinks) {
-    headingsCss = "\n      /**\n       * When the sort button is enabled we want the heading's copy link button\n       * to reserve space so that it can prematurely wrap to avoid the button\n       * being displayed underneath the sort button (hidden or obscured).\n       *\n       * The two buttons fight each other since the sort button is displayed\n       * on hover of the <th /> and the copy link button is displayed on hover\n       * of the heading.\n       *\n       * Note that this can break the WYSIWYG experience in the case where\n       * a heading fills the width of the table cell and the only thing which\n       * wraps is the copy link button. This is hopefully a rare fringe case.\n       */\n      .".concat(HeadingAnchorWrapperClassName, " {\n        position: unset;\n      }\n      > {\n        h1, h2, h3, h4, h5, h6 {\n          margin-right: 30px;\n        }\n      }\n    ");
-  }
-  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n\t\t.", " {\n\t\t\tpadding: 0;\n\n\t\t\t.", " {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\tpadding: ", "px;\n\t\t\t\tborder-width: 1.5px;\n\t\t\t\tborder-style: solid;\n\t\t\t\tborder-color: transparent;\n\n\t\t\t\t> *:first-child {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\n\t\t\t\t> .ProseMirror-gapcursor:first-child + *,\n\t\t\t\t> style:first-child + .ProseMirror-gapcursor + * {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\n\t\t\t\t> .ProseMirror-gapcursor:first-child + span + *,\n\t\t\t\t> style:first-child + .ProseMirror-gapcursor + span + * {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\n\t\t\t\t@supports selector(:focus-visible) {\n\t\t\t\t\t&:focus {\n\t\t\t\t\t\toutline: unset;\n\t\t\t\t\t}\n\t\t\t\t\t&:focus-visible {\n\t\t\t\t\t\tborder-color: ", ";\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t", "\n\t\t\t}\n\n\t\t\t", "\n\t\t}\n\t"])), RendererCssClassName.SORTABLE_COLUMN_WRAPPER, RendererCssClassName.SORTABLE_COLUMN, tableCellPadding, "var(--ds-border-focused, ".concat(colors.B300, ")"), headingsCss, css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n\t\t\t\t// New styles\n\t\t\t\t> .", "\n\t\t\t\t\t> .", " {\n\t\t\t\t\tmargin: 0;\n\n\t\t\t\t\t.", " {\n\t\t\t\t\t\topacity: 1;\n\t\t\t\t\t\ttransition: opacity 0.2s ease-in-out;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t> .", "\n\t\t\t\t\t> .", " {\n\t\t\t\t\t.", " {\n\t\t\t\t\t\topacity: 0;\n\t\t\t\t\t\t&:focus {\n\t\t\t\t\t\t\topacity: 1;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t&:hover:not(\n\t\t\t\t\t\t:has(\n\t\t\t\t\t\t\t\t.", "\n\t\t\t\t\t\t\t\t\t.", ":hover\n\t\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t> .", "\n\t\t\t\t\t> .", " {\n\t\t\t\t\t.", " {\n\t\t\t\t\t\topacity: 1;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"])), RendererCssClassName.SORTABLE_COLUMN, RendererCssClassName.SORTABLE_COLUMN_ICON_WRAPPER, SORTABLE_COLUMN_ICON_CLASSNAME, RendererCssClassName.SORTABLE_COLUMN, RendererCssClassName.SORTABLE_COLUMN_NO_ORDER, SORTABLE_COLUMN_ICON_CLASSNAME, RendererCssClassName.SORTABLE_COLUMN_WRAPPER, RendererCssClassName.SORTABLE_COLUMN, RendererCssClassName.SORTABLE_COLUMN, RendererCssClassName.SORTABLE_COLUMN_NO_ORDER, SORTABLE_COLUMN_ICON_CLASSNAME));
-};
-var fullPageStyles = function fullPageStyles(_ref3, _ref4) {
-  var appearance = _ref3.appearance;
-  var theme = _ref4.theme;
-  if (appearance !== 'full-page') {
-    return '';
-  }
-  return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n\t\tmax-width: ", ";\n\t\tmargin: 0 auto;\n\t\tpadding: 0 ", "px;\n\t"])), theme && theme.layoutMaxWidth ? "".concat(theme.layoutMaxWidth, "px") : 'none', appearance === 'full-page' ? FullPagePadding : 0);
-};
-var fullWidthStyles = function fullWidthStyles(_ref5) {
-  var appearance = _ref5.appearance;
-  if (appearance !== 'full-width') {
-    return '';
-  }
-  return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n\t\tmax-width: ", "px;\n\t\tmargin: 0 auto;\n\n\t\t/* don't override if the breakout mark has width attribute defined */\n\t\t.fabric-editor-breakout-mark:not([data-has-width='true']),\n\t\t.ak-renderer-extension {\n\t\t\twidth: 100% !important;\n\t\t}\n\n\t\t", "\n\t"])), akEditorFullWidthLayoutWidth, isTableResizingEnabled(appearance) ? '' : "\n      .pm-table-container {\n        width: 100% !important;\n      }\n    ");
-};
-var breakoutWidthStyle = function breakoutWidthStyle() {
-  return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n\t\t*:not([data-mark-type='fragment']) .", " {\n\t\t\t// Ignored via go/ees007\n\t\t\t// eslint-disable-next-line @atlaskit/editor/enforce-todo-comment-format\n\t\t\t// TODO - improve inline style logic on table container so important styles aren't required here\n\t\t\twidth: 100% !important;\n\t\t\tleft: 0 !important;\n\t\t}\n\n\t\t[data-mark-type='fragment'] * .", " {\n\t\t\t// Ignored via go/ees007\n\t\t\t// eslint-disable-next-line @atlaskit/editor/enforce-todo-comment-format\n\t\t\t// TODO - improve inline style logic on table container so important styles aren't required here\n\t\t\twidth: 100% !important;\n\t\t\tleft: 0 !important;\n\t\t}\n\t"])), TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_CONTAINER);
-};
-var getShadowOverrides = function getShadowOverrides() {
-  return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n\t\t/** Shadow overrides */\n\t\t&.", "::after, &.", "::before {\n\t\t\twidth: ", "px;\n\t\t\tbackground: linear-gradient(\n\t\t\t\t\tto left,\n\t\t\t\t\ttransparent 0,\n\t\t\t\t\t", " 140%\n\t\t\t\t),\n\t\t\t\tlinear-gradient(\n\t\t\t\t\tto right,\n\t\t\t\t\t", " 0px,\n\t\t\t\t\ttransparent 1px\n\t\t\t\t);\n\t\t}\n\n\t\t&.", "::after {\n\t\t\tbackground: linear-gradient(\n\t\t\t\t\tto right,\n\t\t\t\t\ttransparent 0,\n\t\t\t\t\t", " 140%\n\t\t\t\t),\n\t\t\t\tlinear-gradient(\n\t\t\t\t\tto left,\n\t\t\t\t\t", " 0px,\n\t\t\t\t\ttransparent 1px\n\t\t\t\t);\n\t\t\tright: 0px;\n\t\t}\n\t"])), shadowClassNames.RIGHT_SHADOW, shadowClassNames.LEFT_SHADOW, tableShadowWidth, "var(--ds-shadow-overflow-spread, ".concat(N40A, ")"), "var(--ds-shadow-overflow-perimeter, transparent)", shadowClassNames.RIGHT_SHADOW, "var(--ds-shadow-overflow-spread, ".concat(N40A, ")"), "var(--ds-shadow-overflow-perimeter, transparent)");
-};
-function getAnnotationStyles(_ref6) {
-  var allowAnnotations = _ref6.allowAnnotations;
-  if (!fg('editor_inline_comments_on_inline_nodes')) {
-    return '';
-  }
-  if (fg('annotations_align_editor_and_renderer_styles')) {
-    return css({
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '& [data-annotation-draft-mark][data-annotation-inline-node]': {
-        borderBottom: '2px solid transparent',
-        cursor: 'pointer',
-        padding: '1px 0 2px',
-        background: "var(--ds-background-accent-yellow-subtler, ".concat(Y75, ")"),
-        borderBottomColor: "var(--ds-border-accent-yellow, ".concat(Y300, ")"),
-        boxShadow: "var(--ds-shadow-overlay, ".concat("1px 2px 3px ".concat(N60A, ", -1px 2px 3px ").concat(N60A), ")")
-      },
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '& [data-annotation-draft-mark][data-annotation-inline-node][data-inline-card]': {
-        padding: '5px 0 3px 0'
-      },
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-      '& [data-annotation-draft-mark][data-annotation-inline-node].date-lozenger-container': {
-        paddingTop: "var(--ds-space-025, 2px)"
-      }
-    });
-  }
-  return css({
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-    "& [data-mark-type='annotation'][data-mark-annotation-state='active'] [data-annotation-mark], & [data-annotation-draft-mark][data-annotation-inline-node]": {
-      background: "var(--ds-background-accent-yellow-subtler, ".concat(Y75, ")"),
-      borderBottom: "2px solid ".concat("var(--ds-border-accent-yellow, ".concat(Y300, ")")),
-      boxShadow: "var(--ds-shadow-overlay, ".concat("1px 2px 3px ".concat(N60A, ", -1px 2px 3px ").concat(N60A), ")"),
-      cursor: 'pointer',
-      padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-025, 2px)")
-    }
-  });
-}
-var tableRowHeight = 44;
-var stickyScrollbarStyles = "\n\tposition: relative;\n\tflex-direction: column;\n\n\t> .".concat(TableSharedCssClassName.TABLE_STICKY_SCROLLBAR_CONTAINER, " {\n\t  width: 100%;\n\t  display: block;\n\t  visibility: hidden;\n\t  overflow-x: auto;\n\t  position: sticky;\n\t  bottom: ", "var(--ds-space-0, 0px)", ";\n\t  z-index: 1;\n\t}\n\n\t> .").concat(TableSharedCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_BOTTOM, ",\n\t> .").concat(TableSharedCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_TOP, " {\n\t   position: absolute;\n\t   width: 100%;\n\t   height: 1px;\n\t   margin-top: -1px;\n\t   // need this to avoid sentinel being focused via keyboard\n\t   // this still allows it to be detected by intersection observer\n\t   visibility: hidden;\n\t }\n\t > .").concat(TableSharedCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_TOP, " {\n\t   top: ").concat(tableRowHeight * 3, "px;\n\t }\n\t > .").concat(TableSharedCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_BOTTOM, " {\n\t   bottom:  ", "var(--ds-space-250, 20px)", "; // MAX_BROWSER_SCROLLBAR_HEIGHT = 20;\n\t }\n  ");
-
-// Ignored via go/ees005
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export var rendererStyles = function rendererStyles(wrapperProps) {
-  return function (theme) {
-    var _getGlobalTheme = getGlobalTheme(),
-      typography = _getGlobalTheme.typography;
-    // This is required to be compatible with styled-components prop structure.
-    var themeProps = {
-      theme: theme
-    };
-    var useBlockRenderForCodeBlock = wrapperProps.useBlockRenderForCodeBlock,
-      appearance = wrapperProps.appearance;
-    var isAdvancedLayoutsOn = editorExperiment('advanced_layouts', true);
-
-    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/design-system/no-css-tagged-template-expression
-    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n\t\tfont-size: ", "px;\n\t\tline-height: 1.5rem;\n\t\tcolor: ", ";\n\n\t\t.", "::after {\n\t\t\t// we add a clearfix after ak-renderer-document in order to\n\t\t\t// contain internal floats (such as media images that are \"wrap-left\")\n\t\t\t// to just the renderer (and not spill outside of it)\n\t\t\tcontent: '';\n\t\t\tvisibility: hidden;\n\t\t\tdisplay: block;\n\t\t\theight: 0;\n\t\t\tclear: both;\n\t\t}\n\n\t\t", "\n\t\t", "\n\n      .", " {\n\t\t\t", "\n\t\t}\n\n\t\t& h1 {\n\t\t\t", "\n\t\t}\n\n\t\t& h2 {\n\t\t\t", "\n\t\t}\n\n\t\t& h3 {\n\t\t\t", "\n\t\t}\n\n\t\t& h4 {\n\t\t\t", "\n\t\t}\n\n\t\t& h5 {\n\t\t\t", "\n\t\t}\n\n\t\t& h6 {\n\t\t\t", "\n\t\t}\n\n\t\t& span.akActionMark {\n\t\t\tcolor: ", ";\n\t\t\ttext-decoration: none;\n\n\t\t\t&:hover {\n\t\t\t\tcolor: ", ";\n\t\t\t\ttext-decoration: underline;\n\t\t\t}\n\n\t\t\t&:active {\n\t\t\t\tcolor: ", ";\n\t\t\t}\n\t\t}\n\n\t\t& span.akActionMark {\n\t\t\tcursor: pointer;\n\t\t}\n\n\t\t& span[data-placeholder] {\n\t\t\tcolor: ", ";\n\t\t}\n\n\t\t", "\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", "\n\t\t", "\n\n\t\t& .UnknownBlock {\n\t\t\tfont-family: ", ";\n\t\t\tfont-size: ", ";\n\t\t\tfont-weight: ", ";\n\t\t\twhite-space: pre-wrap;\n\t\t\tword-wrap: break-word;\n\t\t}\n\n\t\t& span.date-node {\n\t\t\tbackground: ", ";\n\t\t\tborder-radius: ", ";\n\t\t\tcolor: ", ";\n\t\t\tpadding: ", " ", ";\n\t\t\tmargin: 0 1px;\n\t\t\ttransition: background 0.3s;\n\t\t}\n\n\t\t& span.date-node-highlighted {\n\t\t\tbackground: ", ";\n\t\t\tcolor: ", ";\n\t\t}\n\n\t\t& .renderer-image {\n\t\t\tmax-width: 100%;\n\t\t\tdisplay: block;\n\t\t\tmargin: ", " 0;\n\t\t}\n\n\t\t.", ".rich-media-wrapped + .", ":not(.rich-media-wrapped) {\n\t\t\tclear: both;\n\t\t}\n\n\t\t& .code-block,\n\t\t& blockquote,\n\t\t& hr,\n\t\t& > div > div:not(.rich-media-wrapped),\n\t\t.", ".rich-media-wrapped + .rich-media-wrapped + *:not(.rich-media-wrapped),\n\t\t.", ".rich-media-wrapped + div:not(.rich-media-wrapped),\n\t\t.", ".image-align-start,\n\t\t\t.", ".image-center,\n\t\t\t.", ".image-align-end {\n\t\t\tclear: both;\n\t\t}\n\n\t\t& .rich-media-wrapped {\n\t\t\t& + h1,\n\t\t\t& + h2,\n\t\t\t& + h3,\n\t\t\t& + h4,\n\t\t\t& + h5,\n\t\t\t& + h6 {\n\t\t\t\tmargin-top: ", ";\n\t\t\t}\n\t\t}\n\n\t\t", "\n\t\t/* plugin styles */\n    ", " &\n    div[class^='image-wrap-'] + div[class^='image-wrap-'] {\n\t\t\tmargin-left: 0;\n\t\t\tmargin-right: 0;\n\t\t}\n\n\t\t/* Breakout for tables and extensions */\n\t\t.", " > {\n\t\t\t", "\n\n\t\t\t* .", " {\n\t\t\t\toverflow-x: auto;\n\t\t\t}\n\n\t\t\t& .", ":first-child {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\n\t\t.", " {\n\t\t\t.", " {\n\t\t\t\tmargin-top: ", ";\n\t\t\t}\n\n\t\t\t.", " {\n\t\t\t\tmargin-left: 50%;\n\t\t\t\ttransform: translateX(-50%);\n\t\t\t}\n\n\t\t\t.", " {\n\t\t\t\toverflow-x: auto;\n\t\t\t}\n\n\t\t\t.", " .", " {\n\t\t\t\tdisplay: flex;\n\t\t\t}\n\t\t}\n\n\t\t", "\n\n\t\t.", " .", " {\n\t\t\tz-index: 0;\n\t\t\ttransition: all 0.1s linear;\n\t\t\tdisplay: flex; /* needed to avoid position: fixed jumpiness in Chrome */\n\n\t\t\t/** Shadow overrides */\n\t\t\t&.", "::after, &.", "::before {\n\t\t\t\ttop: ", "px;\n\t\t\t\theight: calc(100% - ", "px);\n\t\t\t\tz-index: ", ";\n\t\t\t}\n\n\t\t\t", "\n\n\t\t\t", "\n\n\t\t\t&\n          .", ",\n          &\n          .", " {\n\t\t\t\theight: calc(100% - ", "px);\n\t\t\t}\n\n\t\t\t/**\n\t\t\t * A hack for making all the <th /> heights equal in case some have shorter\n\t\t\t * content than others.\n\t\t\t *\n\t\t\t * This is done to make sort buttons fill entire <th />.\n\t\t\t*/\n\t\t\t", " {\n\t\t\t\theight: 1px; /* will be ignored */\n\t\t\t\t", ";\n\t\t\t\tmargin-left: 0;\n\t\t\t\tmargin-right: 0;\n\t\t\t}\n\n\t\t\t", " {\n\t\t\t\theight: 100%;\n\n\t\t\t\ttd,\n\t\t\t\tth {\n\t\t\t\t\tposition: relative;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\ttable[data-number-column='true'] {\n\t\t\t\t.", " {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tborder-right: 1px solid\n\t\t\t\t\t\t", ";\n\t\t\t\t\twidth: ", "px;\n\t\t\t\t\ttext-align: center;\n\t\t\t\t\tcolor: ", ";\n\t\t\t\t\tfont-size: ", ";\n\t\t\t\t}\n\n\t\t\t\t.fixed .", " {\n\t\t\t\t\tborder-right: 0px none;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\ttr[data-header-row].fixed {\n\t\t\tposition: fixed !important;\n\t\t\tdisplay: flex;\n\t\t\toverflow: hidden;\n\t\t\tz-index: ", ";\n\n\t\t\tborder-right: 1px solid ", ";\n\t\t\tborder-bottom: 1px solid ", ";\n\n\t\t\t/* this is to compensate for the table border */\n\t\t\ttransform: translateX(-1px);\n\t\t}\n\n\t\t.sticky > th {\n\t\t\tz-index: ", ";\n\t\t\tposition: sticky !important;\n\t\t\ttop: 0;\n\t\t}\n\n\t\t/* Make the number column header sticky */\n\t\t.sticky > td {\n\t\t\tposition: sticky !important;\n\t\t\ttop: 0;\n\t\t}\n\n\t\t/* add border for position: sticky\n     and work around background-clip: padding-box\n     bug for FF causing box-shadow bug in Chrome */\n\t\t.sticky th,\n\t\t.sticky td {\n\t\t\tbox-shadow:\n\t\t\t\t0px 1px ", ",\n\t\t\t\t0px -0.5px ", ",\n\t\t\t\tinset -1px 0px ", ",\n\t\t\t\t0px -1px ", ";\n\t\t}\n\n\t\t/* this will remove jumpiness caused in Chrome for sticky headers */\n\t\t.fixed + tr {\n\t\t\tmin-height: 0px;\n\t\t}\n\n\t\t/*\n   * We wrap CodeBlock in a grid to prevent it from overflowing the container of the renderer.\n   * See ED-4159.\n   */\n\t\t& .code-block {\n\t\t\tmax-width: 100%;\n\t\t\t/* -ms- properties are necessary until MS supports the latest version of the grid spec */\n\t\t\t/* stylelint-disable value-no-vendor-prefix, declaration-block-no-duplicate-properties */\n\t\t\tdisplay: block;\n\t\t\t/* stylelint-enable */\n\n\t\t\tposition: relative;\n\t\t\tborder-radius: ", ";\n\n\t\t\t/*\n     * The overall renderer has word-wrap: break; which causes issues with\n     * code block line numbers in Safari / iOS.\n     */\n\t\t\tword-wrap: normal;\n\t\t}\n\n\t\t& .MediaGroup,\n\t\t& .code-block {\n\t\t\tmargin-top: ", ";\n\n\t\t\t&:first-child {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\n\t\t", "\n\n\t\t", "\n\n      ", ";\n\t\t", ";\n\t\t& [data-layout-section] {\n\t\t\tmargin-top: ", ";\n\t\t\t& > div + div {\n\t\t\t\tmargin-left: ", ";\n\t\t\t}\n\n\t\t\t@media screen and (max-width: ", "px) {\n\t\t\t\t& > div + div {\n\t\t\t\t\tmargin-left: 0;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t& .MediaGroup,\n\t\t\t& .code-block {\n\t\t\t\tmargin-top: ", ";\n\n\t\t\t\t&:first-child {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t& li {\n\t\t\t> .code-block {\n\t\t\t\tmargin: ", " 0 0 0;\n\t\t\t}\n\t\t\t> .code-block:first-child {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\n\t\t\t> div:last-of-type.code-block {\n\t\t\t\tmargin-bottom: ", ";\n\t\t\t}\n\t\t}\n\n\t\t&:not([data-node-type='decisionList']) > li,\n      // This prevents https://product-fabric.atlassian.net/browse/ED-20924\n      &:not(.", ") > li {\n\t\t\t", "\n\t\t}\n\t"])), editorFontSize(themeProps), "var(--ds-text, ".concat(colors.N800, ")"), RendererCssClassName.DOCUMENT, fullPageStyles(wrapperProps, themeProps), fullWidthStyles(wrapperProps), RendererCssClassName.DOCUMENT, mediaInlineImageStyles, headingAnchorStyle('h1'), headingAnchorStyle('h2'), headingAnchorStyle('h3'), headingAnchorStyle('h4'), headingAnchorStyle('h5'), headingAnchorStyle('h6'), "var(--ds-link, ".concat(colors.B400, ")"), "var(--ds-link, ".concat(colors.B300, ")"), "var(--ds-link-pressed, ".concat(colors.B500, ")"), "var(--ds-text-subtlest, ".concat(colors.N200, ")"), telepointerStyles, whitespaceSharedStyles, blockquoteSharedStyles, headingsSharedStyles(typography), ruleSharedStyles(), paragraphSharedStyles(typography), listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, codeMarkSharedStyles(), shadowSharedStyle, dateSharedStyle, textColorStyles, backgroundColorStyles(), tasksAndDecisionsStyles, fg('platform-linking-visual-refresh-v1') ? getSmartCardSharedStyles() : smartCardSharedStyles, getAnnotationStyles(wrapperProps), "var(--ds-font-family-body, ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)", relativeFontSizeToBase16(14), "var(--ds-font-weight-regular, 400)", "var(--ds-background-neutral, ".concat(colors.N30A, ")"), "var(--ds-border-radius-100, 3px)", "var(--ds-text, ".concat(colors.N800, ")"), "var(--ds-space-025, 2px)", "var(--ds-space-050, 4px)", "var(--ds-background-danger, ".concat(colors.R50, ")"), "var(--ds-text-danger, ".concat(colors.R500, ")"), "var(--ds-space-300, 24px)", richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, "var(--ds-space-100, 8px)", alignedHeadingAnchorStyle(wrapperProps), mediaSingleSharedStyle, RendererCssClassName.DOCUMENT, breakoutWidthStyle(), RendererCssClassName.EXTENSION_OVERFLOW_CONTAINER, RendererCssClassName.EXTENSION, RendererCssClassName.DOCUMENT, RendererCssClassName.EXTENSION, blockNodesVerticalMargin, RendererCssClassName.EXTENSION_CENTER_ALIGN, TableSharedCssClassName.TABLE_NODE_WRAPPER, shadowObserverClassNames.SHADOW_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, tableSharedStyle(), RendererCssClassName.DOCUMENT, TableSharedCssClassName.TABLE_CONTAINER, shadowClassNames.RIGHT_SHADOW, shadowClassNames.LEFT_SHADOW, tableMarginTop - 1, tableMarginTop, akEditorStickyHeaderZIndex, getShadowOverrides(), isStickyScrollbarEnabled(appearance) ? stickyScrollbarStyles : '', shadowObserverClassNames.SENTINEL_LEFT, shadowObserverClassNames.SENTINEL_RIGHT, tableMarginTop, fg('platform_editor_renderer_table_header_styles') ? ".".concat(TableSharedCssClassName.TABLE_NODE_WRAPPER, " > table, .").concat(TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table") : 'table', tableSortableColumnStyle(wrapperProps), fg('platform_editor_renderer_table_header_styles') ? ".".concat(TableSharedCssClassName.TABLE_NODE_WRAPPER, " > table > tbody > tr:first-of-type, .").concat(TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table > tbody > tr:first-of-type") : 'table tr:first-of-type', RendererCssClassName.NUMBER_COLUMN, fg('platform_editor_tables_numbered_column_correction') ? "var(--ds-background-accent-gray-subtlest, #F1F2F4)" : "var(--ds-background-neutral, ".concat(akEditorTableToolbar, ")"), "var(--ds-background-accent-gray-subtler, ".concat(akEditorTableBorder, ")"), akEditorTableNumberColumnWidth, "var(--ds-text-subtlest, ".concat(colors.N200, ")"), relativeFontSizeToBase16(14), RendererCssClassName.NUMBER_COLUMN, akEditorStickyHeaderZIndex, "var(--ds-background-accent-gray-subtler, ".concat(akEditorTableBorder, ")"), "var(--ds-background-accent-gray-subtler, ".concat(akEditorTableBorder, ")"), akEditorStickyHeaderZIndex, "var(--ds-background-accent-gray-subtler, ".concat(akEditorTableBorder, ")"), "var(--ds-background-accent-gray-subtler, ".concat(akEditorTableBorder, ")"), "var(--ds-background-accent-gray-subtler, ".concat(akEditorTableToolbar, ")"), "var(--ds-background-accent-gray-subtler, ".concat(akEditorTableToolbar, ")"), "var(--ds-border-radius-100, 3px)", blockNodesVerticalMargin, useGridRenderForCodeBlock(useBlockRenderForCodeBlock), getLightWeightCodeBlockStylesForRootRendererStyleSheet(), isAdvancedLayoutsOn ? columnLayoutResponsiveSharedStyle : columnLayoutSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveRendererStyles, "var(--ds-space-250, 20px)", isAdvancedLayoutsOn ? 0 : "var(--ds-space-400, 32px)", gridMediumMaxWidth, blockNodesVerticalMargin, blockNodesVerticalMargin, blockNodesVerticalMargin, SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, browser.safari ? codeBlockInListSafariFix : '');
-  };
-};
-var useGridRenderForCodeBlock = function useGridRenderForCodeBlock(codeBlockRenderAsBlock) {
-  if (codeBlockRenderAsBlock) {
-    return '';
-  }
-  return "& .code-block {\n       /* -ms- properties are necessary until MS supports the latest version of the grid spec */\n       /* stylelint-disable value-no-vendor-prefix, declaration-block-no-duplicate-properties */\n       display: -ms-grid;\n       display: grid;\n       -ms-grid-columns: auto 1fr;\n       /* stylelint-enable */\n\n       grid-template-columns: minmax(0, 1fr);\n\n       & > span {\n         /* stylelint-disable value-no-vendor-prefix */\n         -ms-grid-row: 1;\n         -ms-grid-column: 2;\n         /* stylelint-enable */\n         grid-column: 1;\n       }\n     }";
-};
+export var TELEPOINTER_ID = 'ai-streaming-telepointer';

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

@@ -12,26 +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
-var markStyles = function markStyles() {
-  return 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
-var markStylesNew = css({
+var markStyles = css({
   color: 'inherit',
   backgroundColor: 'unset',
   WebkitTapHighlightColor: 'transparent',
@@ -58,7 +43,7 @@ export var AnnotationDraft = function AnnotationDraft(_ref) {
     // 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 var getAnnotationIndex = function getAnnotationIndex(annotationPosition, fragmentCount) {

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

@@ -1,7 +1,5 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-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; }
 /**
@@ -12,16 +10,11 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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
-var markStylesOld = function markStylesOld() {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tcolor: inherit;\n\tbackground-color: unset;\n\t-webkit-tap-highlight-color: transparent;\n\n\t&[data-mark-annotation-state='", "'] {\n\t\t", "\n\t\t", "\n\n\t\t&:focus,\n\t\t\t&[data-has-focus='true'] {\n\t\t\t", "\n\t\t}\n\t\t&[data-is-hovered='true']:not([data-has-focus='true']) {\n\t\t\t", "\n\t\t}\n\t}\n"])), AnnotationMarkStates.ACTIVE, fg('editor_inline_comments_on_inline_nodes') ? AnnotationSharedCSSByState().common : '', AnnotationSharedCSSByState().blur, AnnotationSharedCSSByState().focus, fg('confluence-frontend-comments-panel') ? AnnotationSharedCSSByState().hover : '');
-};
-var markStylesNew = css(_defineProperty({
+var markStyles = css(_defineProperty({
   color: 'inherit',
   backgroundColor: 'unset',
   WebkitTapHighlightColor: 'transparent'
@@ -59,7 +52,7 @@ var markStylesWithUpdatedShadow = css(_defineProperty({}, "&[data-mark-annotatio
     boxShadow: "var(--ds-shadow-raised, 0px 1px 1px #091E4240, 0px 0px 1px #091E424f)"
   }
 }));
-var markStylesNewWithInlineComments = css(_defineProperty({}, "&[data-mark-annotation-state='".concat(AnnotationMarkStates.ACTIVE, "']"), {
+var markStylesWithInlineComments = css(_defineProperty({}, "&[data-mark-annotation-state='".concat(AnnotationMarkStates.ACTIVE, "']"), {
   // was from common in AnnotationSharedCSSByState().common
   borderBottom: '2px solid transparent',
   cursor: 'pointer',
@@ -83,7 +76,7 @@ var markStylesNewWithInlineComments = css(_defineProperty({}, "&[data-mark-annot
     boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px #091E4226, 0px 0px 1px #091E424f)"
   }
 }));
-var markStylesNewWithCommentsPanel = css(_defineProperty({}, "&[data-mark-annotation-state='".concat(AnnotationMarkStates.ACTIVE, "']"), {
+var markStylesWithCommentsPanel = css(_defineProperty({}, "&[data-mark-annotation-state='".concat(AnnotationMarkStates.ACTIVE, "']"), {
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
   '&[data-is-hovered="true"]:not([data-has-focus="true"])': {
     background: "var(--ds-background-accent-yellow-subtlest-hovered, #F8E6A0)",
@@ -96,28 +89,7 @@ var isMobile = function isMobile() {
   // eslint-disable-next-line require-unicode-regexp
   return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
 };
-var accessibilityStylesOld = function accessibilityStylesOld(startMarker, endMarker) {
-  return 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: "' [".concat(startMarker, "] '")
-    },
-    '&::after': {
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
-      content: "' [".concat(endMarker, "] '")
-    }
-  });
-};
-var accessibilityStylesNew = css({
+var accessibilityStyles = css({
   '&::before, &::after': {
     clipPath: 'inset(100%)',
     clip: 'rect(1px, 1px, 1px, 1px)',
@@ -207,32 +179,13 @@ export var MarkComponent = function MarkComponent(_ref) {
   } : _objectSpread({
     'aria-details': annotationIds.join(', ')
   }, desktopAccessibilityAttributes);
-  var getAccessibilityStylesOld = function getAccessibilityStylesOld() {
-    if (isMobile()) {
-      return {};
-    }
-    if (state !== AnnotationMarkStates.RESOLVED) {
-      var startMarker = intl.formatMessage(inlineCommentMessages.contentRendererInlineCommentMarkerStart);
-      var endMarker = intl.formatMessage(inlineCommentMessages.contentRendererInlineCommentMarkerEnd);
-      return accessibilityStylesOld(startMarker, endMarker);
-    } else {
-      return {};
-    }
-  };
-  if (fg('platform_editor_emotion_refactor_renderer')) {
-    return jsx(useBlockLevel ? 'div' : 'mark', _objectSpread(_objectSpread(_objectSpread(_defineProperty({
-      id: 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', _objectSpread(_objectSpread(_objectSpread(_defineProperty({
     id: 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/ui/annotations/selection/mounter.js

@@ -53,6 +53,22 @@ export var SelectionInlineCommentMounter = /*#__PURE__*/React.memo(function (pro
     // but we want to prioritize draft positions if they are being used by consumers
     var positionToAnnotate = draftDocumentPosition || documentPosition;
     if (!positionToAnnotate || !applyAnnotation) {
+      // TODO: EDITOR-595 - This analytic event is temporary and should be removed once the following issue
+      // has been identified and fixed: https://atlassian.slack.com/archives/C08JK0WSCH5/p1745902609966999
+      if (createAnalyticsEvent && fg('platform_renderer_annotations_create_debug_logging')) {
+        createAnalyticsEvent({
+          action: 'failed',
+          actionSubject: 'applyAnnotation',
+          actionSubjectId: 'inlineCommentFailureReason',
+          attributes: {
+            reason: 'Annotation Position invalid',
+            draftDocumentPosition: draftDocumentPosition,
+            documentPosition: documentPosition,
+            applyAnnotation: !!applyAnnotation
+          },
+          eventType: EVENT_TYPE.OPERATIONAL
+        }).fire(FabricChannel.editor);
+      }
       return false;
     }
 

package/dist/types/actions/index.d.ts

@@ -45,6 +45,7 @@ export default class RendererActions implements RendererActionsOptions, Annotati
      * Validate whether we can create an annotation between two positions
      */
     _privateValidatePositionsForAnnotation(from: number, to: number): boolean;
+    _privateWhyCannotApplyAnnotationOnRange: (pos: Position, doc: Node, schema: Schema) => string;
     deleteAnnotation(annotationId: string, annotationType: 'inlineComment'): false | {
         step: Step;
         doc: JSONDocNode;

package/dist/types/react/nodes/codeBlock/components/lightWeightCodeBlock.d.ts

@@ -12,5 +12,5 @@ export declare const LightWeightCodeBlockCssClassName: {
  * @deprecated styles are moved to RendererStyleContainer
  */
 export declare const getLightWeightCodeBlockStylesForRootRendererStyleSheet: () => import("@emotion/react").SerializedStyles;
-declare const LightWeightCodeBlock: React.FC<Omit<Pick<CodeBlockProps, "text" | "className" | "codeBidiWarningTooltipEnabled"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const LightWeightCodeBlock: React.ForwardRefExoticComponent<Pick<CodeBlockProps, "text" | "className" | "codeBidiWarningTooltipEnabled"> & React.RefAttributes<HTMLDivElement>>;
 export default LightWeightCodeBlock;

package/dist/types/ui/Renderer/style.d.ts

@@ -1,13 +1,2 @@
-import type { RendererAppearance } from './types';
 export declare const FullPagePadding = 32;
-type RendererWrapperProps = {
-    allowAnnotations?: boolean;
-    appearance?: RendererAppearance;
-    allowNestedHeaderLinks: boolean;
-    allowColumnSorting: boolean;
-    useBlockRenderForCodeBlock: boolean;
-    allowTableResizing?: boolean;
-};
 export declare const TELEPOINTER_ID = "ai-streaming-telepointer";
-export declare const rendererStyles: (wrapperProps: RendererWrapperProps) => (theme: any) => import("@emotion/react").SerializedStyles;
-export {};

package/dist/types/ui/annotations/element/mark.d.ts

@@ -17,7 +17,11 @@ type MarkComponentProps = {
     useBlockLevel?: boolean;
 };
 export declare const MarkComponent: ({ annotationParentIds, children, dataAttributes, id, state, hasFocus, isHovered, onClick, useBlockLevel, }: React.PropsWithChildren<MarkComponentProps>) => React.ReactElement<{
-    css?: {}[] | undefined;
+    css?: (false | import("@emotion/react").SerializedStyles)[] | undefined;
+    style?: {
+        '--ak-renderer-annotation-startmarker': string;
+        '--ak-renderer-annotation-endmarker': string;
+    } | undefined;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
     'data-id': string;
@@ -25,7 +29,11 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     'aria-disabled': boolean;
     id: string;
 } | {
-    css?: {}[] | undefined;
+    css?: (false | import("@emotion/react").SerializedStyles)[] | undefined;
+    style?: {
+        '--ak-renderer-annotation-startmarker': string;
+        '--ak-renderer-annotation-endmarker': string;
+    } | undefined;
     'data-mark-annotation-state': AnnotationMarkStates;
     'data-has-focus': boolean;
     'data-is-hovered': boolean;
@@ -35,7 +43,11 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     'aria-disabled': boolean;
     id: string;
 } | {
-    css?: {}[] | undefined;
+    css?: (false | import("@emotion/react").SerializedStyles)[] | undefined;
+    style?: {
+        '--ak-renderer-annotation-startmarker': string;
+        '--ak-renderer-annotation-endmarker': string;
+    } | undefined;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
     'data-id': string;
@@ -48,7 +60,11 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     'aria-disabled'?: undefined;
     id: string;
 } | {
-    css?: {}[] | undefined;
+    css?: (false | import("@emotion/react").SerializedStyles)[] | undefined;
+    style?: {
+        '--ak-renderer-annotation-startmarker': string;
+        '--ak-renderer-annotation-endmarker': string;
+    } | undefined;
     'data-mark-annotation-state': AnnotationMarkStates;
     'data-has-focus': boolean;
     'data-is-hovered': boolean;
@@ -63,7 +79,11 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     'aria-disabled'?: undefined;
     id: string;
 } | {
-    css?: {}[] | undefined;
+    css?: (false | import("@emotion/react").SerializedStyles)[] | undefined;
+    style?: {
+        '--ak-renderer-annotation-startmarker': string;
+        '--ak-renderer-annotation-endmarker': string;
+    } | undefined;
     'data-mark-type': string;
     'data-mark-annotation-type': import("@atlaskit/adf-schema").AnnotationTypes;
     'data-id': string;
@@ -76,7 +96,11 @@ export declare const MarkComponent: ({ annotationParentIds, children, dataAttrib
     'aria-disabled'?: undefined;
     id: string;
 } | {
-    css?: {}[] | undefined;
+    css?: (false | import("@emotion/react").SerializedStyles)[] | undefined;
+    style?: {
+        '--ak-renderer-annotation-startmarker': string;
+        '--ak-renderer-annotation-endmarker': string;
+    } | undefined;
     'data-mark-annotation-state': AnnotationMarkStates;
     'data-has-focus': boolean;
     'data-is-hovered': boolean;

package/dist/types-ts4.5/actions/index.d.ts

@@ -45,6 +45,7 @@ export default class RendererActions implements RendererActionsOptions, Annotati
      * Validate whether we can create an annotation between two positions
      */
     _privateValidatePositionsForAnnotation(from: number, to: number): boolean;
+    _privateWhyCannotApplyAnnotationOnRange: (pos: Position, doc: Node, schema: Schema) => string;
     deleteAnnotation(annotationId: string, annotationType: 'inlineComment'): false | {
         step: Step;
         doc: JSONDocNode;

package/dist/types-ts4.5/react/nodes/codeBlock/components/lightWeightCodeBlock.d.ts

@@ -12,5 +12,5 @@ export declare const LightWeightCodeBlockCssClassName: {
  * @deprecated styles are moved to RendererStyleContainer
  */
 export declare const getLightWeightCodeBlockStylesForRootRendererStyleSheet: () => import("@emotion/react").SerializedStyles;
-declare const LightWeightCodeBlock: React.FC<Omit<Pick<CodeBlockProps, "text" | "className" | "codeBidiWarningTooltipEnabled"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const LightWeightCodeBlock: React.ForwardRefExoticComponent<Pick<CodeBlockProps, "text" | "className" | "codeBidiWarningTooltipEnabled"> & React.RefAttributes<HTMLDivElement>>;
 export default LightWeightCodeBlock;

package/dist/types-ts4.5/ui/Renderer/style.d.ts

@@ -1,13 +1,2 @@
-import type { RendererAppearance } from './types';
 export declare const FullPagePadding = 32;
-type RendererWrapperProps = {
-    allowAnnotations?: boolean;
-    appearance?: RendererAppearance;
-    allowNestedHeaderLinks: boolean;
-    allowColumnSorting: boolean;
-    useBlockRenderForCodeBlock: boolean;
-    allowTableResizing?: boolean;
-};
 export declare const TELEPOINTER_ID = "ai-streaming-telepointer";
-export declare const rendererStyles: (wrapperProps: RendererWrapperProps) => (theme: any) => import("@emotion/react").SerializedStyles;
-export {};