@atlaskit/editor-core 207.5.0 → 207.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/dist/cjs/ui/Appearance/FullPage/FullPage.js +13 -1
  3. package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js +7 -1
  4. package/dist/cjs/ui/ContentStyles/media.js +1 -1
  5. package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js +2 -1
  6. package/dist/cjs/ui/EditorContentContainer/styles/codeMarkStyles.js +31 -0
  7. package/dist/cjs/version-wrapper.js +1 -1
  8. package/dist/es2019/ui/Appearance/FullPage/FullPage.js +13 -1
  9. package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js +7 -1
  10. package/dist/es2019/ui/ContentStyles/media.js +1 -0
  11. package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js +3 -2
  12. package/dist/es2019/ui/EditorContentContainer/styles/codeMarkStyles.js +24 -0
  13. package/dist/es2019/version-wrapper.js +1 -1
  14. package/dist/esm/ui/Appearance/FullPage/FullPage.js +13 -1
  15. package/dist/esm/ui/Appearance/FullPage/FullPageContentArea.js +7 -1
  16. package/dist/esm/ui/ContentStyles/media.js +1 -1
  17. package/dist/esm/ui/EditorContentContainer/EditorContentContainer.js +3 -2
  18. package/dist/esm/ui/EditorContentContainer/styles/codeMarkStyles.js +24 -0
  19. package/dist/esm/version-wrapper.js +1 -1
  20. package/dist/types/create-editor/create-universal-preset.d.ts +3 -12
  21. package/dist/types/presets/universal.d.ts +3 -12
  22. package/dist/types/presets/useUniversalPreset.d.ts +3 -12
  23. package/dist/types/ui/Appearance/FullPage/FullPageContentArea.d.ts +1 -1
  24. package/dist/types/ui/EditorContentContainer/styles/codeMarkStyles.d.ts +1 -0
  25. package/dist/types-ts4.5/create-editor/create-universal-preset.d.ts +3 -12
  26. package/dist/types-ts4.5/presets/universal.d.ts +3 -12
  27. package/dist/types-ts4.5/presets/useUniversalPreset.d.ts +3 -12
  28. package/dist/types-ts4.5/ui/Appearance/FullPage/FullPageContentArea.d.ts +1 -1
  29. package/dist/types-ts4.5/ui/EditorContentContainer/styles/codeMarkStyles.d.ts +1 -0
  30. package/package.json +7 -7
package/CHANGELOG.md CHANGED
@@ -1,5 +1,27 @@
1
1
  # @atlaskit/editor-core
2
2
 
3
+ ## 207.6.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#159390](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/159390)
8
+ [`cc1d530fb6ed2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cc1d530fb6ed2) -
9
+ [ux] [ED-28074] Fix media selection state and remove css-based targeting
10
+ - Updated dependencies
11
+
12
+ ## 207.6.0
13
+
14
+ ### Minor Changes
15
+
16
+ - [#159258](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/159258)
17
+ [`875b7fcf43475`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/875b7fcf43475) -
18
+ [https://product-fabric.atlassian.net/browse/ED-27746](ED-27746) - rewrite editor code mark CSS in
19
+ static emotion
20
+
21
+ ### Patch Changes
22
+
23
+ - Updated dependencies
24
+
3
25
  ## 207.5.0
4
26
 
5
27
  ### Minor Changes
package/dist/cjs/ui/Appearance/FullPage/FullPage.js CHANGED
@@ -101,7 +101,19 @@ var FullPageEditor = exports.FullPageEditor = function FullPageEditor(props) {
101
101
  primaryToolbarState = _useFullPageEditorPlu.primaryToolbarState,
102
102
  interactionState = _useFullPageEditorPlu.interactionState;
103
103
  var viewMode = (0, _getEditorViewModeSync.getEditorViewMode)(editorViewModeState, props.preset);
104
- var hasHadInteraction = (0, _platformFeatureFlags.fg)('platform_editor_interaction_api_refactor') ? (interactionState === null || interactionState === void 0 ? void 0 : interactionState.interactionState) !== 'hasNotHadInteraction' : Boolean(interactionState === null || interactionState === void 0 ? void 0 : interactionState.hasHadInteraction);
104
+
105
+ // Remove all this logic when platform_editor_interaction_api_refactor is cleaned up
106
+ var hasHadInteraction;
107
+ if ((0, _platformFeatureFlags.fg)('platform_editor_interaction_api_refactor')) {
108
+ // Warning: this logic is a cluster-f but `hasHadInteraction` depends on undefined being allowed
109
+ // in which case no class will be rendered at all. In this way we only set `hasHadInteraction to
110
+ // boolean when interactionState is not undefined.
111
+ if (interactionState) {
112
+ hasHadInteraction = interactionState.interactionState !== 'hasNotHadInteraction';
113
+ }
114
+ } else {
115
+ hasHadInteraction = interactionState === null || interactionState === void 0 ? void 0 : interactionState.hasHadInteraction;
116
+ }
105
117
  var toolbarDocking = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(editorAPI, 'selectionToolbar.toolbarDocking');
106
118
  if (!toolbarDocking && (0, _platformFeatureFlags.fg)('platform_editor_controls_toolbar_ssr_fix')) {
107
119
  var _editorAPI$selectionT, _editorAPI$selectionT2;
package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js CHANGED
@@ -77,8 +77,14 @@ var Content = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
77
77
  }
78
78
  };
79
79
  }, []);
80
+
81
+ // Remove entire `hasHadInteraction` logic and prop when 'platform_editor_interaction_api_refactor' is cleaned up
80
82
  var interactionClassName;
81
- if (props.hasHadInteraction && (0, _platformFeatureFlags.fg)('platform_editor_no_cursor_on_live_doc_init')) {
83
+ if ((0, _platformFeatureFlags.fg)('platform_editor_interaction_api_refactor')) {
84
+ // no-op and do not add any classes
85
+ } else if (
86
+ // eslint-disable-next-line @atlaskit/platform/no-preconditioning
87
+ props.hasHadInteraction !== undefined && (0, _platformFeatureFlags.fg)('platform_editor_no_cursor_on_live_doc_init')) {
82
88
  interactionClassName = props.hasHadInteraction ? 'ak-editor-has-interaction' : 'ak-editor-no-interaction';
83
89
  }
84
90
  var shouldSetHiddenDataAttribute = function shouldSetHiddenDataAttribute() {
package/dist/cjs/ui/ContentStyles/media.js CHANGED
@@ -14,7 +14,7 @@ var _mediaCard = require("@atlaskit/media-card");
14
14
  var _templateObject; // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
15
15
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
16
16
  var mediaStyles = exports.mediaStyles = function mediaStyles() {
17
- return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t", " & [layout='full-width'] .", ",\n & [layout='wide'] .", " {\n\t\t\tmargin-left: 50%;\n\t\t\ttransform: translateX(-50%);\n\t\t}\n\n\t\t.media-extended-resize-experience[layout^='wrap-'] {\n\t\t\t/* override 'overflow: auto' when viewport <= 410 set by mediaSingleSharedStyle\n\t\t\tto prevent scroll bar */\n\t\t\toverflow: visible !important;\n\t\t}\n\n\t\t& [layout^='wrap-'] + [layout^='wrap-'] {\n\t\t\tclear: none;\n\t\t\t& + p,\n\t\t\t& + div[class^='fabric-editor-align'],\n\t\t\t& + ul,\n\t\t\t& + ol,\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\tclear: both !important;\n\t\t\t}\n\t\t\t& .", " {\n\t\t\t\tmargin-left: 0;\n\t\t\t\tmargin-right: 0;\n\t\t\t}\n\t\t}\n\n\t\t", "\n\n\t\t.mediaSingleView-content-wrap[layout^='wrap-'] {\n\t\t\tmax-width: 100%;\n\t\t\t/* overwrite default Prosemirror setting making it clear: both */\n\t\t\tclear: inherit;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-left'] {\n\t\t\tfloat: left;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-right'] {\n\t\t\tfloat: right;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-right']\n\t\t\t+ .mediaSingleView-content-wrap[layout='wrap-left'] {\n\t\t\tclear: both;\n\t\t}\n\n\t\t/* Larger margins for resize handlers when at depth 0 of the document */\n\t\t& > .mediaSingleView-content-wrap {\n\t\t\t.richMedia-resize-handle-right {\n\t\t\t\tmargin-right: -", "px;\n\t\t\t}\n\t\t\t.richMedia-resize-handle-left {\n\t\t\t\tmargin-left: -", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.richMedia-resize-handle-right,\n\t.richMedia-resize-handle-left {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\n\t\t/* vertical align */\n\t\tjustify-content: center;\n\t}\n\n\t.richMedia-resize-handle-right {\n\t\talign-items: flex-end;\n\t\tpadding-right: ", ";\n\t\tmargin-right: -", "px;\n\t}\n\n\t.richMedia-resize-handle-left {\n\t\talign-items: flex-start;\n\t\tpadding-left: ", ";\n\t\tmargin-left: -", "px;\n\t}\n\n\t.richMedia-resize-handle-right::after,\n\t.richMedia-resize-handle-left::after {\n\t\tcontent: ' ';\n\t\tdisplay: flex;\n\t\twidth: 3px;\n\t\theight: 64px;\n\n\t\tborder-radius: 6px;\n\t}\n\n\t.", ":hover .richMedia-resize-handle-left::after,\n\t.", ":hover .richMedia-resize-handle-right::after {\n\t\tbackground: ", ";\n\t}\n\n\t.", " .richMedia-resize-handle-right::after,\n\t.", " .richMedia-resize-handle-left::after,\n\t.", " .richMedia-resize-handle-right:hover::after,\n\t.", " .richMedia-resize-handle-left:hover::after,\n\t.", ".is-resizing .richMedia-resize-handle-right::after,\n\t.", ".is-resizing .richMedia-resize-handle-left::after {\n\t\tbackground: ", ";\n\t}\n\n\t.__resizable_base__ {\n\t\tleft: unset !important;\n\t\twidth: auto !important;\n\t\theight: auto !important;\n\t}\n\n\t/* Danger when top level node for smart cards / inline links */\n\t.danger > div > div > .media-card-frame,\n\t.danger > span > a {\n\t\tbackground-color: ", ";\n\t\tbox-shadow: 0px 0px 0px ", "px\n\t\t\t", ";\n\t\ttransition:\n\t\t\tbackground-color 0s,\n\t\t\tbox-shadow 0s;\n\t}\n\t/* Danger when nested node or common */\n\t.danger {\n\t\t/* Media single */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t/* Media single video player */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t/* New file experience */\n\t\t.", " .", " {\n\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t}\n\t\t/* Media resize legacy handlers */\n\t\t.richMedia-resize-handle-right::after,\n\t\t.richMedia-resize-handle-left::after {\n\t\t\tbackground: ", " !important;\n\t\t}\n\t\t/* Media resize new handlers */\n\t\t.resizer-handle-thumb {\n\t\t\tbackground: ", " !important;\n\t\t}\n\n\t\t/* Smart cards */\n\t\tdiv div .media-card-frame,\n\t\t.inlineCardView-content-wrap > span > a {\n\t\t\tbackground-color: ", "; /* R75 with 50% opactiy */\n\t\t\ttransition: background-color 0s;\n\t\t}\n\n\t\tdiv div .media-card-frame::after {\n\t\t\tbox-shadow: none;\n\t\t}\n\t}\n\n\t.warning {\n\t\t/* Media single */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t.", " .", " {\n\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t}\n\n\t\t.resizer-handle-thumb {\n\t\t\tbackground: ", " !important;\n\t\t}\n\t}\n\n\t.media-filmstrip-list-item {\n\t\tcursor: pointer;\n\t}\n\n\t/* When clicking drag handle, mediaGroup node will be selected. Hence we need to apply selected style to each media node */\n\t.mediaGroupView-content-wrap.", " #newFileExperienceWrapper {\n\t\tbox-shadow: ", ";\n\t}\n\n\t.ak-editor-no-interaction #newFileExperienceWrapper {\n\t\tbox-shadow: none;\n\t}\n"])), _styles.mediaSingleSharedStyleNew, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _mediaInline.mediaInlineImageStyles, _editorSharedStyles.akEditorMediaResizeHandlerPaddingWide, _editorSharedStyles.akEditorMediaResizeHandlerPaddingWide, "var(--ds-space-150, 12px)", _editorSharedStyles.akEditorMediaResizeHandlerPadding, "var(--ds-space-150, 12px)", _editorSharedStyles.akEditorMediaResizeHandlerPadding, _styles.richMediaClassName, _styles.richMediaClassName, "var(--ds-border, #091E4224)", _editorSharedStyles.akEditorSelectedNodeClassName, _editorSharedStyles.akEditorSelectedNodeClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, "var(--ds-border-focused, #388BFF)", "var(--ds-background-danger, ".concat(_editorSharedStyles.akEditorDeleteBackground, ")"), _editorSharedStyles.akEditorSelectedBorderBoldSize, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), _styles.richMediaClassName, _mediaCard.fileCardImageViewSelector, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), _styles.richMediaClassName, _mediaCard.inlinePlayerClassName, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), _styles.richMediaClassName, _mediaCard.newFileExperienceClassName, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), "var(--ds-blanket-danger, rgb(255, 189, 173, 0.5))", _styles.richMediaClassName, _mediaCard.fileCardImageViewSelector, "var(--ds-border-warning, #E56910)", _styles.richMediaClassName, _mediaCard.inlinePlayerClassName, "var(--ds-border-warning, #E56910)", _styles.richMediaClassName, _mediaCard.newFileExperienceClassName, "var(--ds-border-warning, #E56910)", "var(--ds-icon-warning, #E56910)", _editorSharedStyles.akEditorSelectedNodeClassName, _editorSharedStyles.akEditorSelectedBoxShadow);
17
+ return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t", " & [layout='full-width'] .", ",\n & [layout='wide'] .", " {\n\t\t\tmargin-left: 50%;\n\t\t\ttransform: translateX(-50%);\n\t\t}\n\n\t\t.media-extended-resize-experience[layout^='wrap-'] {\n\t\t\t/* override 'overflow: auto' when viewport <= 410 set by mediaSingleSharedStyle\n\t\t\tto prevent scroll bar */\n\t\t\toverflow: visible !important;\n\t\t}\n\n\t\t& [layout^='wrap-'] + [layout^='wrap-'] {\n\t\t\tclear: none;\n\t\t\t& + p,\n\t\t\t& + div[class^='fabric-editor-align'],\n\t\t\t& + ul,\n\t\t\t& + ol,\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\tclear: both !important;\n\t\t\t}\n\t\t\t& .", " {\n\t\t\t\tmargin-left: 0;\n\t\t\t\tmargin-right: 0;\n\t\t\t}\n\t\t}\n\n\t\t", "\n\n\t\t.mediaSingleView-content-wrap[layout^='wrap-'] {\n\t\t\tmax-width: 100%;\n\t\t\t/* overwrite default Prosemirror setting making it clear: both */\n\t\t\tclear: inherit;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-left'] {\n\t\t\tfloat: left;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-right'] {\n\t\t\tfloat: right;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-right']\n\t\t\t+ .mediaSingleView-content-wrap[layout='wrap-left'] {\n\t\t\tclear: both;\n\t\t}\n\n\t\t/* Larger margins for resize handlers when at depth 0 of the document */\n\t\t& > .mediaSingleView-content-wrap {\n\t\t\t.richMedia-resize-handle-right {\n\t\t\t\tmargin-right: -", "px;\n\t\t\t}\n\t\t\t.richMedia-resize-handle-left {\n\t\t\t\tmargin-left: -", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.richMedia-resize-handle-right,\n\t.richMedia-resize-handle-left {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\n\t\t/* vertical align */\n\t\tjustify-content: center;\n\t}\n\n\t.richMedia-resize-handle-right {\n\t\talign-items: flex-end;\n\t\tpadding-right: ", ";\n\t\tmargin-right: -", "px;\n\t}\n\n\t.richMedia-resize-handle-left {\n\t\talign-items: flex-start;\n\t\tpadding-left: ", ";\n\t\tmargin-left: -", "px;\n\t}\n\n\t.richMedia-resize-handle-right::after,\n\t.richMedia-resize-handle-left::after {\n\t\tcontent: ' ';\n\t\tdisplay: flex;\n\t\twidth: 3px;\n\t\theight: 64px;\n\n\t\tborder-radius: 6px;\n\t}\n\n\t.", ":hover .richMedia-resize-handle-left::after,\n\t.", ":hover .richMedia-resize-handle-right::after {\n\t\tbackground: ", ";\n\t}\n\n\t.", " .richMedia-resize-handle-right::after,\n\t.", " .richMedia-resize-handle-left::after,\n\t.", " .richMedia-resize-handle-right:hover::after,\n\t.", " .richMedia-resize-handle-left:hover::after,\n\t.", ".is-resizing .richMedia-resize-handle-right::after,\n\t.", ".is-resizing .richMedia-resize-handle-left::after {\n\t\tbackground: ", ";\n\t}\n\n\t.__resizable_base__ {\n\t\tleft: unset !important;\n\t\twidth: auto !important;\n\t\theight: auto !important;\n\t}\n\n\t/* Danger when top level node for smart cards / inline links */\n\t.danger > div > div > .media-card-frame,\n\t.danger > span > a {\n\t\tbackground-color: ", ";\n\t\tbox-shadow: 0px 0px 0px ", "px\n\t\t\t", ";\n\t\ttransition:\n\t\t\tbackground-color 0s,\n\t\t\tbox-shadow 0s;\n\t}\n\t/* Danger when nested node or common */\n\t.danger {\n\t\t/* Media single */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t/* Media single video player */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t/* New file experience */\n\t\t.", " .", " {\n\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t}\n\t\t/* Media resize legacy handlers */\n\t\t.richMedia-resize-handle-right::after,\n\t\t.richMedia-resize-handle-left::after {\n\t\t\tbackground: ", " !important;\n\t\t}\n\t\t/* Media resize new handlers */\n\t\t.resizer-handle-thumb {\n\t\t\tbackground: ", " !important;\n\t\t}\n\n\t\t/* Smart cards */\n\t\tdiv div .media-card-frame,\n\t\t.inlineCardView-content-wrap > span > a {\n\t\t\tbackground-color: ", "; /* R75 with 50% opactiy */\n\t\t\ttransition: background-color 0s;\n\t\t}\n\n\t\tdiv div .media-card-frame::after {\n\t\t\tbox-shadow: none;\n\t\t}\n\t}\n\n\t.warning {\n\t\t/* Media single */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t.", " .", " {\n\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t}\n\n\t\t.resizer-handle-thumb {\n\t\t\tbackground: ", " !important;\n\t\t}\n\t}\n\n\t.media-filmstrip-list-item {\n\t\tcursor: pointer;\n\t}\n\n\t/* When clicking drag handle, mediaGroup node will be selected. Hence we need to apply selected style to each media node */\n\t.mediaGroupView-content-wrap.", " #newFileExperienceWrapper {\n\t\tbox-shadow: ", ";\n\t}\n\n\t// Remove when cleaning up platform_editor_interaction_api_refactor\n\t.ak-editor-no-interaction #newFileExperienceWrapper {\n\t\tbox-shadow: none;\n\t}\n"])), _styles.mediaSingleSharedStyleNew, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _mediaInline.mediaInlineImageStyles, _editorSharedStyles.akEditorMediaResizeHandlerPaddingWide, _editorSharedStyles.akEditorMediaResizeHandlerPaddingWide, "var(--ds-space-150, 12px)", _editorSharedStyles.akEditorMediaResizeHandlerPadding, "var(--ds-space-150, 12px)", _editorSharedStyles.akEditorMediaResizeHandlerPadding, _styles.richMediaClassName, _styles.richMediaClassName, "var(--ds-border, #091E4224)", _editorSharedStyles.akEditorSelectedNodeClassName, _editorSharedStyles.akEditorSelectedNodeClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, "var(--ds-border-focused, #388BFF)", "var(--ds-background-danger, ".concat(_editorSharedStyles.akEditorDeleteBackground, ")"), _editorSharedStyles.akEditorSelectedBorderBoldSize, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), _styles.richMediaClassName, _mediaCard.fileCardImageViewSelector, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), _styles.richMediaClassName, _mediaCard.inlinePlayerClassName, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), _styles.richMediaClassName, _mediaCard.newFileExperienceClassName, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(_editorSharedStyles.akEditorDeleteIconColor, ")"), "var(--ds-blanket-danger, rgb(255, 189, 173, 0.5))", _styles.richMediaClassName, _mediaCard.fileCardImageViewSelector, "var(--ds-border-warning, #E56910)", _styles.richMediaClassName, _mediaCard.inlinePlayerClassName, "var(--ds-border-warning, #E56910)", _styles.richMediaClassName, _mediaCard.newFileExperienceClassName, "var(--ds-border-warning, #E56910)", "var(--ds-icon-warning, #E56910)", _editorSharedStyles.akEditorSelectedNodeClassName, _editorSharedStyles.akEditorSelectedBoxShadow);
18
18
  };
19
19
 
20
20
  /* `left: unset` above is to work around Chrome bug where rendering a div with
package/dist/cjs/ui/EditorContentContainer/EditorContentContainer.js CHANGED
@@ -36,6 +36,7 @@ var _tasksAndDecisions = require("../ContentStyles/tasks-and-decisions");
36
36
  var _aiPanel = require("./styles/ai-panel");
37
37
  var _annotationStyles = require("./styles/annotationStyles");
38
38
  var _backgroundColorStyles = require("./styles/backgroundColorStyles");
39
+ var _codeMarkStyles = require("./styles/codeMarkStyles");
39
40
  var _embedCardStyles = require("./styles/embedCardStyles");
40
41
  var _layout = require("./styles/layout");
41
42
  var _link = require("./styles/link");
@@ -148,7 +149,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
148
149
 
149
150
  // jest warning: JSDOM version (22) doesn't support the new @container CSS rule
150
151
  var contentStyles = function contentStyles() {
151
- return (0, _react2.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\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--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.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\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.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: var(--ak-editor-base-font-size);\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\t}\n\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 * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px 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\n\t", "\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n ", ";\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n // Switch between the two icons based on the visual refresh feature gate\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\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\t// Related code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\t// In 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\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n\t is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), _editorSharedStyles.akEditorGutterPadding, (0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), _editorSharedStyles.akEditorDefaultLayoutWidth, _editorSharedStyles.akEditorFullWidthLayoutWidth, _editorSharedStyles.akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, _editorSharedStyles.akEditorCalculatedWideLayoutWidth, _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('editor_request_to_edit_task') ? null : (0, _react2.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n\t\t\t\t\tpointer-events: none;\n\t\t\t\t\topacity: 0.7;\n\t\t\t\t}\n\t\t\t"]))), (0, _platformFeatureFlags.fg)('platform_editor_hide_cursor_when_pm_hideselection') ? (0, _react2.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, (0, _experiments.editorExperiment)('platform_editor_advanced_code_blocks', true) ? (0, _react2.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", _styles5.placeholderTextStyles, placeholderStyles, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, (0, _codeBlock.codeBlockStyles)(), (0, _styles2.blocktypeStyles)(), (0, _styles.codeMarkSharedStyles)(), _styles.textColorStyles, _backgroundColorStyles.backgroundColorStyles, listsStyles, _rule.ruleStyles, _mediaStyles.mediaStyles, (0, _platformFeatureFlags.fg)('confluence_team_presence_scroll_to_pointer') ? _collab.telepointerStyle : _collab.telepointerStyleWithInitialOnly, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
152
+ return (0, _react2.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\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--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.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\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.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: var(--ak-editor-base-font-size);\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\t}\n\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 * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px 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\n\t", "\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n ", ";\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n // Switch between the two icons based on the visual refresh feature gate\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\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\t// Related code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\t// In 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\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n\t is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), _editorSharedStyles.akEditorGutterPadding, (0, _editorSharedStyles.akEditorGutterPaddingDynamic)(), _editorSharedStyles.akEditorDefaultLayoutWidth, _editorSharedStyles.akEditorFullWidthLayoutWidth, _editorSharedStyles.akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, _editorSharedStyles.akEditorCalculatedWideLayoutWidth, _styles.whitespaceSharedStyles, (0, _styles.paragraphSharedStyles)(), _styles.listsSharedStyles, _styles.indentationSharedStyles, _styles.shadowSharedStyle, _getInlineNodeViewProducer.InlineNodeViewSharedStyles, (0, _platformFeatureFlags.fg)('editor_request_to_edit_task') ? null : (0, _react2.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n\t\t\t\t\tpointer-events: none;\n\t\t\t\t\topacity: 0.7;\n\t\t\t\t}\n\t\t\t"]))), (0, _platformFeatureFlags.fg)('platform_editor_hide_cursor_when_pm_hideselection') ? (0, _react2.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, (0, _experiments.editorExperiment)('platform_editor_advanced_code_blocks', true) ? (0, _react2.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", _styles5.placeholderTextStyles, placeholderStyles, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, (0, _codeBlock.codeBlockStyles)(), (0, _styles2.blocktypeStyles)(), _codeMarkStyles.codeMarkStyles, _styles.textColorStyles, _backgroundColorStyles.backgroundColorStyles, listsStyles, _rule.ruleStyles, _mediaStyles.mediaStyles, (0, _platformFeatureFlags.fg)('confluence_team_presence_scroll_to_pointer') ? _collab.telepointerStyle : _collab.telepointerStyleWithInitialOnly, _selection.gapCursorStyles, (0, _panel2.panelStyles)(), mentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
152
153
  exposure: false
153
154
  }) && vanillaMentionsStyles, (0, _experiments.editorExperiment)('platform_editor_vanilla_dom', true, {
154
155
  exposure: false
package/dist/cjs/ui/EditorContentContainer/styles/codeMarkStyles.js ADDED
@@ -0,0 +1,31 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.codeMarkStyles = void 0;
7
+ var _react = require("@emotion/react");
8
+ // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
9
+
10
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
11
+ var codeMarkStyles = exports.codeMarkStyles = (0, _react.css)({
12
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
13
+ '.code': {
14
+ '--ds--code--bg-color': "var(--ds-background-neutral, #091E420F)",
15
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
16
+ display: 'inline',
17
+ padding: '2px 0.5ch',
18
+ backgroundColor: "var(--ds--code--bg-color,".concat("var(--ds-background-neutral, #091E420F)", ")"),
19
+ borderRadius: "var(--ds-border-radius, 3px)",
20
+ borderStyle: 'none',
21
+ boxDecorationBreak: 'clone',
22
+ color: "var(--ds-text, #172B4D)",
23
+ fontFamily: "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)",
24
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
25
+ fontSize: '0.875em',
26
+ fontWeight: "var(--ds-font-weight-regular, 400)",
27
+ overflow: 'auto',
28
+ overflowWrap: 'break-word',
29
+ whiteSpace: 'pre-wrap'
30
+ }
31
+ });
package/dist/cjs/version-wrapper.js CHANGED
@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.version = exports.name = void 0;
7
7
  var name = exports.name = "@atlaskit/editor-core";
8
- var version = exports.version = "207.5.0";
8
+ var version = exports.version = "207.6.1";
package/dist/es2019/ui/Appearance/FullPage/FullPage.js CHANGED
@@ -83,7 +83,19 @@ export const FullPageEditor = props => {
83
83
  interactionState
84
84
  } = useFullPageEditorPluginsStates(editorAPI);
85
85
  const viewMode = getEditorViewMode(editorViewModeState, props.preset);
86
- const hasHadInteraction = fg('platform_editor_interaction_api_refactor') ? (interactionState === null || interactionState === void 0 ? void 0 : interactionState.interactionState) !== 'hasNotHadInteraction' : Boolean(interactionState === null || interactionState === void 0 ? void 0 : interactionState.hasHadInteraction);
86
+
87
+ // Remove all this logic when platform_editor_interaction_api_refactor is cleaned up
88
+ let hasHadInteraction;
89
+ if (fg('platform_editor_interaction_api_refactor')) {
90
+ // Warning: this logic is a cluster-f but `hasHadInteraction` depends on undefined being allowed
91
+ // in which case no class will be rendered at all. In this way we only set `hasHadInteraction to
92
+ // boolean when interactionState is not undefined.
93
+ if (interactionState) {
94
+ hasHadInteraction = interactionState.interactionState !== 'hasNotHadInteraction';
95
+ }
96
+ } else {
97
+ hasHadInteraction = interactionState === null || interactionState === void 0 ? void 0 : interactionState.hasHadInteraction;
98
+ }
87
99
  let toolbarDocking = useSharedPluginStateSelector(editorAPI, 'selectionToolbar.toolbarDocking');
88
100
  if (!toolbarDocking && fg('platform_editor_controls_toolbar_ssr_fix')) {
89
101
  var _editorAPI$selectionT, _editorAPI$selectionT2, _editorAPI$selectionT3;
package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js CHANGED
@@ -61,8 +61,14 @@ const Content = /*#__PURE__*/React.forwardRef((props, ref) => {
61
61
  return containerRef.current;
62
62
  }
63
63
  }), []);
64
+
65
+ // Remove entire `hasHadInteraction` logic and prop when 'platform_editor_interaction_api_refactor' is cleaned up
64
66
  let interactionClassName;
65
- if (props.hasHadInteraction && fg('platform_editor_no_cursor_on_live_doc_init')) {
67
+ if (fg('platform_editor_interaction_api_refactor')) {
68
+ // no-op and do not add any classes
69
+ } else if (
70
+ // eslint-disable-next-line @atlaskit/platform/no-preconditioning
71
+ props.hasHadInteraction !== undefined && fg('platform_editor_no_cursor_on_live_doc_init')) {
66
72
  interactionClassName = props.hasHadInteraction ? 'ak-editor-has-interaction' : 'ak-editor-no-interaction';
67
73
  }
68
74
  const shouldSetHiddenDataAttribute = () => {
package/dist/es2019/ui/ContentStyles/media.js CHANGED
@@ -196,6 +196,7 @@ export const mediaStyles = () => css`
196
196
  box-shadow: ${akEditorSelectedBoxShadow};
197
197
  }
198
198
 
199
+ // Remove when cleaning up platform_editor_interaction_api_refactor
199
200
  .ak-editor-no-interaction #newFileExperienceWrapper {
200
201
  box-shadow: none;
201
202
  }
package/dist/es2019/ui/EditorContentContainer/EditorContentContainer.js CHANGED
@@ -15,7 +15,7 @@ import { EmojiSharedCssClassName, defaultEmojiHeight } from '@atlaskit/editor-co
15
15
  import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
16
16
  import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
17
17
  import { gapCursorStyles } from '@atlaskit/editor-common/selection';
18
- import { CodeBlockSharedCssClassName, GRID_GUTTER, SmartCardSharedCssClassName, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, listsSharedStyles, paragraphSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
18
+ import { CodeBlockSharedCssClassName, GRID_GUTTER, SmartCardSharedCssClassName, blockMarksSharedStyles, codeBlockInListSafariFix, dateSharedStyle, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, listsSharedStyles, paragraphSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
19
19
  import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
20
20
  import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
21
21
  import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
@@ -37,6 +37,7 @@ import { taskDecisionStyles, vanillaTaskDecisionIconWithoutVisualRefresh as vani
37
37
  import { aiPanelBaseStyles, aiPanelDarkStyles } from './styles/ai-panel';
38
38
  import { annotationStyles } from './styles/annotationStyles';
39
39
  import { backgroundColorStyles } from './styles/backgroundColorStyles';
40
+ import { codeMarkStyles } from './styles/codeMarkStyles';
40
41
  import { embedCardStyles } from './styles/embedCardStyles';
41
42
  import { layoutBaseStyles, layoutViewStyles } from './styles/layout';
42
43
  import { linkStyles, linkStylesOld } from './styles/link';
@@ -398,7 +399,7 @@ const contentStyles = () => css`
398
399
 
399
400
  ${blocktypeStyles()}
400
401
 
401
- ${codeMarkSharedStyles()}
402
+ ${codeMarkStyles}
402
403
 
403
404
  ${textColorStyles}
404
405
 
package/dist/es2019/ui/EditorContentContainer/styles/codeMarkStyles.js ADDED
@@ -0,0 +1,24 @@
1
+ import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
2
+
3
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
4
+ export const codeMarkStyles = css({
5
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
6
+ '.code': {
7
+ '--ds--code--bg-color': "var(--ds-background-neutral, #091E420F)",
8
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
9
+ display: 'inline',
10
+ padding: '2px 0.5ch',
11
+ backgroundColor: `var(--ds--code--bg-color,${"var(--ds-background-neutral, #091E420F)"})`,
12
+ borderRadius: "var(--ds-border-radius, 3px)",
13
+ borderStyle: 'none',
14
+ boxDecorationBreak: 'clone',
15
+ color: "var(--ds-text, #172B4D)",
16
+ fontFamily: "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)",
17
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
18
+ fontSize: '0.875em',
19
+ fontWeight: "var(--ds-font-weight-regular, 400)",
20
+ overflow: 'auto',
21
+ overflowWrap: 'break-word',
22
+ whiteSpace: 'pre-wrap'
23
+ }
24
+ });
package/dist/es2019/version-wrapper.js CHANGED
@@ -1,2 +1,2 @@
1
1
  export const name = "@atlaskit/editor-core";
2
- export const version = "207.5.0";
2
+ export const version = "207.6.1";
package/dist/esm/ui/Appearance/FullPage/FullPage.js CHANGED
@@ -90,7 +90,19 @@ export var FullPageEditor = function FullPageEditor(props) {
90
90
  primaryToolbarState = _useFullPageEditorPlu.primaryToolbarState,
91
91
  interactionState = _useFullPageEditorPlu.interactionState;
92
92
  var viewMode = getEditorViewMode(editorViewModeState, props.preset);
93
- var hasHadInteraction = fg('platform_editor_interaction_api_refactor') ? (interactionState === null || interactionState === void 0 ? void 0 : interactionState.interactionState) !== 'hasNotHadInteraction' : Boolean(interactionState === null || interactionState === void 0 ? void 0 : interactionState.hasHadInteraction);
93
+
94
+ // Remove all this logic when platform_editor_interaction_api_refactor is cleaned up
95
+ var hasHadInteraction;
96
+ if (fg('platform_editor_interaction_api_refactor')) {
97
+ // Warning: this logic is a cluster-f but `hasHadInteraction` depends on undefined being allowed
98
+ // in which case no class will be rendered at all. In this way we only set `hasHadInteraction to
99
+ // boolean when interactionState is not undefined.
100
+ if (interactionState) {
101
+ hasHadInteraction = interactionState.interactionState !== 'hasNotHadInteraction';
102
+ }
103
+ } else {
104
+ hasHadInteraction = interactionState === null || interactionState === void 0 ? void 0 : interactionState.hasHadInteraction;
105
+ }
94
106
  var toolbarDocking = useSharedPluginStateSelector(editorAPI, 'selectionToolbar.toolbarDocking');
95
107
  if (!toolbarDocking && fg('platform_editor_controls_toolbar_ssr_fix')) {
96
108
  var _editorAPI$selectionT, _editorAPI$selectionT2;
package/dist/esm/ui/Appearance/FullPage/FullPageContentArea.js CHANGED
@@ -66,8 +66,14 @@ var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
66
66
  }
67
67
  };
68
68
  }, []);
69
+
70
+ // Remove entire `hasHadInteraction` logic and prop when 'platform_editor_interaction_api_refactor' is cleaned up
69
71
  var interactionClassName;
70
- if (props.hasHadInteraction && fg('platform_editor_no_cursor_on_live_doc_init')) {
72
+ if (fg('platform_editor_interaction_api_refactor')) {
73
+ // no-op and do not add any classes
74
+ } else if (
75
+ // eslint-disable-next-line @atlaskit/platform/no-preconditioning
76
+ props.hasHadInteraction !== undefined && fg('platform_editor_no_cursor_on_live_doc_init')) {
71
77
  interactionClassName = props.hasHadInteraction ? 'ak-editor-has-interaction' : 'ak-editor-no-interaction';
72
78
  }
73
79
  var shouldSetHiddenDataAttribute = function shouldSetHiddenDataAttribute() {
package/dist/esm/ui/ContentStyles/media.js CHANGED
@@ -8,7 +8,7 @@ import { akEditorDeleteBackground, akEditorDeleteBorder, akEditorDeleteIconColor
8
8
  import { fileCardImageViewSelector, inlinePlayerClassName, newFileExperienceClassName } from '@atlaskit/media-card';
9
9
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
10
10
  export var mediaStyles = function mediaStyles() {
11
- return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", " & [layout='full-width'] .", ",\n & [layout='wide'] .", " {\n\t\t\tmargin-left: 50%;\n\t\t\ttransform: translateX(-50%);\n\t\t}\n\n\t\t.media-extended-resize-experience[layout^='wrap-'] {\n\t\t\t/* override 'overflow: auto' when viewport <= 410 set by mediaSingleSharedStyle\n\t\t\tto prevent scroll bar */\n\t\t\toverflow: visible !important;\n\t\t}\n\n\t\t& [layout^='wrap-'] + [layout^='wrap-'] {\n\t\t\tclear: none;\n\t\t\t& + p,\n\t\t\t& + div[class^='fabric-editor-align'],\n\t\t\t& + ul,\n\t\t\t& + ol,\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\tclear: both !important;\n\t\t\t}\n\t\t\t& .", " {\n\t\t\t\tmargin-left: 0;\n\t\t\t\tmargin-right: 0;\n\t\t\t}\n\t\t}\n\n\t\t", "\n\n\t\t.mediaSingleView-content-wrap[layout^='wrap-'] {\n\t\t\tmax-width: 100%;\n\t\t\t/* overwrite default Prosemirror setting making it clear: both */\n\t\t\tclear: inherit;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-left'] {\n\t\t\tfloat: left;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-right'] {\n\t\t\tfloat: right;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-right']\n\t\t\t+ .mediaSingleView-content-wrap[layout='wrap-left'] {\n\t\t\tclear: both;\n\t\t}\n\n\t\t/* Larger margins for resize handlers when at depth 0 of the document */\n\t\t& > .mediaSingleView-content-wrap {\n\t\t\t.richMedia-resize-handle-right {\n\t\t\t\tmargin-right: -", "px;\n\t\t\t}\n\t\t\t.richMedia-resize-handle-left {\n\t\t\t\tmargin-left: -", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.richMedia-resize-handle-right,\n\t.richMedia-resize-handle-left {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\n\t\t/* vertical align */\n\t\tjustify-content: center;\n\t}\n\n\t.richMedia-resize-handle-right {\n\t\talign-items: flex-end;\n\t\tpadding-right: ", ";\n\t\tmargin-right: -", "px;\n\t}\n\n\t.richMedia-resize-handle-left {\n\t\talign-items: flex-start;\n\t\tpadding-left: ", ";\n\t\tmargin-left: -", "px;\n\t}\n\n\t.richMedia-resize-handle-right::after,\n\t.richMedia-resize-handle-left::after {\n\t\tcontent: ' ';\n\t\tdisplay: flex;\n\t\twidth: 3px;\n\t\theight: 64px;\n\n\t\tborder-radius: 6px;\n\t}\n\n\t.", ":hover .richMedia-resize-handle-left::after,\n\t.", ":hover .richMedia-resize-handle-right::after {\n\t\tbackground: ", ";\n\t}\n\n\t.", " .richMedia-resize-handle-right::after,\n\t.", " .richMedia-resize-handle-left::after,\n\t.", " .richMedia-resize-handle-right:hover::after,\n\t.", " .richMedia-resize-handle-left:hover::after,\n\t.", ".is-resizing .richMedia-resize-handle-right::after,\n\t.", ".is-resizing .richMedia-resize-handle-left::after {\n\t\tbackground: ", ";\n\t}\n\n\t.__resizable_base__ {\n\t\tleft: unset !important;\n\t\twidth: auto !important;\n\t\theight: auto !important;\n\t}\n\n\t/* Danger when top level node for smart cards / inline links */\n\t.danger > div > div > .media-card-frame,\n\t.danger > span > a {\n\t\tbackground-color: ", ";\n\t\tbox-shadow: 0px 0px 0px ", "px\n\t\t\t", ";\n\t\ttransition:\n\t\t\tbackground-color 0s,\n\t\t\tbox-shadow 0s;\n\t}\n\t/* Danger when nested node or common */\n\t.danger {\n\t\t/* Media single */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t/* Media single video player */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t/* New file experience */\n\t\t.", " .", " {\n\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t}\n\t\t/* Media resize legacy handlers */\n\t\t.richMedia-resize-handle-right::after,\n\t\t.richMedia-resize-handle-left::after {\n\t\t\tbackground: ", " !important;\n\t\t}\n\t\t/* Media resize new handlers */\n\t\t.resizer-handle-thumb {\n\t\t\tbackground: ", " !important;\n\t\t}\n\n\t\t/* Smart cards */\n\t\tdiv div .media-card-frame,\n\t\t.inlineCardView-content-wrap > span > a {\n\t\t\tbackground-color: ", "; /* R75 with 50% opactiy */\n\t\t\ttransition: background-color 0s;\n\t\t}\n\n\t\tdiv div .media-card-frame::after {\n\t\t\tbox-shadow: none;\n\t\t}\n\t}\n\n\t.warning {\n\t\t/* Media single */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t.", " .", " {\n\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t}\n\n\t\t.resizer-handle-thumb {\n\t\t\tbackground: ", " !important;\n\t\t}\n\t}\n\n\t.media-filmstrip-list-item {\n\t\tcursor: pointer;\n\t}\n\n\t/* When clicking drag handle, mediaGroup node will be selected. Hence we need to apply selected style to each media node */\n\t.mediaGroupView-content-wrap.", " #newFileExperienceWrapper {\n\t\tbox-shadow: ", ";\n\t}\n\n\t.ak-editor-no-interaction #newFileExperienceWrapper {\n\t\tbox-shadow: none;\n\t}\n"])), mediaSingleSharedStyleNew, richMediaClassName, richMediaClassName, richMediaClassName, mediaInlineImageStyles, akEditorMediaResizeHandlerPaddingWide, akEditorMediaResizeHandlerPaddingWide, "var(--ds-space-150, 12px)", akEditorMediaResizeHandlerPadding, "var(--ds-space-150, 12px)", akEditorMediaResizeHandlerPadding, richMediaClassName, richMediaClassName, "var(--ds-border, #091E4224)", akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, "var(--ds-border-focused, #388BFF)", "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), akEditorSelectedBorderBoldSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), richMediaClassName, fileCardImageViewSelector, "var(--ds-border-danger, ".concat(akEditorDeleteIconColor, ")"), richMediaClassName, inlinePlayerClassName, "var(--ds-border-danger, ".concat(akEditorDeleteIconColor, ")"), richMediaClassName, newFileExperienceClassName, "var(--ds-border-danger, ".concat(akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(akEditorDeleteIconColor, ")"), "var(--ds-blanket-danger, rgb(255, 189, 173, 0.5))", richMediaClassName, fileCardImageViewSelector, "var(--ds-border-warning, #E56910)", richMediaClassName, inlinePlayerClassName, "var(--ds-border-warning, #E56910)", richMediaClassName, newFileExperienceClassName, "var(--ds-border-warning, #E56910)", "var(--ds-icon-warning, #E56910)", akEditorSelectedNodeClassName, akEditorSelectedBoxShadow);
11
+ return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.ProseMirror {\n\t\t", " & [layout='full-width'] .", ",\n & [layout='wide'] .", " {\n\t\t\tmargin-left: 50%;\n\t\t\ttransform: translateX(-50%);\n\t\t}\n\n\t\t.media-extended-resize-experience[layout^='wrap-'] {\n\t\t\t/* override 'overflow: auto' when viewport <= 410 set by mediaSingleSharedStyle\n\t\t\tto prevent scroll bar */\n\t\t\toverflow: visible !important;\n\t\t}\n\n\t\t& [layout^='wrap-'] + [layout^='wrap-'] {\n\t\t\tclear: none;\n\t\t\t& + p,\n\t\t\t& + div[class^='fabric-editor-align'],\n\t\t\t& + ul,\n\t\t\t& + ol,\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\tclear: both !important;\n\t\t\t}\n\t\t\t& .", " {\n\t\t\t\tmargin-left: 0;\n\t\t\t\tmargin-right: 0;\n\t\t\t}\n\t\t}\n\n\t\t", "\n\n\t\t.mediaSingleView-content-wrap[layout^='wrap-'] {\n\t\t\tmax-width: 100%;\n\t\t\t/* overwrite default Prosemirror setting making it clear: both */\n\t\t\tclear: inherit;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-left'] {\n\t\t\tfloat: left;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-right'] {\n\t\t\tfloat: right;\n\t\t}\n\n\t\t.mediaSingleView-content-wrap[layout='wrap-right']\n\t\t\t+ .mediaSingleView-content-wrap[layout='wrap-left'] {\n\t\t\tclear: both;\n\t\t}\n\n\t\t/* Larger margins for resize handlers when at depth 0 of the document */\n\t\t& > .mediaSingleView-content-wrap {\n\t\t\t.richMedia-resize-handle-right {\n\t\t\t\tmargin-right: -", "px;\n\t\t\t}\n\t\t\t.richMedia-resize-handle-left {\n\t\t\t\tmargin-left: -", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.richMedia-resize-handle-right,\n\t.richMedia-resize-handle-left {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\n\t\t/* vertical align */\n\t\tjustify-content: center;\n\t}\n\n\t.richMedia-resize-handle-right {\n\t\talign-items: flex-end;\n\t\tpadding-right: ", ";\n\t\tmargin-right: -", "px;\n\t}\n\n\t.richMedia-resize-handle-left {\n\t\talign-items: flex-start;\n\t\tpadding-left: ", ";\n\t\tmargin-left: -", "px;\n\t}\n\n\t.richMedia-resize-handle-right::after,\n\t.richMedia-resize-handle-left::after {\n\t\tcontent: ' ';\n\t\tdisplay: flex;\n\t\twidth: 3px;\n\t\theight: 64px;\n\n\t\tborder-radius: 6px;\n\t}\n\n\t.", ":hover .richMedia-resize-handle-left::after,\n\t.", ":hover .richMedia-resize-handle-right::after {\n\t\tbackground: ", ";\n\t}\n\n\t.", " .richMedia-resize-handle-right::after,\n\t.", " .richMedia-resize-handle-left::after,\n\t.", " .richMedia-resize-handle-right:hover::after,\n\t.", " .richMedia-resize-handle-left:hover::after,\n\t.", ".is-resizing .richMedia-resize-handle-right::after,\n\t.", ".is-resizing .richMedia-resize-handle-left::after {\n\t\tbackground: ", ";\n\t}\n\n\t.__resizable_base__ {\n\t\tleft: unset !important;\n\t\twidth: auto !important;\n\t\theight: auto !important;\n\t}\n\n\t/* Danger when top level node for smart cards / inline links */\n\t.danger > div > div > .media-card-frame,\n\t.danger > span > a {\n\t\tbackground-color: ", ";\n\t\tbox-shadow: 0px 0px 0px ", "px\n\t\t\t", ";\n\t\ttransition:\n\t\t\tbackground-color 0s,\n\t\t\tbox-shadow 0s;\n\t}\n\t/* Danger when nested node or common */\n\t.danger {\n\t\t/* Media single */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t/* Media single video player */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t/* New file experience */\n\t\t.", " .", " {\n\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t}\n\t\t/* Media resize legacy handlers */\n\t\t.richMedia-resize-handle-right::after,\n\t\t.richMedia-resize-handle-left::after {\n\t\t\tbackground: ", " !important;\n\t\t}\n\t\t/* Media resize new handlers */\n\t\t.resizer-handle-thumb {\n\t\t\tbackground: ", " !important;\n\t\t}\n\n\t\t/* Smart cards */\n\t\tdiv div .media-card-frame,\n\t\t.inlineCardView-content-wrap > span > a {\n\t\t\tbackground-color: ", "; /* R75 with 50% opactiy */\n\t\t\ttransition: background-color 0s;\n\t\t}\n\n\t\tdiv div .media-card-frame::after {\n\t\t\tbox-shadow: none;\n\t\t}\n\t}\n\n\t.warning {\n\t\t/* Media single */\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t.", " .", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t.", " .", " {\n\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t}\n\n\t\t.resizer-handle-thumb {\n\t\t\tbackground: ", " !important;\n\t\t}\n\t}\n\n\t.media-filmstrip-list-item {\n\t\tcursor: pointer;\n\t}\n\n\t/* When clicking drag handle, mediaGroup node will be selected. Hence we need to apply selected style to each media node */\n\t.mediaGroupView-content-wrap.", " #newFileExperienceWrapper {\n\t\tbox-shadow: ", ";\n\t}\n\n\t// Remove when cleaning up platform_editor_interaction_api_refactor\n\t.ak-editor-no-interaction #newFileExperienceWrapper {\n\t\tbox-shadow: none;\n\t}\n"])), mediaSingleSharedStyleNew, richMediaClassName, richMediaClassName, richMediaClassName, mediaInlineImageStyles, akEditorMediaResizeHandlerPaddingWide, akEditorMediaResizeHandlerPaddingWide, "var(--ds-space-150, 12px)", akEditorMediaResizeHandlerPadding, "var(--ds-space-150, 12px)", akEditorMediaResizeHandlerPadding, richMediaClassName, richMediaClassName, "var(--ds-border, #091E4224)", akEditorSelectedNodeClassName, akEditorSelectedNodeClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, "var(--ds-border-focused, #388BFF)", "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), akEditorSelectedBorderBoldSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), richMediaClassName, fileCardImageViewSelector, "var(--ds-border-danger, ".concat(akEditorDeleteIconColor, ")"), richMediaClassName, inlinePlayerClassName, "var(--ds-border-danger, ".concat(akEditorDeleteIconColor, ")"), richMediaClassName, newFileExperienceClassName, "var(--ds-border-danger, ".concat(akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(akEditorDeleteIconColor, ")"), "var(--ds-icon-danger, ".concat(akEditorDeleteIconColor, ")"), "var(--ds-blanket-danger, rgb(255, 189, 173, 0.5))", richMediaClassName, fileCardImageViewSelector, "var(--ds-border-warning, #E56910)", richMediaClassName, inlinePlayerClassName, "var(--ds-border-warning, #E56910)", richMediaClassName, newFileExperienceClassName, "var(--ds-border-warning, #E56910)", "var(--ds-icon-warning, #E56910)", akEditorSelectedNodeClassName, akEditorSelectedBoxShadow);
12
12
  };
13
13
 
14
14
  /* `left: unset` above is to work around Chrome bug where rendering a div with
package/dist/esm/ui/EditorContentContainer/EditorContentContainer.js CHANGED
@@ -17,7 +17,7 @@ import { EmojiSharedCssClassName, defaultEmojiHeight } from '@atlaskit/editor-co
17
17
  import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
18
18
  import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
19
19
  import { gapCursorStyles } from '@atlaskit/editor-common/selection';
20
- import { CodeBlockSharedCssClassName, GRID_GUTTER, SmartCardSharedCssClassName, blockMarksSharedStyles, codeBlockInListSafariFix, codeMarkSharedStyles, dateSharedStyle, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, listsSharedStyles, paragraphSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
20
+ import { CodeBlockSharedCssClassName, GRID_GUTTER, SmartCardSharedCssClassName, blockMarksSharedStyles, codeBlockInListSafariFix, dateSharedStyle, expandClassNames, getSmartCardSharedStyles, gridStyles, indentationSharedStyles, listsSharedStyles, paragraphSharedStyles, shadowSharedStyle, smartCardSharedStyles, smartCardStyles, tasksAndDecisionsStyles, textColorStyles, unsupportedStyles, whitespaceSharedStyles } from '@atlaskit/editor-common/styles';
21
21
  import { blocktypeStyles } from '@atlaskit/editor-plugins/block-type/styles';
22
22
  import { findReplaceStyles } from '@atlaskit/editor-plugins/find-replace/styles';
23
23
  import { textHighlightStyle } from '@atlaskit/editor-plugins/paste-options-toolbar/styles';
@@ -39,6 +39,7 @@ import { taskDecisionStyles, vanillaTaskDecisionIconWithoutVisualRefresh as vani
39
39
  import { aiPanelBaseStyles, aiPanelDarkStyles } from './styles/ai-panel';
40
40
  import { annotationStyles } from './styles/annotationStyles';
41
41
  import { backgroundColorStyles } from './styles/backgroundColorStyles';
42
+ import { codeMarkStyles } from './styles/codeMarkStyles';
42
43
  import { embedCardStyles } from './styles/embedCardStyles';
43
44
  import { layoutBaseStyles, layoutViewStyles } from './styles/layout';
44
45
  import { linkStyles, linkStylesOld } from './styles/link';
@@ -142,7 +143,7 @@ var akEditorBreakpointForSmallDevice = "1266px";
142
143
 
143
144
  // jest warning: JSDOM version (22) doesn't support the new @container CSS rule
144
145
  var contentStyles = function contentStyles() {
145
- return css(_templateObject8 || (_templateObject8 = _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--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.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\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.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: var(--ak-editor-base-font-size);\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\t}\n\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 * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px 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\n\t", "\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n ", ";\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n // Switch between the two icons based on the visual refresh feature gate\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\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\t// Related code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\t// In 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\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n\t is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, whitespaceSharedStyles, paragraphSharedStyles(), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('editor_request_to_edit_task') ? null : css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n\t\t\t\t\tpointer-events: none;\n\t\t\t\t\topacity: 0.7;\n\t\t\t\t}\n\t\t\t"]))), fg('platform_editor_hide_cursor_when_pm_hideselection') ? css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, editorExperiment('platform_editor_advanced_code_blocks', true) ? css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", placeholderTextStyles, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(), codeMarkSharedStyles(), textColorStyles, backgroundColorStyles, listsStyles, ruleStyles, mediaStyles, fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, gapCursorStyles, panelStyles(), mentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
146
+ return css(_templateObject8 || (_templateObject8 = _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--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.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\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.ProseMirror {\n\t\toutline: none;\n\t\tfont-size: var(--ak-editor-base-font-size);\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\n\t\t", ";\n\t}\n\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 * 1. Merge and Release platform_editor_hide_cursor_when_pm_hideselection\n\t * 2. Cleanup duplicated style from platform_editor_advanced_code_blocks\n\t * https://product-fabric.atlassian.net/browse/ED-26331\n\t */\n\t", "\n\n\t/* This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24 */\n\t", "\n\n\t.ProseMirror-selectednode {\n\t\toutline: none;\n\t}\n\n\t.ProseMirror-selectednode:empty {\n\t\toutline: 2px 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\n\t", "\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n ", ";\n\n\t", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n // Switch between the two icons based on the visual refresh feature gate\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n\t", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\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\t// Related code all lives inside: packages/editor/editor-core/src/ui/Appearance/FullPage/StyledComponents.ts\n\t// In 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\tpadding: 0;\n\t}\n\n\t/* Legacy Link icon in the Atlaskit package\n\t is bigger than the others, new ADS icon does not have this issue\n */\n\t", "\n"])), akEditorGutterPadding, akEditorGutterPaddingDynamic(), akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorCalculatedWideLayoutWidthSmallViewport, akEditorBreakpointForSmallDevice, akEditorCalculatedWideLayoutWidth, whitespaceSharedStyles, paragraphSharedStyles(), listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, fg('editor_request_to_edit_task') ? null : css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n\t\t\t\t\tpointer-events: none;\n\t\t\t\t\topacity: 0.7;\n\t\t\t\t}\n\t\t\t"]))), fg('platform_editor_hide_cursor_when_pm_hideselection') ? css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, editorExperiment('platform_editor_advanced_code_blocks', true) ? css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n\t\t\t\t.ProseMirror-hideselection {\n\t\t\t\t\tcaret-color: transparent;\n\t\t\t\t}\n\t\t\t"]))) : null, "var(--ds-border-focused, #8cf)", placeholderTextStyles, placeholderStyles, editorExperiment('platform_editor_controls', 'variant1') ? placeholderOverflowStyles : null, editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_quick_insert_placeholder') ? placeholderWrapStyles : null, codeBlockStyles(), blocktypeStyles(), codeMarkStyles, textColorStyles, backgroundColorStyles, listsStyles, ruleStyles, mediaStyles, fg('confluence_team_presence_scroll_to_pointer') ? telepointerStyle : telepointerStyleWithInitialOnly, gapCursorStyles, panelStyles(), mentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
146
147
  exposure: false
147
148
  }) && vanillaMentionsStyles, editorExperiment('platform_editor_vanilla_dom', true, {
148
149
  exposure: false
package/dist/esm/ui/EditorContentContainer/styles/codeMarkStyles.js ADDED
@@ -0,0 +1,24 @@
1
+ import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
2
+
3
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
4
+ export var codeMarkStyles = css({
5
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
6
+ '.code': {
7
+ '--ds--code--bg-color': "var(--ds-background-neutral, #091E420F)",
8
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
9
+ display: 'inline',
10
+ padding: '2px 0.5ch',
11
+ backgroundColor: "var(--ds--code--bg-color,".concat("var(--ds-background-neutral, #091E420F)", ")"),
12
+ borderRadius: "var(--ds-border-radius, 3px)",
13
+ borderStyle: 'none',
14
+ boxDecorationBreak: 'clone',
15
+ color: "var(--ds-text, #172B4D)",
16
+ fontFamily: "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)",
17
+ // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
18
+ fontSize: '0.875em',
19
+ fontWeight: "var(--ds-font-weight-regular, 400)",
20
+ overflow: 'auto',
21
+ overflowWrap: 'break-word',
22
+ whiteSpace: 'pre-wrap'
23
+ }
24
+ });
package/dist/esm/version-wrapper.js CHANGED
@@ -1,2 +1,2 @@
1
1
  export var name = "@atlaskit/editor-core";
2
- export var version = "207.5.0";
2
+ export var version = "207.6.1";
package/dist/types/create-editor/create-universal-preset.d.ts CHANGED
@@ -351,10 +351,7 @@ export declare function createUniversalPreset({ props, prevProps, initialPluginC
351
351
  pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
352
352
  sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
353
353
  }, import("@atlaskit/editor-common/types").FeatureFlags>>, import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
354
- sharedState: {
355
- hasHadInteraction: boolean;
356
- interactionState: "hasNotHadInteraction" | null;
357
- };
354
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
358
355
  commands: {
359
356
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
360
357
  };
@@ -369,10 +366,7 @@ export declare function createUniversalPreset({ props, prevProps, initialPluginC
369
366
  pluginConfiguration: import("@atlaskit/editor-plugins/selection").SelectionPluginOptions | undefined;
370
367
  actions: import("@atlaskit/editor-plugins/selection").EditorSelectionAPI;
371
368
  dependencies: [import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
372
- sharedState: {
373
- hasHadInteraction: boolean;
374
- interactionState: "hasNotHadInteraction" | null;
375
- };
369
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
376
370
  commands: {
377
371
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
378
372
  };
@@ -1144,10 +1138,7 @@ export declare function createUniversalPreset({ props, prevProps, initialPluginC
1144
1138
  }, import("@atlaskit/editor-plugins/context-identifier").ContextIdentifierPluginOptions | undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"composition", {
1145
1139
  sharedState: import("@atlaskit/editor-plugins/composition").CompositionState;
1146
1140
  }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
1147
- sharedState: {
1148
- hasHadInteraction: boolean;
1149
- interactionState: "hasNotHadInteraction" | null;
1150
- };
1141
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
1151
1142
  commands: {
1152
1143
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
1153
1144
  };
package/dist/types/presets/universal.d.ts CHANGED
@@ -403,10 +403,7 @@ export default function createUniversalPresetInternal({ appearance, props, featu
403
403
  pluginConfiguration: FeatureFlags;
404
404
  sharedState: FeatureFlags;
405
405
  }, FeatureFlags>>, import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
406
- sharedState: {
407
- hasHadInteraction: boolean;
408
- interactionState: "hasNotHadInteraction" | null;
409
- };
406
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
410
407
  commands: {
411
408
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
412
409
  };
@@ -421,10 +418,7 @@ export default function createUniversalPresetInternal({ appearance, props, featu
421
418
  pluginConfiguration: import("@atlaskit/editor-plugins/selection").SelectionPluginOptions | undefined;
422
419
  actions: import("@atlaskit/editor-plugins/selection").EditorSelectionAPI;
423
420
  dependencies: [import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
424
- sharedState: {
425
- hasHadInteraction: boolean;
426
- interactionState: "hasNotHadInteraction" | null;
427
- };
421
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
428
422
  commands: {
429
423
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
430
424
  };
@@ -1196,10 +1190,7 @@ export default function createUniversalPresetInternal({ appearance, props, featu
1196
1190
  }, import("@atlaskit/editor-plugins/context-identifier").ContextIdentifierPluginOptions | undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"composition", {
1197
1191
  sharedState: import("@atlaskit/editor-plugins/composition").CompositionState;
1198
1192
  }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
1199
- sharedState: {
1200
- hasHadInteraction: boolean;
1201
- interactionState: "hasNotHadInteraction" | null;
1202
- };
1193
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
1203
1194
  commands: {
1204
1195
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
1205
1196
  };
package/dist/types/presets/useUniversalPreset.d.ts CHANGED
@@ -351,10 +351,7 @@ export default function useUniversalPreset({ props, initialPluginConfiguration }
351
351
  pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
352
352
  sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
353
353
  }, import("@atlaskit/editor-common/types").FeatureFlags>>, import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
354
- sharedState: {
355
- hasHadInteraction: boolean;
356
- interactionState: "hasNotHadInteraction" | null;
357
- };
354
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
358
355
  commands: {
359
356
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
360
357
  };
@@ -369,10 +366,7 @@ export default function useUniversalPreset({ props, initialPluginConfiguration }
369
366
  pluginConfiguration: import("@atlaskit/editor-plugins/selection").SelectionPluginOptions | undefined;
370
367
  actions: import("@atlaskit/editor-plugins/selection").EditorSelectionAPI;
371
368
  dependencies: [import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
372
- sharedState: {
373
- hasHadInteraction: boolean;
374
- interactionState: "hasNotHadInteraction" | null;
375
- };
369
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
376
370
  commands: {
377
371
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
378
372
  };
@@ -1144,10 +1138,7 @@ export default function useUniversalPreset({ props, initialPluginConfiguration }
1144
1138
  }, import("@atlaskit/editor-plugins/context-identifier").ContextIdentifierPluginOptions | undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"composition", {
1145
1139
  sharedState: import("@atlaskit/editor-plugins/composition").CompositionState;
1146
1140
  }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
1147
- sharedState: {
1148
- hasHadInteraction: boolean;
1149
- interactionState: "hasNotHadInteraction" | null;
1150
- };
1141
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
1151
1142
  commands: {
1152
1143
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
1153
1144
  };
package/dist/types/ui/Appearance/FullPage/FullPageContentArea.d.ts CHANGED
@@ -33,7 +33,7 @@ interface FullPageEditorContentAreaProps {
33
33
  popupsScrollableElement: HTMLElement | undefined;
34
34
  providerFactory: ProviderFactory;
35
35
  wrapperElement: HTMLElement | null;
36
- hasHadInteraction: boolean;
36
+ hasHadInteraction?: boolean;
37
37
  featureFlags?: FeatureFlags;
38
38
  viewMode: ViewMode | undefined;
39
39
  isEditorToolbarHidden?: boolean;
package/dist/types/ui/EditorContentContainer/styles/codeMarkStyles.d.ts ADDED
@@ -0,0 +1 @@
1
+ export declare const codeMarkStyles: import("@emotion/react").SerializedStyles;
package/dist/types-ts4.5/create-editor/create-universal-preset.d.ts CHANGED
@@ -496,10 +496,7 @@ export declare function createUniversalPreset({ props, prevProps, initialPluginC
496
496
  sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
497
497
  }, import("@atlaskit/editor-common/types").FeatureFlags>>,
498
498
  import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
499
- sharedState: {
500
- hasHadInteraction: boolean;
501
- interactionState: "hasNotHadInteraction" | null;
502
- };
499
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
503
500
  commands: {
504
501
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
505
502
  };
@@ -517,10 +514,7 @@ export declare function createUniversalPreset({ props, prevProps, initialPluginC
517
514
  actions: import("@atlaskit/editor-plugins/selection").EditorSelectionAPI;
518
515
  dependencies: [
519
516
  import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
520
- sharedState: {
521
- hasHadInteraction: boolean;
522
- interactionState: "hasNotHadInteraction" | null;
523
- };
517
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
524
518
  commands: {
525
519
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
526
520
  };
@@ -1431,10 +1425,7 @@ export declare function createUniversalPreset({ props, prevProps, initialPluginC
1431
1425
  sharedState: import("@atlaskit/editor-plugins/composition").CompositionState;
1432
1426
  }, undefined>,
1433
1427
  import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
1434
- sharedState: {
1435
- hasHadInteraction: boolean;
1436
- interactionState: "hasNotHadInteraction" | null;
1437
- };
1428
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
1438
1429
  commands: {
1439
1430
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
1440
1431
  };
package/dist/types-ts4.5/presets/universal.d.ts CHANGED
@@ -548,10 +548,7 @@ export default function createUniversalPresetInternal({ appearance, props, featu
548
548
  sharedState: FeatureFlags;
549
549
  }, FeatureFlags>>,
550
550
  import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
551
- sharedState: {
552
- hasHadInteraction: boolean;
553
- interactionState: "hasNotHadInteraction" | null;
554
- };
551
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
555
552
  commands: {
556
553
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
557
554
  };
@@ -569,10 +566,7 @@ export default function createUniversalPresetInternal({ appearance, props, featu
569
566
  actions: import("@atlaskit/editor-plugins/selection").EditorSelectionAPI;
570
567
  dependencies: [
571
568
  import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
572
- sharedState: {
573
- hasHadInteraction: boolean;
574
- interactionState: "hasNotHadInteraction" | null;
575
- };
569
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
576
570
  commands: {
577
571
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
578
572
  };
@@ -1483,10 +1477,7 @@ export default function createUniversalPresetInternal({ appearance, props, featu
1483
1477
  sharedState: import("@atlaskit/editor-plugins/composition").CompositionState;
1484
1478
  }, undefined>,
1485
1479
  import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
1486
- sharedState: {
1487
- hasHadInteraction: boolean;
1488
- interactionState: "hasNotHadInteraction" | null;
1489
- };
1480
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
1490
1481
  commands: {
1491
1482
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
1492
1483
  };
package/dist/types-ts4.5/presets/useUniversalPreset.d.ts CHANGED
@@ -496,10 +496,7 @@ export default function useUniversalPreset({ props, initialPluginConfiguration }
496
496
  sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
497
497
  }, import("@atlaskit/editor-common/types").FeatureFlags>>,
498
498
  import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
499
- sharedState: {
500
- hasHadInteraction: boolean;
501
- interactionState: "hasNotHadInteraction" | null;
502
- };
499
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
503
500
  commands: {
504
501
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
505
502
  };
@@ -517,10 +514,7 @@ export default function useUniversalPreset({ props, initialPluginConfiguration }
517
514
  actions: import("@atlaskit/editor-plugins/selection").EditorSelectionAPI;
518
515
  dependencies: [
519
516
  import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
520
- sharedState: {
521
- hasHadInteraction: boolean;
522
- interactionState: "hasNotHadInteraction" | null;
523
- };
517
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
524
518
  commands: {
525
519
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
526
520
  };
@@ -1431,10 +1425,7 @@ export default function useUniversalPreset({ props, initialPluginConfiguration }
1431
1425
  sharedState: import("@atlaskit/editor-plugins/composition").CompositionState;
1432
1426
  }, undefined>,
1433
1427
  import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"interaction", {
1434
- sharedState: {
1435
- hasHadInteraction: boolean;
1436
- interactionState: "hasNotHadInteraction" | null;
1437
- };
1428
+ sharedState: import("@atlaskit/editor-plugins/interaction").SharedInteractionState;
1438
1429
  commands: {
1439
1430
  handleInteraction: import("@atlaskit/editor-common/types").EditorCommand;
1440
1431
  };
package/dist/types-ts4.5/ui/Appearance/FullPage/FullPageContentArea.d.ts CHANGED
@@ -35,7 +35,7 @@ interface FullPageEditorContentAreaProps {
35
35
  popupsScrollableElement: HTMLElement | undefined;
36
36
  providerFactory: ProviderFactory;
37
37
  wrapperElement: HTMLElement | null;
38
- hasHadInteraction: boolean;
38
+ hasHadInteraction?: boolean;
39
39
  featureFlags?: FeatureFlags;
40
40
  viewMode: ViewMode | undefined;
41
41
  isEditorToolbarHidden?: boolean;
package/dist/types-ts4.5/ui/EditorContentContainer/styles/codeMarkStyles.d.ts ADDED
@@ -0,0 +1 @@
1
+ export declare const codeMarkStyles: import("@emotion/react").SerializedStyles;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-core",
3
- "version": "207.5.0",
3
+ "version": "207.6.1",
4
4
  "description": "A package contains Atlassian editor core functionality",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -46,7 +46,7 @@
46
46
  "@atlaskit/analytics-next-stable-react-context": "1.0.1",
47
47
  "@atlaskit/button": "^23.2.0",
48
48
  "@atlaskit/css": "^0.10.0",
49
- "@atlaskit/editor-common": "^105.8.0",
49
+ "@atlaskit/editor-common": "^105.9.0",
50
50
  "@atlaskit/editor-json-transformer": "^8.24.0",
51
51
  "@atlaskit/editor-performance-metrics": "^2.1.0",
52
52
  "@atlaskit/editor-plugin-quick-insert": "^2.5.0",
@@ -54,7 +54,7 @@
54
54
  "@atlaskit/editor-prosemirror": "7.0.0",
55
55
  "@atlaskit/editor-shared-styles": "^3.4.0",
56
56
  "@atlaskit/emoji": "^69.2.0",
57
- "@atlaskit/icon": "^26.1.0",
57
+ "@atlaskit/icon": "^26.2.0",
58
58
  "@atlaskit/link": "^3.2.0",
59
59
  "@atlaskit/media-card": "^79.3.0",
60
60
  "@atlaskit/mention": "^24.2.0",
@@ -62,7 +62,7 @@
62
62
  "@atlaskit/platform-feature-flags-react": "^0.2.0",
63
63
  "@atlaskit/react-ufo": "^3.13.0",
64
64
  "@atlaskit/task-decision": "^19.2.0",
65
- "@atlaskit/tmp-editor-statsig": "^4.24.0",
65
+ "@atlaskit/tmp-editor-statsig": "^4.25.0",
66
66
  "@atlaskit/tokens": "^4.9.0",
67
67
  "@atlaskit/tooltip": "^20.0.0",
68
68
  "@atlaskit/width-detector": "^5.0.0",
@@ -88,9 +88,9 @@
88
88
  "devDependencies": {
89
89
  "@af/editor-libra": "workspace:^",
90
90
  "@af/visual-regression": "workspace:^",
91
- "@atlaskit/adf-utils": "^19.19.0",
91
+ "@atlaskit/adf-utils": "^19.20.0",
92
92
  "@atlaskit/analytics-listeners": "^9.0.0",
93
- "@atlaskit/collab-provider": "^10.15.0",
93
+ "@atlaskit/collab-provider": "^10.16.0",
94
94
  "@atlaskit/editor-plugin-annotation": "^2.8.0",
95
95
  "@atlaskit/editor-plugin-card": "^6.3.0",
96
96
  "@atlaskit/editor-plugin-list": "^4.2.0",
@@ -102,7 +102,7 @@
102
102
  "@atlaskit/media-test-helpers": "^36.0.0",
103
103
  "@atlaskit/modal-dialog": "^14.2.0",
104
104
  "@atlaskit/primitives": "^14.8.0",
105
- "@atlaskit/renderer": "^118.2.0",
105
+ "@atlaskit/renderer": "^118.3.0",
106
106
  "@atlaskit/smart-card": "^38.5.0",
107
107
  "@atlaskit/synchrony-test-helpers": "workspace:^",
108
108
  "@atlaskit/toggle": "^15.0.0",