@atlaskit/editor-core 214.2.4 → 215.0.0

package/dist/esm/ui/ContentStyles/ai-panels.js

@@ -1,87 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-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; }
-/**
- * TODO ED-26957 - remove legacy styles when static emotion refactor is complete
- * We are moving this to new location under FF: platform_editor_core_static_emotion
- * New location: packages/editor/editor-core/src/ui/EditorContentContainer.tsx
- * If you are making updates to this file, please updates in new location as well.
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, keyframes } from '@emotion/react';
-var isFirefox = typeof navigator !== 'undefined' && navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
-var rotationAnimation = keyframes({
-  '0%': _objectSpread({
-    '--panel-gradient-angle': '0deg'
-  }, isFirefox ? {
-    backgroundPosition: '100%'
-  } : {}),
-  '100%': _objectSpread({
-    '--panel-gradient-angle': '360deg'
-  }, isFirefox ? {
-    backgroundPosition: '-100%'
-  } : {})
-});
-var aiPrismColor = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, 'prism.border.step.1', {
-  light: '#0065FF',
-  dark: '#0065FF80'
-}), 'prism.border.step.2', {
-  light: '#0469FF',
-  dark: '#0469FF80'
-}), 'prism.border.step.3', {
-  light: '#BF63F3',
-  dark: '#BF63F380'
-}), 'prism.border.step.4', {
-  light: '#FFA900',
-  dark: '#FFA90080'
-});
-var prismBorderAnimationStyles = css({
-  '&::before, &::after': _objectSpread(_objectSpread({
-    animationName: rotationAnimation,
-    animationDuration: '2s',
-    animationTimingFunction: 'linear',
-    animationIterationCount: 'infinite'
-  }, isFirefox ? {
-    animationDirection: 'normal',
-    animationDuration: '1s'
-  } : {}), {}, {
-    '@media (prefers-reduced-motion)': {
-      animation: 'none'
-    }
-  })
-});
-var prismBorderStyles = function prismBorderStyles(colorMode, hover) {
-  return css(_objectSpread({
-    content: "''",
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    position: 'absolute',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    zIndex: -1,
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    width: "calc(100% + 2px)",
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    height: "calc(100% + 2px)",
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    top: "-1px",
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    left: "-1px",
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    borderRadius: "calc(".concat("var(--ds-radius-small, 3px)", " + 1px)"),
-    transform: 'translate3d(0, 0, 0)'
-  }, hover ? {
-    background: "var(--ds-border-input, #8590A2)"
-  } : isFirefox ? {
-    background: "linear-gradient(90deg,\n\t\t\t\t\t\t\t\t".concat(aiPrismColor['prism.border.step.1'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 0%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.2'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 12%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.3'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 24%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.4'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 48%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.3'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 64%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.2'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 80%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.1'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 100%\n\t\t\t\t\t\t\t)"),
-    backgroundSize: '200%'
-  } : {
-    background: "conic-gradient(\n\t\t\t\t\t\t\t\tfrom var(--panel-gradient-angle, 270deg),\n\t\t\t\t\t\t\t\t".concat(aiPrismColor['prism.border.step.1'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 0%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.2'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 20%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.3'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 50%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.4'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 56%,\n\t\t\t\t\t\t\t\t").concat(aiPrismColor['prism.border.step.1'][colorMode !== null && colorMode !== void 0 ? colorMode : 'light'], " 100%\n\t\t\t\t\t\t\t)")
-  }));
-};
-export var aiPanelStyles = function aiPanelStyles(colorMode
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
-) {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t@property --panel-gradient-angle {\n\t\tsyntax: '<angle>';\n\t\tinitial-value: 270deg;\n\t\tinherits: false;\n\t}\n\n\tdiv[extensionType='com.atlassian.ai-blocks'] {\n\t\t/* This hides the label for the extension */\n\t\t.extension-label {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\t/* This styles the ai panel correctly when its just sitting on the page and there\n\t\tis no user interaction */\n\t\t.extension-container {\n\t\t\tposition: relative;\n\t\t\tbox-shadow: none;\n\t\t\toverflow: unset;\n\t\t\tbackground-color: ", " !important;\n\t\t\t&::before,\n\t\t\t&::after {\n\t\t\t\t", "\n\t\t\t}\n\t\t\t&.with-hover-border {\n\t\t\t\t&::before,\n\t\t\t\t&::after {\n\t\t\t\t\t", "\n\t\t\t\t}\n\t\t\t}\n\t\t\t& .with-margin-styles {\n\t\t\t\tbackground-color: ", " !important;\n\t\t\t\tborder-radius: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t/* This styles the ai panel correctly when its streaming */\n\tdiv[extensionType='com.atlassian.ai-blocks']:has(.streaming) {\n\t\t.extension-container {\n\t\t\tbox-shadow: none;\n\t\t\toverflow: unset;\n\t\t\t", "\n\t\t\t&::before,\n\t\t\t&::after {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\t}\n\n\t/* This styles the ai panel correctly when a user is hovering over the delete button in the floating panel */\n\tdiv[extensionType='com.atlassian.ai-blocks'].danger {\n\t\t.extension-container {\n\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t}\n\t}\n\n\t/* This removes the margin from the action list when inside an ai panel */\n\tdiv[extensiontype='com.atlassian.ai-blocks'][extensionkey='ai-action-items-block:aiActionItemsBodiedExtension'] {\n\t\tdiv[data-node-type='actionList'] {\n\t\t\tmargin: 0 !important;\n\t\t}\n\t}\n"])), "var(--ds-surface, #FFFFFF)", prismBorderStyles(colorMode), prismBorderStyles(colorMode, true), "var(--ds-surface, #FFFFFF)", "var(--ds-radius-small, 3px)", prismBorderAnimationStyles, prismBorderStyles(colorMode), "var(--ds-border-danger, #E2483D)");
-};

package/dist/esm/ui/ContentStyles/code-bidi-warning.js

@@ -1,68 +0,0 @@
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
-import { css } from '@emotion/react';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
-export var codeBidiWarningStyles = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  '[data-prosemirror-node-name="code-bidi-warning"]': {
-    display: 'inline-block'
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  '[data-prosemirror-node-name="code-bidi-warning"] [data-bidi-component="code-bidi-warning-decorator"]': {
-    paddingInlineStart: "var(--ds-space-050, 4px)",
-    paddingInlineEnd: "var(--ds-space-050, 4px)",
-    font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
-    fontStyle: 'normal',
-    fontFamily: "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)",
-    // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
-    paddingTop: '0.05rem',
-    // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
-    paddingBottom: '0.05rem',
-    color: "var(--ds-text-warning, #A54800)",
-    backgroundColor: "var(--ds-background-warning, #FFF7D6)"
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  '[data-prosemirror-node-name="code-bidi-warning"] [data-bidi-component="code-bidi-warning-decorator"]:hover': {
-    color: "var(--ds-text-warning, #A54800)",
-    backgroundColor: "var(--ds-background-warning-hovered, #F8E6A0)"
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  '[data-prosemirror-node-name="code-bidi-warning"] [data-bidi-component="code-bidi-warning-tooltip"]': {
-    visibility: 'hidden',
-    boxSizing: 'border-box',
-    width: '15pc',
-    backgroundColor: "var(--ds-background-neutral-bold, #44546F)",
-    color: "var(--ds-text-inverse, #FFFFFF)",
-    overflowWrap: 'break-word',
-    cursor: 'default',
-    borderRadius: "var(--ds-radius-small, 4px)",
-    margin: "var(--ds-space-0, 0px)",
-    padding: "var(--ds-space-025, 2px)".concat(" ", "var(--ds-space-075, 6px)"),
-    position: 'fixed',
-    // The character label will be ~80px and this is positioned from the end of that label
-    // We also use this instead of top: 24px to make sure the tooltip maintains its initial position
-    // instead of being positioned relative to the viewport.
-    // We need to use position: fixed so that the tooltip bypasses the overflow settings of the code block
-    // and is always visible.
-    // We also offset a little extra here to account for the transition behavior (to replicate ADS fade-in-from-top)
-    transform: 'translate(calc(-50% - 40px), calc(24px - 4px))',
-    opacity: 0,
-    whiteSpace: 'normal',
-    font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
-    zIndex: 9999,
-    // Exit animation timings
-    // - Mark invisible after 0.475s
-    // - After 0.3s, fade out and move up over 0.175s
-    transition: 'visibility 0s linear 0.475s, opacity 0.175s cubic-bezier(0.15,1,0.3,1) 0.3s, transform 0.175s cubic-bezier(0.15,1,0.3,1) 0.3s'
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  '[data-prosemirror-node-name="code-bidi-warning"]:hover [data-bidi-component="code-bidi-warning-tooltip"]': {
-    visibility: 'visible',
-    transform: 'translate(calc(-50% - 40px), calc(24px))',
-    opacity: 1,
-    // Enter animation timings
-    // - Mark visible after 0.3s of hovering
-    // - After 0.3s, fade in over 0.175s
-    // - After 0.3s, move down over 0.35s
-    transition: 'visibility 0s linear 0.3s, opacity 0.175s cubic-bezier(0.15,1,0.3,1) 0.3s, transform 0.35s cubic-bezier(0.15,1,0.3,1) 0.3s'
-  }
-});

package/dist/esm/ui/ContentStyles/code-block.js

@@ -1,21 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
-import { CodeBlockSharedCssClassName, codeBlockSharedStyles } from '@atlaskit/editor-common/styles';
-import { akEditorDeleteBackground, akEditorDeleteBorder, akEditorDeleteIconColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
-import { functionWithFG } from '@atlaskit/platform-feature-flags-react';
-var GutterDangerOverlay = function GutterDangerOverlay() {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t&::after {\n\t\theight: 100%;\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\twidth: 24px;\n\t\tbackground-color: ", ";\n\t}\n"])), "var(--ds-blanket-danger, none)");
-};
-
-/* When code-block is inside the panel  */
-var firstCodeBlockWithNoMargin = functionWithFG('platform_editor_nested_dnd_styles_changes', function () {
-  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t\t.ak-editor-panel__content {\n\t\t\t> .code-block:first-child,\n\t\t\t> .ProseMirror-widget:first-child + .code-block,\n\t\t\t> .ProseMirror-widget:first-child + .ProseMirror-widget + .code-block {\n\t\t\t\tmargin: 0 0 0 0 !important;\n\t\t\t}\n\t\t}\n\t"])));
-}, function () {
-  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\t\t.ak-editor-panel__content {\n\t\t\t> .code-block:first-child {\n\t\t\t\tmargin: 0 0 0 0 !important;\n\t\t\t}\n\t\t}\n\t"])));
-});
-export var codeBlockStyles = function codeBlockStyles() {
-  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", "\n\t}\n\n\t.ProseMirror li {\n\t\t/* if same list item has multiple code blocks we need top margin for all but first */\n\t\t> .code-block {\n\t\t\tmargin: ", " 0 0 0;\n\t\t}\n\t\t> .code-block:first-child,\n\t\t> .ProseMirror-gapcursor:first-child + .code-block {\n\t\t\tmargin-top: 0;\n\t\t}\n\n\t\t> div:last-of-type.code-block,\n\t\t> pre:last-of-type.code-block {\n\t\t\tmargin-bottom: ", ";\n\t\t}\n\t}\n\n\t.ProseMirror .code-block.", ":not(.danger) {\n\t\t", "\n\t}\n\n\t/* Danger when top level node */\n\t.ProseMirror .danger.code-block {\n\t\tbox-shadow: 0 0 0 ", "px\n\t\t\t", ";\n\n\t\t.", " {\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: ", ";\n\t\t\t", ";\n\t\t}\n\n\t\t.", " {\n\t\t\tbackground-color: ", ";\n\t\t}\n\t}\n\n\t/* Danger when nested node */\n\t.ProseMirror .danger .code-block {\n\t\t.", " {\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: ", ";\n\t\t\t", ";\n\t\t}\n\n\t\t.", " {\n\t\t\tbackground-color: ", ";\n\t\t}\n\t}\n\n\t", "\n"])), codeBlockSharedStyles(), blockNodesVerticalMargin, blockNodesVerticalMargin, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Blanket]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER, "var(--ds-background-danger, #FFECEB)", "var(--ds-text-danger, ".concat(akEditorDeleteIconColor, ")"), GutterDangerOverlay(), CodeBlockSharedCssClassName.CODEBLOCK_CONTENT, "var(--ds-blanket-danger, ".concat(akEditorDeleteBackground, ")"), CodeBlockSharedCssClassName.CODEBLOCK_LINE_NUMBER_GUTTER, "var(--ds-background-danger, rgba(255, 143, 115, 0.5))", "var(--ds-text-danger, ".concat(akEditorDeleteIconColor, ")"), GutterDangerOverlay(), CodeBlockSharedCssClassName.CODEBLOCK_CONTENT, "var(--ds-blanket-danger, rgba(255, 189, 173, 0.5))", firstCodeBlockWithNoMargin());
-};

package/dist/esm/ui/ContentStyles/date.js

@@ -1,37 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
-import { DateSharedCssClassName } from '@atlaskit/editor-common/styles';
-import { akEditorDeleteBorder, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
-export var dateNodeStyles = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  "[data-prosemirror-node-name='date'] .date-lozenger-container span": {
-    backgroundColor: "var(--ds-background-neutral, #091E420F)",
-    color: "var(--ds-text, #172B4D)",
-    borderRadius: "var(--ds-radius-small, 4px)",
-    padding: "var(--ds-space-025, 2px)".concat(" ", "var(--ds-space-050, 4px)"),
-    margin: '0 1px',
-    position: 'relative',
-    transition: 'background 0.3s',
-    whiteSpace: 'nowrap',
-    cursor: 'unset'
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  "[data-prosemirror-node-name='date'] .date-lozenger-container span:hover": {
-    backgroundColor: "var(--ds-background-neutral-hovered, #091E4224)"
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  "[data-prosemirror-node-name='date'] .date-lozenger-container span.date-node-color-red": {
-    backgroundColor: "var(--ds-background-accent-red-subtlest, #FFECEB)",
-    color: "var(--ds-text-accent-red, #AE2E24)"
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  "[data-prosemirror-node-name='date'] .date-lozenger-container span.date-node-color-red:hover": {
-    backgroundColor: "var(--ds-background-accent-red-subtler, #FFD5D2)"
-  }
-});
-
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var dateStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.", " {\n\t\t.", " {\n\t\t\tline-height: initial;\n\t\t\tcursor: pointer;\n\t\t}\n\n\t\t&.", " {\n\t\t\t.", " > span {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\t}\n\n\t.danger {\n\t\t.", ".", "\n\t\t\t.", "\n\t\t\t> span {\n\t\t\tbox-shadow: 0 0 0 ", "px\n\t\t\t\t", ";\n\t\t}\n\t}\n"])), DateSharedCssClassName.DATE_CONTAINER, DateSharedCssClassName.DATE_WRAPPER, akEditorSelectedNodeClassName, DateSharedCssClassName.DATE_WRAPPER, getSelectionStyles([SelectionStyle.BoxShadow]), DateSharedCssClassName.DATE_CONTAINER, akEditorSelectedNodeClassName, DateSharedCssClassName.DATE_WRAPPER, akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"));

package/dist/esm/ui/ContentStyles/expand.js

@@ -1,31 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2;
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
-import { BreakoutCssClassName, expandClassNames, sharedExpandStyles } from '@atlaskit/editor-common/styles';
-import { akEditorSelectedBorder, akEditorSelectedNodeClassName, akLayoutGutterOffset, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
-import { fg } from '@atlaskit/platform-feature-flags';
-var EXPAND_SELECTED_BACKGROUND = "var(--ds-background-neutral-subtle, rgba(255, 255, 255, 0.6))";
-var EXPAND_ICON_COLOR = function EXPAND_ICON_COLOR() {
-  return css({
-    color: "var(--ds-icon-subtle, #626F86)"
-  });
-};
-var DANGER_STATE_BACKGROUND_COLOR = "var(--ds-background-danger, #FFECEB)";
-var DANGER_STATE_BORDER_COLOR = "var(--ds-border-danger, #E2483D)";
-var firstNodeWithNotMarginTop = function firstNodeWithNotMarginTop() {
-  return fg('platform_editor_nested_dnd_styles_changes') ? // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression
-  css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t\t\t\t> :nth-child(1 of :not(style, .ProseMirror-gapcursor, .ProseMirror-widget, span)) {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\n\t\t\t\t> div.ak-editor-expand[data-node-type='nestedExpand'] {\n\t\t\t\t\tmargin-top: ", ";\n\t\t\t\t}\n\t\t\t"])), "var(--ds-space-050, 0.25rem)") : '';
-};
-
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
-export var expandStyles = function expandStyles() {
-  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t.", " > div {\n\t\tdisplay: flex;\n\t}\n\n\t.", " {\n\t\t", "\n\n\t\tcursor: pointer;\n\t\tbox-sizing: border-box;\n\n\t\ttd > & {\n\t\t\tmargin-top: 0;\n\t\t}\n\n\t\t.", " svg {\n\t\t\t", ";\n\t\t\ttransform: rotate(90deg);\n\t\t}\n\n\t\t&.", ":not(.danger) {\n\t\t\t", "\n\t\t}\n\n\t\t&.danger {\n\t\t\tbackground: ", ";\n\t\t\tborder-color: ", ";\n\t\t}\n\t}\n\n\t.ProseMirror\n\t\t> .", ",\n\t\t.", "\n\t\t> .", " {\n\t\tmargin-left: -", "px;\n\t\tmargin-right: -", "px;\n\t}\n\n\t", "\n\n\t.", " {\n\t\t", "\n\t\tcursor: text;\n\t\tpadding-top: 0px;\n\t}\n\n\t.", " {\n\t\t", "\n\t}\n\n\t.", " {\n\t\t", ";\n\t\talign-items: center;\n\t\toverflow: visible;\n\t}\n\n\t.", " {\n\t\tbackground: ", ";\n\t\tborder-color: ", ";\n\n\t\t.", " {\n\t\t\tpadding-top: ", ";\n\n\t\t\t", "\n\t\t}\n\t}\n\n\t.", " {\n\t\twidth: 100%;\n\t}\n\n\t/* stylelint-disable property-no-unknown, value-keyword-case */\n\t.", ":(.", ") {\n\t\t.expand-content-wrapper {\n\t\t\theight: auto;\n\t\t}\n\t}\n\t/* stylelint-enable property-no-unknown, value-keyword-case */\n\n\t.", ":not(.", ") {\n\t\t.ak-editor-expand__content {\n\t\t\tposition: absolute;\n\t\t\theight: 1px;\n\t\t\twidth: 1px;\n\t\t\toverflow: hidden;\n\t\t\tclip: rect(1px, 1px, 1px, 1px);\n\t\t\twhite-space: nowrap;\n\t\t}\n\n\t\t.", " svg {\n\t\t\t", ";\n\t\t\ttransform: rotate(0deg);\n\t\t}\n\n\t\t&:not(.", "):not(.danger) {\n\t\t\tbackground: transparent;\n\t\t\tborder-color: transparent;\n\n\t\t\t&:hover {\n\t\t\t\tborder-color: ", ";\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), expandClassNames.icon, expandClassNames.prefix, sharedExpandStyles.containerStyles({
-    expanded: false,
-    focused: false
-  })(), expandClassNames.iconContainer, EXPAND_ICON_COLOR(), akEditorSelectedNodeClassName, fg('platform_editor_nested_dnd_styles_changes') ? getSelectionStyles([SelectionStyle.Blanket]) + "border: ".concat(akEditorSelectedBorder, ";") : getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.Border]), DANGER_STATE_BACKGROUND_COLOR, DANGER_STATE_BORDER_COLOR, expandClassNames.type('expand'), BreakoutCssClassName.BREAKOUT_MARK_DOM, expandClassNames.type('expand'), akLayoutGutterOffset, akLayoutGutterOffset, fg('platform_editor_nested_dnd_styles_changes') && ".ak-editor-content-area.appearance-full-page .ProseMirror\n\t\t> .".concat(expandClassNames.type('expand'), ",\n\t\t.").concat(BreakoutCssClassName.BREAKOUT_MARK_DOM, "\n\t\t> .").concat(expandClassNames.type('expand'), " {\n\t\tmargin-left: -").concat(akLayoutGutterOffset + 8, "px;\n\t\tmargin-right: -").concat(akLayoutGutterOffset + 8, "px;\n\t}"), expandClassNames.content, sharedExpandStyles.contentStyles({
-    expanded: false,
-    focused: false
-  })(), expandClassNames.titleInput, sharedExpandStyles.titleInputStyles(), expandClassNames.titleContainer, sharedExpandStyles.titleContainerStyles(), expandClassNames.expanded, EXPAND_SELECTED_BACKGROUND, "var(--ds-border, #091E4224)", expandClassNames.content, "var(--ds-space-100, 8px)", firstNodeWithNotMarginTop(), expandClassNames.inputContainer, expandClassNames.prefix, expandClassNames.expanded, expandClassNames.prefix, expandClassNames.expanded, expandClassNames.iconContainer, EXPAND_ICON_COLOR(), akEditorSelectedNodeClassName, "var(--ds-border, #091E4224)", EXPAND_SELECTED_BACKGROUND);
-};

package/dist/esm/ui/ContentStyles/extension.js

@@ -1,15 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2;
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
-import { akEditorDeleteBackground, akEditorDeleteBorder, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
-var extensionLabelStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t&.danger > span > div > .extension-label {\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t\topacity: 1;\n\t\tbox-shadow: none;\n\t}\n\n\t&:not(.danger).", " > span > div > .extension-label {\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t\topacity: 1;\n\t\tbox-shadow: none;\n\t}\n\n\t/* Targets the icon for bodied macro styling in button label */\n\t&.danger > span > div > .extension-label > span {\n\t\tdisplay: inline;\n\t}\n\n\t&:not(.danger).", " > span > div .extension-label > span {\n\t\tdisplay: inline;\n\t}\n\n\t/* Start of bodied extension edit toggle styles */\n\t&.danger.", " > span > .extension-edit-toggle-container {\n\t\topacity: 1;\n\t}\n\n\t&:not(.danger).", " > span > .extension-edit-toggle-container {\n\t\topacity: 1;\n\t}\n\n\t/* In view mode of the bodied macro, we never want to show the extension label */\n\t&.danger.", " > span > div > .extension-label.always-hide-label {\n\t\topacity: 0;\n\t}\n\n\t&:not(.danger).", "\n\t\t> span\n\t\t> div\n\t\t> .extension-label.always-hide-label {\n\t\topacity: 0;\n\t}\n\n\t/* .with-bodied-macro-live-page-styles class will only be added to bodied macros with the renderer mode gate enabled */\n\t&:not(.danger).", "\n\t\t> span\n\t\t> div\n\t\t> .extension-label.with-bodied-macro-live-page-styles {\n\t\tbox-shadow: 0 0 0 ", "px ", ";\n\t}\n\n\t&.danger.", "\n\t\t> span\n\t\t> div\n\t\t> .extension-label.with-bodied-macro-live-page-styles {\n\t\tbox-shadow: 0 0 0 ", "px ", ";\n\t}\n\n\t&.danger.", "\n\t\t> span\n\t\t> .extension-edit-toggle-container\n\t\t> .extension-edit-toggle {\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t\tbox-shadow: none;\n\t}\n"])), "var(--ds-background-accent-red-subtler, #FFD5D2)", "var(--ds-text-danger, #AE2E24)", akEditorSelectedNodeClassName, "var(--ds-background-selected, #E9F2FF)", "var(--ds-text-selected, #0C66E4)", akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, akEditorSelectedBorderSize, "var(--ds-border-selected, #0C66E4)", akEditorSelectedNodeClassName, akEditorSelectedBorderSize, "var(--ds-border-danger, #E2483D)", akEditorSelectedNodeClassName, "var(--ds-background-accent-red-subtler, #FFD5D2)", "var(--ds-text-danger, #AE2E24)");
-var dangerOverlayStyles = css({
-  opacity: 0.3,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  backgroundColor: "var(--ds-background-danger-hovered, ".concat(akEditorDeleteBackground, ")")
-});
-
-// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var extensionStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t.multiBodiedExtensionView-content-wrap {\n\t\t&.danger > span > .multiBodiedExtension--container {\n\t\t\tbox-shadow: 0 0 0 ", "px\n\t\t\t\t", ";\n\t\t\tbackground-color: ", ";\n\t\t}\n\n\t\t", "\n\n\t\t&.danger > span > .with-danger-overlay {\n\t\t\tbackground-color: transparent;\n\t\t\t.multiBodiedExtension--overlay {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&:not(.danger).", " {\n\t\t\t& > span > .multiBodiedExtension--container {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\t\t.multiBodiedExtension--container {\n\t\t\twidth: 100%;\n\t\t\tmax-width: 100%; /* ensure width can't go over 100% */\n\t\t}\n\t}\n\n\t.inlineExtensionView-content-wrap {\n\t\t&.danger > span > .extension-container {\n\t\t\tbox-shadow: 0 0 0 ", "px\n\t\t\t\t", ";\n\t\t\tbackground-color: ", ";\n\t\t}\n\n\t\t&.danger > span > .with-danger-overlay {\n\t\t\t/* If the macro turned used to turn red before, not setting the background to be transparent will cause the\n\t\t\tdanger state to have two layers of red which we don't want. */\n\t\t\tbackground-color: transparent;\n\t\t\t.extension-overlay {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&:not(.danger).", " {\n\t\t\t& > span > .extension-container {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t", "\n\t}\n\n\t/* This is referenced in the toDOM of a bodied extension and is used to put\n\tlabel content into the bodied extension.\n\tWe do this so that we don't serialise the label (which causes the label to be\n\tbe copied to the clipboard causing copy-paste issues). */\n\t.bodied-extension-to-dom-label::after {\n\t\tcontent: attr(data-bodied-extension-label);\n\t}\n\n\t.extensionView-content-wrap,\n\t.multiBodiedExtensionView-content-wrap,\n\t.bodiedExtensionView-content-wrap {\n\t\tmargin: ", " 0;\n\n\t\t&:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\n\t\t&:last-of-type {\n\t\t\tmargin-bottom: 0;\n\t\t}\n\n\t\t&:not(.danger).", " {\n\t\t\t& > span > .extension-container {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.danger > span > .extension-container {\n\t\t\tbox-shadow: 0 0 0 ", "px\n\t\t\t\t", ";\n\t\t\tbackground-color: ", ";\n\t\t}\n\n\t\t", "\n\n\t\t&.danger > span > .with-danger-overlay {\n\t\t\tbackground-color: transparent;\n\t\t\t.extension-overlay {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.inline {\n\t\t\tword-wrap: break-all;\n\t\t}\n\t}\n\n\t.extensionView-content-wrap .extension-container {\n\t\toverflow: hidden;\n\n\t\t/* Don't hide overflow for editors inside extensions */\n\t\t&:has(.extension-editable-area) {\n\t\t\toverflow: visible;\n\t\t}\n\t}\n\n\t.bodiedExtensionView-content-wrap .extensionView-content-wrap .extension-container {\n\t\twidth: 100%;\n\t\tmax-width: 100%; /* ensure width can't go over 100% */\n\t}\n\n\t[data-mark-type='fragment'] {\n\t\t& > .extensionView-content-wrap,\n\t\t& > .bodiedExtensionView-content-wrap {\n\t\t\tmargin: ", " 0;\n\t\t}\n\n\t\t& > [data-mark-type='dataConsumer'] {\n\t\t\t& > .extensionView-content-wrap,\n\t\t\t& > .bodiedExtensionView-content-wrap {\n\t\t\t\tmargin: ", " 0;\n\t\t\t}\n\t\t}\n\n\t\t&:first-child {\n\t\t\t& > .extensionView-content-wrap,\n\t\t\t& > .bodiedExtensionView-content-wrap {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\n\t\t\t& > [data-mark-type='dataConsumer'] {\n\t\t\t\t& > .extensionView-content-wrap,\n\t\t\t\t& > .bodiedExtensionView-content-wrap {\n\t\t\t\t\tmargin-top: 0;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&:nth-last-of-type(-n + 2):not(:first-of-type) {\n\t\t\t& > .extensionView-content-wrap,\n\t\t\t& > .bodiedExtensionView-content-wrap {\n\t\t\t\tmargin-bottom: 0;\n\t\t\t}\n\n\t\t\t& > [data-mark-type='dataConsumer'] {\n\t\t\t\t& > .extensionView-content-wrap,\n\t\t\t\t& > .bodiedExtensionView-content-wrap {\n\t\t\t\t\tmargin-bottom: 0;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n"])), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), extensionLabelStyles, dangerOverlayStyles, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Blanket]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), dangerOverlayStyles, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), extensionLabelStyles, blockNodesVerticalMargin, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), extensionLabelStyles, dangerOverlayStyles, blockNodesVerticalMargin, blockNodesVerticalMargin);

package/dist/esm/ui/ContentStyles/index.js

@@ -1,214 +0,0 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1;
-/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
-/* eslint-disable react-hooks/rules-of-hooks */
-/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- Requires manual remediation over time due to use of unsafe nested mixins */
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import React, { useMemo } from 'react';
-
-// 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, jsx, useTheme } from '@emotion/react';
-import { browser } from '@atlaskit/editor-common/browser';
-import { telepointerStyle } from '@atlaskit/editor-common/collab';
-import { EmojiSharedCssClassName, defaultEmojiHeight } from '@atlaskit/editor-common/emoji';
-import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
-import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
-import { gapCursorStyles } from '@atlaskit/editor-common/selection';
-import { CodeBlockSharedCssClassName, MediaSharedClassNames, SmartCardSharedCssClassName, annotationSharedStyles, backgroundColorStyles, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, embedCardStyles, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, linkSharedStyle, listsSharedStyles, paragraphSharedStyles, resizerStyles, pragmaticResizerStyles, pragmaticStylesLayoutFirstNodeResizeHandleFix, pragmaticResizerStylesForTooltip, pragmaticResizerStylesWithReducedEditorGutter, ruleSharedStyles, shadowSharedStyle, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
-import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
-import { findReplaceStyles, findReplaceStylesNew } from '@atlaskit/editor-plugins/find-replace/styles';
-import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
-import { placeholderTextStyles } from '@atlaskit/editor-plugins/placeholder-text/styles';
-import { SelectionStyle, akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorDefaultLayoutWidth, akEditorDeleteBackgroundWithOpacity, akEditorDeleteBorder, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorSelectedBorderColor, akEditorSelectedBorderSize, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles } from '@atlaskit/editor-shared-styles';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
-import { useThemeObserver } from '@atlaskit/tokens';
-import { InlineNodeViewSharedStyles } from '../../nodeviews/getInlineNodeViewProducer.styles';
-import { textHighlightPaddingStyles } from '../EditorContentContainer/styles/backgroundColorStyles';
-import { aiPanelStyles } from './ai-panels';
-import { codeBidiWarningStyles } from './code-bidi-warning';
-import { codeBlockStyles } from './code-block';
-import { dateStyles, dateNodeStyles } from './date';
-import { expandStyles } from './expand';
-import { extensionStyles } from './extension';
-import { layoutStyles } from './layout';
-import { mediaStyles } from './media';
-import { panelStyles } from './panel';
-import { statusStyles, statusNodeStyles } from './status';
-import { taskDecisionStyles, taskDecisionIconWithoutVisualRefresh as decisionIconWithoutVisualRefresh, taskDecisionIconWithVisualRefresh as decisionIconWithVisualRefresh, taskItemStyles, taskItemStylesWithBlockTaskItem } from './tasks-and-decisions';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var linkStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", "\n\t}\n"])), linkSharedStyle);
-var ruleStyles = function ruleStyles() {
-  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", ";\n\n\t\thr {\n\t\t\tcursor: pointer;\n\t\t\tpadding: ", " 0;\n\t\t\tmargin: ", " 0;\n\t\t\tbackground-clip: content-box;\n\n\t\t\t&.", " {\n\t\t\t\toutline: none;\n\t\t\t\tbackground-color: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), ruleSharedStyles(), "var(--ds-space-050, 4px)", "var(--ds-space-300, 24px)", akEditorSelectedNodeClassName, "var(--ds-border-selected, ".concat(akEditorSelectedBorderColor, ")"));
-};
-var mentionNodeStyles = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '.editor-mention-primitive': {
-    display: 'inline',
-    borderRadius: "var(--ds-radius-full, 9999px)",
-    cursor: 'pointer',
-    padding: '0 0.3em 2px 0.23em',
-    // To match `packages/elements/mention/src/components/Mention/PrimitiveMention.tsx` implementation
-    // we match the line height exactly
-    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-    lineHeight: '1.714',
-    fontWeight: "var(--ds-font-weight-regular, 400)",
-    wordBreak: 'break-word',
-    background: "var(--ds-background-neutral, #091E420F)",
-    border: "var(--ds-border-width, 1px)".concat(" solid transparent"),
-    color: "var(--ds-text-subtle, #44546F)",
-    '&:hover': {
-      background: "var(--ds-background-neutral-hovered, #091E4224)"
-    },
-    '&:active': {
-      background: "var(--ds-background-neutral-pressed, #091E424F)"
-    }
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '.editor-mention-primitive.mention-restricted': {
-    background: 'transparent',
-    border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border-bold, #758195)"),
-    color: "var(--ds-text, #172B4D)",
-    '&:hover': {
-      background: 'transparent'
-    },
-    '&:active': {
-      background: 'transparent'
-    }
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '.editor-mention-primitive.mention-self': {
-    background: "var(--ds-background-brand-bold, #0C66E4)",
-    border: "var(--ds-border-width, 1px)".concat(" solid transparent"),
-    color: "var(--ds-text-inverse, #FFFFFF)",
-    '&:hover': {
-      background: "var(--ds-background-brand-bold-hovered, #0055CC)"
-    },
-    '&:active': {
-      background: "var(--ds-background-brand-bold-pressed, #09326C)"
-    }
-  }
-});
-
-// The feature-gate for this is dependent on the use of refreshed typography - bear this in mind when cleaning up
-// This is currently enforced through statsig prerequisite gates, as per #help-afm recommendation.
-// So it will need to be considered if the typography gates are still in use when this is cleaned up.
-var mentionNodeStylesMixin_fg_platform_editor_centre_mention_padding = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '.editor-mention-primitive': {
-    padding: '1px 0.3em 1px 0.23em'
-  }
-});
-var mentionSelectionStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\t.danger {\n\t\t.editor-mention-primitive {\n\t\t\tbox-shadow: 0 0 0 ", "px ", ";\n\t\t\tbackground-color: ", ";\n\t\t}\n\t}\n\n\t.", " > .editor-mention-primitive,\n\t.", " > .editor-mention-primitive.mention-self,\n\t.", " > .editor-mention-primitive.mention-restricted {\n\t\t", "\n\t\t/* need to specify dark text colour because personal mentions\n\t       (in dark blue) have white text by default */\n\t\tcolor: ", "\n\t}\n"])), akEditorSelectedBorderSize, akEditorDeleteBorder, "var(--ds-background-danger, ".concat(akEditorDeleteBackgroundWithOpacity, ")"), akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Background]), "var(--ds-text-subtle, #44546F)");
-var mentionsSelectionStylesWithSearchMatch = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n\t.danger {\n\t\t.editor-mention-primitive {\n\t\t\tbox-shadow: 0 0 0 ", "px ", ";\n\t\t\tbackground-color: ", ";\n\t\t}\n\t}\n\n\t.", ":not(.search-match-block) > .editor-mention-primitive,\n\t.", ":not(.search-match-block)\n\t\t> .editor-mention-primitive.mention-self,\n\t.", ":not(.search-match-block)\n\t\t> .editor-mention-primitive.mention-restricted {\n\t\t", "\n\t\t/* need to specify dark text colour because personal mentions\n\t       (in dark blue) have white text by default */\n\t\tcolor: ", "\n\t}\n\n\t.", ".search-match-block > .editor-mention-primitive,\n\t.", ".search-match-block > .editor-mention-primitive.mention-self,\n\t.", ".search-match-block\n\t\t> .editor-mention-primitive.mention-restricted {\n\t\t", "\n\t\t/* need to specify dark text colour because personal mentions\n\t       (in dark blue) have white text by default */\n\t\tcolor: ", "\n\t}\n"])), akEditorSelectedBorderSize, akEditorDeleteBorder, "var(--ds-background-danger, ".concat(akEditorDeleteBackgroundWithOpacity, ")"), akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Background]), "var(--ds-text-subtle, #44546F)", akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.Background]), "var(--ds-text-subtle, #44546F)");
-var mentionsStyles = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n\t.", " {\n\t\t&.", " [data-mention-id] > span {\n\t\t\t", "\n\n\t\t\t/* need to specify dark text colour because personal mentions\n\t\t\t(in dark blue) have white text by default */\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n\n\t.danger {\n\t\t.", ".", "\n\t\t\t> span\n\t\t\t> span\n\t\t\t> span {\n\t\t\tbox-shadow: 0 0 0 ", "px ", ";\n\t\t\tbackground-color: ", ";\n\t\t}\n\t\t.", " > span > span > span {\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), MentionSharedCssClassName.MENTION_CONTAINER, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Background]), "var(--ds-text-subtle, #44546F)", MentionSharedCssClassName.MENTION_CONTAINER, akEditorSelectedNodeClassName, akEditorSelectedBorderSize, akEditorDeleteBorder, "var(--ds-background-danger, ".concat(akEditorDeleteBackgroundWithOpacity, ")"), MentionSharedCssClassName.MENTION_CONTAINER, "var(--ds-background-neutral, #091E420F)", "var(--ds-text-subtle, #44546F)");
-var listsStyles = css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\tli {\n\t\t\tposition: relative;\n\n\t\t\t> p:not(:first-child) {\n\t\t\t\tmargin: ", " 0 0 0;\n\t\t\t}\n\n\t\t\t/* In SSR the above rule will apply to all p tags because first-child would be a style tag.\n\t\t\tThe following rule resets the first p tag back to its original margin\n\t\t\tdefined in packages/editor/editor-common/src/styles/shared/paragraph.ts */\n\t\t\t> style:first-child + p {\n\t\t\t\tmargin-top: ", ";\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}\n"])), "var(--ds-space-050, 4px)", blockNodesVerticalMargin, SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, browser.safari ? codeBlockInListSafariFix : '');
-var emojiStyles = css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n\t.ProseMirror .", " {\n\t\tdisplay: inline-block;\n\t}\n\n\t.ProseMirror\n\t\t:is(.", ", .", ") {\n\t\tbackground: no-repeat transparent;\n\t\tdisplay: inline-block;\n\t\theight: ", "px;\n\t\tmax-height: ", "px;\n\t\tcursor: pointer;\n\t\tvertical-align: middle;\n\t\tuser-select: all;\n\t}\n\n\t.ProseMirror .", " {\n\t\t.", ", .", " {\n\t\t\tborder-radius: ", ";\n\t\t\t", "\n\t\t}\n\t}\n"])), EmojiSharedCssClassName.EMOJI_CONTAINER, EmojiSharedCssClassName.EMOJI_SPRITE, EmojiSharedCssClassName.EMOJI_IMAGE, defaultEmojiHeight, defaultEmojiHeight, akEditorSelectedNodeClassName, EmojiSharedCssClassName.EMOJI_SPRITE, EmojiSharedCssClassName.EMOJI_IMAGE, "var(--ds-radius-xsmall, 2px)", getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.BoxShadow]));
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var placeholderStyles = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '.ProseMirror .placeholder-decoration': {
-    color: "var(--ds-text-subtlest, #626F86)",
-    width: '100%',
-    pointerEvents: 'none',
-    userSelect: 'none',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    '.placeholder-android': {
-      pointerEvents: 'none',
-      outline: 'none',
-      userSelect: 'none',
-      position: 'absolute'
-    }
-  }
-});
-var placeholderOverflowStyles = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  '.ProseMirror p:has(.placeholder-decoration-hide-overflow)': {
-    overflow: 'hidden',
-    whiteSpace: 'nowrap',
-    textOverflow: 'ellipsis'
-  }
-});
-var placeholderWrapStyles = css({
-  // As part of controls work, we add placeholder `Search` to quick insert command
-  // This style is to prevent `/Search` being wrapped if it's triggered at the end of the line
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
-  '.ProseMirror mark[data-type-ahead-query="true"]:has(.placeholder-decoration-wrap)': {
-    whiteSpace: 'nowrap'
-  }
-});
-var firstBlockNodeStylesNew = css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> .", ",\n\t\t\t> div[data-task-list-local-id],\n\t\t> div[data-layout-section],\n\t\t> .", " {\n\t\t\t&:first-child {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\n\t\t> hr:first-child,\n\t\t> .ProseMirror-widget:first-child + hr {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n"])), PanelSharedCssClassName.prefix, CodeBlockSharedCssClassName.CODEBLOCK_CONTAINER, SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, expandClassNames.prefix);
-
-// Make sure the first floating toolbar button has focus ring when focused via .focus()
-var firstFloatingToolbarButtonStyles = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
-  'button.first-floating-toolbar-button:focus': {
-    outline: "var(--ds-border-width-focused, 2px)".concat(" solid ", "var(--ds-border-focused, #2684FF)")
-  }
-});
-
-// The breakpoint for small devices is 1266px, copied from getBreakpoint in platform/packages/editor/editor-common/src/ui/WidthProvider/index.tsx
-var akEditorBreakpointForSmallDevice = "1266px";
-
-// eslint-disable-next-line @repo/internal/deprecations/deprecation-ticket-required
-/**
- * @deprecated
- * DO NOT USE THIS WILL BE REMOVED SOON.
- * use this instead: packages/editor/editor-core/src/ui/EditorContentContainer.tsx
- */
-var legacyContentStyles = function legacyContentStyles(props) {
-  return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n\t--ak-editor--default-gutter-padding: ", "px;\n\t/* 52 is from akEditorGutterPaddingDynamic via editor-shared-styles */\n\t--ak-editor--large-gutter-padding: ", "px;\n\t--ak-editor--resizer-handle-spacing: 12px;\n\t--ak-editor--default-layout-width: ", "px;\n\t--ak-editor--full-width-layout-width: ", "px;\n\t/* calculate editor line length, 100cqw is the editor container width */\n\t--ak-editor--line-length: min(\n\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\tvar(--ak-editor--default-layout-width)\n\t);\n\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t--ak-editor--breakout-full-page-guttering-padding: calc(\n\t\tvar(--ak-editor--large-gutter-padding) * 2 + var(--ak-editor--default-gutter-padding)\n\t);\n\n\t--ak-editor--breakout-fallback-width: calc(\n\t\t100cqw - var(--ak-editor--breakout-full-page-guttering-padding)\n\t);\n\t--ak-editor--breakout-min-width: 100%;\n\n\t.fabric-editor--full-width-mode {\n\t\t--ak-editor--line-length: min(\n\t\t\tcalc(100cqw - var(--ak-editor--large-gutter-padding) * 2),\n\t\t\tvar(--ak-editor--full-width-layout-width)\n\t\t);\n\n\t\t/* in full width appearances it's not possible to rely on cqw because it doesn't account for the page scrollbar, which depends on users system settings */\n\t\t--ak-editor--breakout-fallback-width: 100%;\n\t\t--ak-editor--breakout-min-width: 0px;\n\t}\n\n\t.ProseMirror {\n\t\t--ak-editor-max-container-width: calc(100cqw - var(--ak-editor--large-gutter-padding));\n\t}\n\n\t/* We can't allow nodes that are inside other nodes to bleed from the parent container */\n\t.ProseMirror > div[data-prosemirror-node-block] [data-prosemirror-node-block] {\n\t\t--ak-editor-max-container-width: 100%;\n\t}\n\n\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t@container editor-area (width >= ", ") {\n\t\t.ProseMirror {\n\t\t\t--ak-editor--breakout-wide-layout-width: ", "px;\n\t\t}\n\t}\n\n\t", "\n\n\t.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: ", "px;\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t\t", ";\n\t}\n\n\t.ProseMirror-hideselection *::selection {\n\t\tbackground: transparent;\n\t}\n\n\t.ProseMirror-hideselection *::-moz-selection {\n\t\tbackground: transparent;\n\t}\n\n\t/**\n\t * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24\n\t */\n\t.ProseMirror-hideselection {\n\t\tcaret-color: transparent;\n\t}\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: ", " solid ", ";\n\t}\n\n\t.ProseMirror.ProseMirror-focused:has(.ProseMirror-mark-boundary-cursor) {\n\t\tcaret-color: transparent;\n\t}\n\t.ProseMirror:not(.ProseMirror-focused) .ProseMirror-mark-boundary-cursor {\n\t\tdisplay: none;\n\t}\n\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", ";\n\t", "\n\t", "\n\t", "\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  /* Switch between the two icons based on the visual refresh feature gate */\n\t", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\t", "\n\n  .panelView-content-wrap {\n\t\tbox-sizing: border-box;\n\t}\n\n\t.mediaGroupView-content-wrap ul {\n\t\tpadding: 0;\n\t}\n\n\t/** Needed to override any cleared floats, e.g. image wrapping */\n\n\tdiv.fabric-editor-block-mark[class^='fabric-editor-align'] {\n\t\tclear: none !important;\n\t}\n\n\t.fabric-editor-align-end {\n\t\ttext-align: right;\n\t}\n\n\t.fabric-editor-align-start {\n\t\ttext-align: left;\n\t}\n\n\t.fabric-editor-align-center {\n\t\ttext-align: center;\n\t}\n\n\t/* For FullPage only when inside a table\n\tRelated code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\tIn the \"editorContentAreaContainerStyle\" function */\n\t.fabric-editor--full-width-mode {\n\t\t.pm-table-container {\n\t\t\t.code-block,\n\t\t\t.extension-container,\n\t\t\t.multiBodiedExtension--container {\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t}\n\t}\n\n\t.pm-table-header-content-wrap :not(.fabric-editor-alignment),\n\t.pm-table-header-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark,\n\t.pm-table-cell-content-wrap :not(p, .fabric-editor-block-mark) + div.fabric-editor-block-mark {\n\t\tp:first-of-type {\n\t\t\tmargin-top: 0;\n\t\t}\n\t}\n\t.pm-table-cell-content-wrap .mediaGroupView-content-wrap {\n\t\tclear: both;\n\t}\n\n\t.hyperlink-floating-toolbar,\n\t.", " {\n\t\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n     is bigger than the others, new ADS icon does not have this issue\n  */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, editorExperiment('platform_editor_preview_panel_responsiveness', true) ? css(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\n\t\t\t\t/* container editor-area is defined in platform/packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts */\n\t\t\t\t@container editor-area (max-width: ", "px) {\n\t\t\t\t\t--ak-editor--large-gutter-padding: ", "px;\n\t\t\t\t}\n\t\t\t"])), akEditorFullPageNarrowBreakout, akEditorGutterPaddingReduced) : null, editorFontSize({
-    theme: props.theme
-  }), whitespaceSharedStyles, paragraphSharedStyles(props.typographyTheme), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, "var(--ds-border-width-focused, 2px)", "var(--ds-border-focused, #8cf)", firstFloatingToolbarButtonStyles, placeholderTextStyles, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(props.typographyTheme), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles(), expValEquals('platform_editor_text_highlight_padding', 'isEnabled', true) && textHighlightPaddingStyles, listsStyles, ruleStyles(), mediaStyles(), layoutStyles(props.viewMode), telepointerStyle, gapCursorStyles, panelStyles(), mentionsStyles, mentionNodeStyles, fg('platform_editor_centre_mention_padding') && mentionNodeStylesMixin_fg_platform_editor_centre_mention_padding, expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? mentionsSelectionStylesWithSearchMatch : mentionSelectionStyles, emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(), expValEqualsNoExposure('platform_editor_find_and_replace_improvements', 'isEnabled', true) ? findReplaceStylesNew : findReplaceStyles, textHighlightStyle, taskDecisionStyles, expValEqualsNoExposure('platform_editor_blocktaskitem_node_tenantid', 'isEnabled', true) ? taskItemStylesWithBlockTaskItem : taskItemStyles, fg('platform-visual-refresh-icons') && decisionIconWithVisualRefresh, !fg('platform-visual-refresh-icons') && decisionIconWithoutVisualRefresh, statusStyles(), statusNodeStyles(), annotationSharedStyles(), smartCardStyles(), getSmartCardSharedStyles(), dateStyles, dateNodeStyles, embedCardStyles(), unsupportedStyles, resizerStyles, pragmaticResizerStyles(), pragmaticStylesLayoutFirstNodeResizeHandleFix(), pragmaticResizerStylesForTooltip(), pragmaticResizerStylesWithReducedEditorGutter(), aiPanelStyles(props.colorMode), firstBlockNodeStylesNew, fg('platform_editor_vanilla_codebidi_warning') && codeBidiWarningStyles, MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT, !fg('platform-visual-refresh-icons') ? css(_templateObject1 || (_templateObject1 = _taggedTemplateLiteral(["\n\t\t\t\t.hyperlink-open-link {\n\t\t\t\t\tmin-width: 24px;\n\t\t\t\t\tsvg {\n\t\t\t\t\t\tmax-width: 18px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t"]))) : null);
-};
-export var createEditorContentStyle = function createEditorContentStyle(styles) {
-  return /*#__PURE__*/React.forwardRef(function (props, ref) {
-    var className = props.className,
-      children = props.children,
-      featureFlags = props.featureFlags;
-    var theme = useTheme();
-    var _useThemeObserver = useThemeObserver(),
-      colorMode = _useThemeObserver.colorMode,
-      typography = _useThemeObserver.typography;
-    var memoizedStyle = useMemo(function () {
-      return legacyContentStyles({
-        theme: theme,
-        colorMode: colorMode,
-        featureFlags: featureFlags,
-        viewMode: props.viewMode,
-        typographyTheme: typography
-      });
-    }, [theme, colorMode, featureFlags, props.viewMode, typography]);
-    if (props.isScrollable) {
-      return jsx("div", {
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-        className: className,
-        ref: ref,
-        css: [memoizedStyle, styles],
-        "data-editor-scroll-container": "true",
-        "data-testid": "editor-content-container"
-        // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex, @atlassian/a11y/no-noninteractive-tabindex -- Adding tabIndex here because this is a scrollable container and it needs to be focusable so keyboard users can scroll it.
-        ,
-        tabIndex: 0,
-        role: "region"
-      }, children);
-    }
-    return jsx("div", {
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-      className: className,
-      ref: ref,
-      css: [memoizedStyle, styles],
-      "data-testid": "editor-content-container"
-    }, children);
-  });
-};
-export default createEditorContentStyle();