@atlaskit/editor-core 207.8.0 → 207.10.1

package/dist/cjs/ui/EditorContentContainer/styles/aiPanel.js

@@ -0,0 +1,203 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.aiPanelDarkStyles = exports.aiPanelDarkFirefoxStyles = exports.aiPanelBaseStyles = exports.aiPanelBaseFirefoxStyles = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("@emotion/react");
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+
+/**
+ * aiPanelStyles
+ * was imported from packages/editor/editor-core/src/ui/ContentStyles/ai-panels.ts
+ */
+
+var rotationAnimation = (0, _react.keyframes)({
+  '0%': {
+    '--panel-gradient-angle': '0deg'
+  },
+  '100%': {
+    '--panel-gradient-angle': '360deg'
+  }
+});
+var rotationAnimationFirefox = (0, _react.keyframes)({
+  '0%': {
+    '--panel-gradient-angle': '0deg',
+    backgroundPosition: '100%'
+  },
+  '100%': {
+    '--panel-gradient-angle': '360deg',
+    backgroundPosition: '-100%'
+  }
+});
+var aiPrismColor = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, '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 aiPrismColorStep1Light = aiPrismColor['prism.border.step.1']['light'];
+var aiPrismColorStep2Light = aiPrismColor['prism.border.step.2']['light'];
+var aiPrismColorStep3Light = aiPrismColor['prism.border.step.3']['light'];
+var aiPrismColorStep4Light = aiPrismColor['prism.border.step.4']['light'];
+var aiPrismColorStep1Dark = aiPrismColor['prism.border.step.1']['dark'];
+var aiPrismColorStep2Dark = aiPrismColor['prism.border.step.2']['dark'];
+var aiPrismColorStep3Dark = aiPrismColor['prism.border.step.3']['dark'];
+var aiPrismColorStep4Dark = aiPrismColor['prism.border.step.4']['dark'];
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+var prismBorderBaseBackgroundFirefox = "linear-gradient(90deg, ".concat(aiPrismColorStep1Light, " 0%, ").concat(aiPrismColorStep2Light, " 12%, ").concat(aiPrismColorStep3Light, " 24%, ").concat(aiPrismColorStep4Light, " 48%, ").concat(aiPrismColorStep3Light, " 64%, ").concat(aiPrismColorStep2Light, " 80%, ").concat(aiPrismColorStep1Light, " 100%)");
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+var prismBorderBaseBackground = "conic-gradient(from var(--panel-gradient-angle, 270deg), ".concat(aiPrismColorStep1Light, " 0%, ").concat(aiPrismColorStep2Light, " 20%, ").concat(aiPrismColorStep3Light, " 50%, ").concat(aiPrismColorStep4Light, " 56%, ").concat(aiPrismColorStep1Light, " 100%)");
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+var prismBorderDarkBackgroundFirefox = "linear-gradient(90deg, ".concat(aiPrismColorStep1Dark, " 0%, ").concat(aiPrismColorStep2Dark, " 12%, ").concat(aiPrismColorStep3Dark, " 24%, ").concat(aiPrismColorStep4Dark, " 48%, ").concat(aiPrismColorStep3Dark, " 64%, ").concat(aiPrismColorStep2Dark, " 80%, ").concat(aiPrismColorStep1Dark, " 100%)");
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+var prismBorderDarkBackground = "conic-gradient(from var(--panel-gradient-angle, 270deg), ".concat(aiPrismColorStep1Dark, " 0%, ").concat(aiPrismColorStep2Dark, " 20%, ").concat(aiPrismColorStep3Dark, " 50%, ").concat(aiPrismColorStep4Dark, " 56%, ").concat(aiPrismColorStep1Dark, " 100%)");
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var aiPanelBaseStyles = exports.aiPanelBaseStyles = (0, _react.css)({
+  '@property --panel-gradient-angle': {
+    syntax: '<angle>',
+    initialValue: '270deg',
+    inherits: false
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  'div[extensionType="com.atlassian.ai-blocks"]': {
+    /* This hides the label for the extension */
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.extension-label': {
+      display: 'none'
+    },
+    /* This styles the ai panel correctly when its just sitting on the page and there
+    is no user interaction */
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.extension-container': {
+      position: 'relative',
+      boxShadow: 'none',
+      overflow: 'unset',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+      backgroundColor: "var(--ds-surface, #FFFFFF)".concat(" !important"),
+      // prismBorderBaseStyles
+      '&::before, &::after': {
+        content: "''",
+        position: 'absolute',
+        zIndex: -1,
+        width: "calc(100% + 2px)",
+        height: "calc(100% + 2px)",
+        top: "-1px",
+        left: "-1px",
+        borderRadius: "calc(".concat("var(--ds-border-radius-100, 3px)", " + 1px)"),
+        transform: 'translate3d(0, 0, 0)',
+        background: prismBorderBaseBackground
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '&.with-hover-border': {
+        '&::before, &::after': {
+          //prismBorderHoverStyles
+          background: "var(--ds-border-input, #8590A2)"
+        }
+      },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+      '& .with-margin-styles': {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+        backgroundColor: "var(--ds-surface, #FFFFFF)".concat(" !important"),
+        borderRadius: "var(--ds-border-radius-100, 3px)"
+      }
+    }
+  },
+  /* This styles the ai panel correctly when its streaming */
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  'div[extensionType="com.atlassian.ai-blocks"]:has(.streaming)': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.extension-container': {
+      '&::before, &::after': {
+        // prismBorderAnimationStyles
+        animationName: rotationAnimation,
+        animationDuration: '2s',
+        animationTimingFunction: 'linear',
+        animationIterationCount: 'infinite',
+        '@media (prefers-reduced-motion)': {
+          animation: 'none'
+        }
+      }
+    }
+  },
+  /* This styles the ai panel correctly when a user is hovering over the delete button in the floating panel */
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  'div[extensionType="com.atlassian.ai-blocks"].danger': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.extension-container': {
+      boxShadow: "0 0 0 1px ".concat("var(--ds-border-danger, #E2483D)")
+    }
+  },
+  /* This removes the margin from the action list when inside an ai panel */
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  'div[extensiontype="com.atlassian.ai-blocks"][extensionkey="ai-action-items-block:aiActionItemsBodiedExtension"]': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    'div[data-node-type="actionList"]': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
+      margin: '0 !important'
+    }
+  }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var aiPanelBaseFirefoxStyles = exports.aiPanelBaseFirefoxStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  'div[extensionType="com.atlassian.ai-blocks"]': {
+    '&::before, &::after': {
+      background: prismBorderBaseBackgroundFirefox,
+      backgroundSize: '200%'
+    }
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  'div[extensionType="com.atlassian.ai-blocks"]:has(.streaming)': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.extension-container': {
+      '&::before, &::after': {
+        animationName: rotationAnimationFirefox,
+        animationDirection: 'normal',
+        animationDuration: '1s'
+      }
+    }
+  }
+});
+
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var aiPanelDarkStyles = exports.aiPanelDarkStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  'div[extensionType="com.atlassian.ai-blocks"]': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.extension-container': {
+      '&::before, &::after': {
+        background: prismBorderDarkBackground
+      }
+    }
+  }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var aiPanelDarkFirefoxStyles = exports.aiPanelDarkFirefoxStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  'div[extensionType="com.atlassian.ai-blocks"]': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    '.extension-container': {
+      '&::before, &::after': {
+        background: prismBorderDarkBackgroundFirefox,
+        backgroundSize: '200%'
+      }
+    }
+  }
+});

package/dist/cjs/ui/EditorContentContainer/styles/blockMarksStyles.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.blockMarksStyles = void 0;
+var _react = require("@emotion/react");
+// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var blockMarksStyles = exports.blockMarksStyles = (0, _react.css)({
+  // We need to remove margin-top from first item
+  // inside doc, tableCell, tableHeader, blockquote, etc.
+  //
+  // - For nested block marks apart from those with indentation mark.
+  // - Do not remove the margin top for nodes inside indentation marks.
+  // - Do not remove the margin top for nodes inside alignment marks.
+  //- If first element inside a block node has alignment mark, then remove the margin-top.
+  //- If first document element has indentation mark remove margin-top.
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-selectors
+  '*:not(.fabric-editor-block-mark) >, *:not(.fabric-editor-block-mark) > div.fabric-editor-block-mark:first-of-type:not(.fabric-editor-indentation-mark):not(.fabric-editor-alignment), .fabric-editor-alignment:first-of-type:first-child, .ProseMirror .fabric-editor-indentation-mark:first-of-type:first-child': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+    'p, h1, h2, h3, h4, h5, h6, .heading-wrapper': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-selectors
+      '&:first-child:not(style), style:first-child + *': {
+        marginTop: 0
+      }
+    }
+  }
+});

package/dist/cjs/ui/EditorContentContainer/styles/dateStyles.js

@@ -0,0 +1,51 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.dateVanillaStyles = exports.dateStyles = exports.DateSharedCssClassName = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("@emotion/react");
+var _selectionStyles = require("./selectionStyles");
+// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+
+var DateSharedCssClassName = exports.DateSharedCssClassName = {
+  DATE_WRAPPER: "date-lozenger-container",
+  DATE_CONTAINER: 'dateView-content-wrap'
+};
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var dateVanillaStyles = exports.dateVanillaStyles = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='date'] .".concat(DateSharedCssClassName.DATE_WRAPPER, " span"), {
+  backgroundColor: "var(--ds-background-neutral, #091E420F)",
+  color: "var(--ds-text, #172B4D)",
+  borderRadius: "var(--ds-border-radius-100, 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'
+}), "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='date'] .".concat(DateSharedCssClassName.DATE_WRAPPER, " span:hover"), {
+  backgroundColor: "var(--ds-background-neutral-hovered, #091E4224)"
+}), "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='date'] .".concat(DateSharedCssClassName.DATE_WRAPPER, " span.date-node-color-red"), {
+  backgroundColor: "var(--ds-background-accent-red-subtlest, #FFECEB)",
+  color: "var(--ds-text-accent-red, #AE2E24)"
+}), "[data-prosemirror-node-view-type='vanilla'][data-prosemirror-node-name='date'] .".concat(DateSharedCssClassName.DATE_WRAPPER, " 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
+var dateStyles = exports.dateStyles = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(DateSharedCssClassName.DATE_WRAPPER, " span"), {
+  whiteSpace: 'unset'
+}), ".".concat(DateSharedCssClassName.DATE_CONTAINER), (0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(DateSharedCssClassName.DATE_WRAPPER), {
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
+  lineHeight: 'initial',
+  cursor: 'pointer'
+}), '&.ak-editor-selected-node', (0, _defineProperty2.default)({}, ".".concat(DateSharedCssClassName.DATE_WRAPPER, " > span"), [
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+_selectionStyles.boxShadowSelectionStyles,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+_selectionStyles.hideNativeBrowserTextSelectionStyles]))), '.danger', (0, _defineProperty2.default)({}, ".".concat(DateSharedCssClassName.DATE_CONTAINER, ".ak-editor-selected-node .").concat(DateSharedCssClassName.DATE_WRAPPER, " > span"), {
+  boxShadow: "0 0 0 1px ".concat("var(--ds-border-danger, #E2483D)")
+})));

package/dist/cjs/ui/EditorContentContainer/styles/gridStyles.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.gridStyles = void 0;
+var _react = require("@emotion/react");
+// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var gridStyles = exports.gridStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '.gridParent': {
+    width: "calc(100% + 24px)",
+    marginLeft: "var(--ds-space-negative-150, -12px)",
+    marginRight: "var(--ds-space-negative-150, -12px)",
+    transform: 'scale(1)',
+    zIndex: 2
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '.gridContainer': {
+    position: 'fixed',
+    height: '100vh',
+    width: '100%',
+    pointerEvents: 'none'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '.gridLine': {
+    borderLeft: "1px solid ".concat("var(--ds-border, #091E4224)"),
+    display: 'inline-block',
+    boxSizing: 'border-box',
+    height: '100%',
+    // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
+    marginLeft: '-1px',
+    transition: 'border-color 0.15s linear',
+    zIndex: 0
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '.highlight': {
+    borderLeft: "1px solid ".concat("var(--ds-border-focused, #388BFF)")
+  }
+});

package/dist/cjs/ui/EditorContentContainer/styles/indentationStyles.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.indentationStyles = void 0;
+var _react = require("@emotion/react");
+// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var indentationStyles = exports.indentationStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '.fabric-editor-indentation-mark': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    "&[data-level='1']": {
+      // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
+      marginLeft: 30
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    "&[data-level='2']": {
+      // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
+      marginLeft: 60
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    "&[data-level='3']": {
+      // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
+      marginLeft: 90
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    "&[data-level='4']": {
+      // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
+      marginLeft: 120
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    "&[data-level='5']": {
+      // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
+      marginLeft: 150
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+    "&[data-level='6']": {
+      // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
+      marginLeft: 180
+    }
+  }
+});

package/dist/cjs/ui/EditorContentContainer/styles/list.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.listsStylesSafariFix = exports.listsStyles = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("@emotion/react");
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+
+// copied from packages/editor/editor-shared-styles/src/consts/consts.ts
+var akEditorLineHeight = 1.714;
+// copied from packages/editor/editor-common/src/styles/shared/smart-card.ts
+var BLOCK_CARD_CONTAINER = 'blockCardView-content-wrap';
+
+// copied from packages/editor/editor-shared-styles/src/consts/consts.ts
+var blockNodesVerticalMargin = '0.75rem';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var listsStyles = exports.listsStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '.ProseMirror li': {
+    position: 'relative',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+    '& > p:not(:first-child)': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+      margin: "var(--ds-space-050, 4px)".concat(" 0 0 0")
+    },
+    /* In SSR the above rule will apply to all p tags because first-child would be a style tag.
+    	The following rule resets the first p tag back to its original margin
+    	defined in packages/editor/editor-common/src/styles/shared/paragraph.ts */
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+    '& > style:first-child + p': {
+      marginTop: blockNodesVerticalMargin
+    }
+  }
+});
+
+/* This prevents https://product-fabric.atlassian.net/browse/ED-20924 */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var listsStylesSafariFix = exports.listsStylesSafariFix = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".ProseMirror:not(.".concat(BLOCK_CARD_CONTAINER, ") > li::before"), {
+  content: '" "',
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
+  lineHeight: akEditorLineHeight
+}), ".ProseMirror:not(.".concat(BLOCK_CARD_CONTAINER, ") > li > p:first-child, .ProseMirror:not(.").concat(BLOCK_CARD_CONTAINER, ") > li > .code-block:first-child, .ProseMirror:not(.").concat(BLOCK_CARD_CONTAINER, ") > li > .ProseMirror-gapcursor:first-child + .code-block"), {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
+  marginTop: "-".concat(akEditorLineHeight, "em !important")
+}));

package/dist/cjs/ui/EditorContentContainer/styles/selectionStyles.js

@@ -28,7 +28,7 @@ var borderSelectionStyles = exports.borderSelectionStyles = (0, _react.css)({
   // Fixes ED-15246: Trello card is visible through a border of a table border
   '&::after': {
     height: '100%',
-    content: '"\\00a0"',
+    content: "'\\00a0'",
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values,@atlaskit/ui-styling-standard/no-unsafe-values
     background: "var(--ds-border-selected, #0C66E4)",
     position: 'absolute',

package/dist/cjs/ui/EditorContentContainer/styles/shadowStyles.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.shadowStyles = exports.shadowObserverClassNames = exports.shadowClassNames = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("@emotion/react");
+// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+
+var shadowClassNames = exports.shadowClassNames = {
+  RIGHT_SHADOW: 'right-shadow',
+  LEFT_SHADOW: 'left-shadow'
+};
+var shadowObserverClassNames = exports.shadowObserverClassNames = {
+  SENTINEL_LEFT: 'sentinel-left',
+  SENTINEL_RIGHT: 'sentinel-right',
+  SHADOW_CONTAINER: 'with-shadow-observer'
+};
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var shadowStyles = exports.shadowStyles = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "& .".concat(shadowClassNames.RIGHT_SHADOW, "::before, .").concat(shadowClassNames.RIGHT_SHADOW, "::after, .").concat(shadowClassNames.LEFT_SHADOW, "::before, .").concat(shadowClassNames.LEFT_SHADOW, "::after"), {
+  display: 'none',
+  position: 'absolute',
+  pointerEvents: 'none',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  zIndex: 2,
+  width: 8,
+  content: "''",
+  height: 'calc(100%)'
+}), "& .".concat(shadowClassNames.RIGHT_SHADOW, ", .").concat(shadowClassNames.LEFT_SHADOW), {
+  position: 'relative'
+}), "& .".concat(shadowClassNames.LEFT_SHADOW, "::before"), {
+  background: "linear-gradient(to left, transparent 0, ".concat("var(--ds-shadow-overflow-spread, #091e4229)", " 140% ), linear-gradient( to right, ", "var(--ds-shadow-overflow-perimeter, transparent)", " 0px, transparent 1px)"),
+  top: 0,
+  left: 0,
+  display: 'block'
+}), "& .".concat(shadowClassNames.RIGHT_SHADOW, "::after"), {
+  background: "linear-gradient(to right, transparent 0, ".concat("var(--ds-shadow-overflow-spread, #091e4229)", " 140% ), linear-gradient( to left, ", "var(--ds-shadow-overflow-perimeter, transparent)", " 0px, transparent 1px)"),
+  right: 0,
+  top: 0,
+  display: 'block'
+}), "& .".concat(shadowObserverClassNames.SENTINEL_LEFT), {
+  height: '100%',
+  width: 0,
+  minWidth: 0
+}), "& .".concat(shadowObserverClassNames.SENTINEL_RIGHT), {
+  height: '100%',
+  width: 0,
+  minWidth: 0
+}));

package/dist/cjs/ui/EditorContentContainer/styles/textColorStyles.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.textColorStyles = void 0;
+var _react = require("@emotion/react");
+// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var textColorStyles = exports.textColorStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '.fabric-text-color-mark': {
+    color: 'var(--custom-palette-color, inherit)'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  'a .fabric-text-color-mark': {
+    color: 'unset'
+  }
+});

package/dist/cjs/ui/EditorContentContainer/styles/unsupportedStyles.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.unsupportedStyles = exports.UnsupportedSharedCssClassName = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = require("@emotion/react");
+var _selectionStyles = require("./selectionStyles");
+// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+
+var UnsupportedSharedCssClassName = exports.UnsupportedSharedCssClassName = {
+  BLOCK_CONTAINER: 'unsupportedBlockView-content-wrap',
+  INLINE_CONTAINER: 'unsupportedInlineView-content-wrap'
+};
+
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var unsupportedStyles = exports.unsupportedStyles = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(UnsupportedSharedCssClassName.BLOCK_CONTAINER, " > div, .").concat(UnsupportedSharedCssClassName.INLINE_CONTAINER, " > span:nth-of-type(2)"), {
+  cursor: 'pointer'
+}), '.ak-editor-selected-node', (0, _defineProperty2.default)({}, "&.".concat(UnsupportedSharedCssClassName.BLOCK_CONTAINER, " > div, &.").concat(UnsupportedSharedCssClassName.INLINE_CONTAINER, " > span:nth-of-type(2)"),
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
+[
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+_selectionStyles.backgroundSelectionStyles,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+_selectionStyles.borderSelectionStyles,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values
+_selectionStyles.hideNativeBrowserTextSelectionStyles])), '.danger', {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.ak-editor-selected-node': (0, _defineProperty2.default)({}, "&.".concat(UnsupportedSharedCssClassName.BLOCK_CONTAINER, " > div, &.").concat(UnsupportedSharedCssClassName.INLINE_CONTAINER, " > span:nth-of-type(2)"), {
+    border: "1px solid ".concat("var(--ds-border-danger, #E2483D)"),
+    backgroundColor: "var(--ds-blanket-danger, #EF5C4814)"
+  })
+}));

package/dist/cjs/ui/EditorContentContainer/styles/whitespaceStyles.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.whitespaceStyles = void 0;
+var _react = require("@emotion/react");
+// eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
+var whitespaceStyles = exports.whitespaceStyles = (0, _react.css)({
+  wordWrap: 'break-word',
+  whiteSpace: 'pre-wrap'
+});

package/dist/cjs/version-wrapper.js

@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.version = exports.name = void 0;
 var name = exports.name = "@atlaskit/editor-core";
-var version = exports.version = "207.8.0";
+var version = exports.version = "207.10.1";

package/dist/es2019/composable-editor/core-editor.js

@@ -14,7 +14,6 @@ import { useAnalyticsEvents } from '@atlaskit/analytics-next/useAnalyticsEvents'
 import { ACTION, fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { startMeasure, stopMeasure } from '@atlaskit/editor-common/performance-measures';
 import { getAnalyticsAppearance } from '@atlaskit/editor-common/utils/analytics';
-import { fg } from '@atlaskit/platform-feature-flags';
 import EditorActions from '../actions';
 import { useEditorContext } from '../ui/EditorContext';
 import { createFeatureFlagsFromProps } from '../utils/feature-flags-from-props';
@@ -92,7 +91,7 @@ function Editor(passedProps) {
     }
   }, [onSaveFromProps]);
   const isFullPageApperance = Boolean(props.appearance && ['full-page', 'full-width'].includes(props.appearance));
-  return jsx(Fragment, null, isFullPageApperance && fg('platform_editor_fe--inp-metrics') ? jsx(EditorINPMetrics, null) : null, jsx(EditorInternal, {
+  return jsx(Fragment, null, isFullPageApperance ? jsx(EditorINPMetrics, null) : null, jsx(EditorInternal, {
     props: props,
     handleAnalyticsEvent: handleAnalyticsEvent,
     createAnalyticsEvent: createAnalyticsEvent,

package/dist/es2019/create-editor/ReactEditorView.js

@@ -4,6 +4,7 @@ import uuid from 'uuid/v4';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent, PLATFORMS } from '@atlaskit/editor-common/analytics';
 import { createDispatch, EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import { useConstructor, usePreviousState } from '@atlaskit/editor-common/hooks';
+import { nodeVisibilityManager } from '@atlaskit/editor-common/node-visibility';
 import { getEnabledFeatureFlagKeys } from '@atlaskit/editor-common/normalize-feature-flags';
 import { measureRender } from '@atlaskit/editor-common/performance/measure-render';
 import { getResponseEndTime } from '@atlaskit/editor-common/performance/navigation';
@@ -15,6 +16,7 @@ import { isEmptyDocument } from '@atlaskit/editor-common/utils/document';
 import { EditorState, Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { EditorView } from '@atlaskit/editor-prosemirror/view';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { useProviders } from '../composable-editor/hooks/useProviders';
 import { createFeatureFlagsFromProps } from '../utils/feature-flags-from-props';
 import { getNodesCount } from '../utils/getNodesCount';
@@ -462,6 +464,12 @@ export function ReactEditorView(props) {
   }, [editorView, shouldFocus, __livePage, mitigateScrollJump]);
   const handleEditorViewRef = useCallback(node => {
     if (!viewRef.current && node) {
+      // make sure this doesn't expose the experiment
+      if (editorExperiment('platform_editor_nodevisibility', true, {
+        exposure: false
+      })) {
+        nodeVisibilityManager(node).initialiseNodeObserver();
+      }
       const view = createEditorView(node);
       if (fg('platform_editor_reduce_scroll_jump_on_editor_start')) {
         if (mitigateScrollJump) {
@@ -530,6 +538,9 @@ export function ReactEditorView(props) {
       } else {
         viewRef.current.destroy(); // Destroys the dom node & all node views
       }
+      if (editorExperiment('platform_editor_nodevisibility', true)) {
+        nodeVisibilityManager(viewRef.current.dom).disconnect();
+      }
       viewRef.current = undefined;
     }
   }, [createEditorView, onEditorCreated, eventDispatcher, shouldFocus, __livePage, onEditorDestroyed, handleAnalyticsEvent, mitigateScrollJump]);