@atlaskit/editor-core 190.1.15 → 190.1.16

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 (65) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/afm-cc/tsconfig.json +3 -0
  3. package/dist/cjs/plugins/index.js +0 -7
  4. package/dist/cjs/presets/universal.js +2 -1
  5. package/dist/cjs/version-wrapper.js +1 -1
  6. package/dist/es2019/plugins/index.js +0 -1
  7. package/dist/es2019/presets/universal.js +2 -1
  8. package/dist/es2019/version-wrapper.js +1 -1
  9. package/dist/esm/plugins/index.js +0 -1
  10. package/dist/esm/presets/universal.js +2 -1
  11. package/dist/esm/version-wrapper.js +1 -1
  12. package/dist/types/plugins/index.d.ts +0 -1
  13. package/dist/types-ts4.5/plugins/index.d.ts +0 -1
  14. package/package.json +2 -1
  15. package/tsconfig.json +1 -1
  16. package/dist/cjs/plugins/breakout/commands/remove-breakout.js +0 -30
  17. package/dist/cjs/plugins/breakout/commands/set-breakout-mode.js +0 -29
  18. package/dist/cjs/plugins/breakout/index.js +0 -218
  19. package/dist/cjs/plugins/breakout/plugin-key.js +0 -11
  20. package/dist/cjs/plugins/breakout/types.js +0 -5
  21. package/dist/cjs/plugins/breakout/ui/LayoutButton.js +0 -133
  22. package/dist/cjs/plugins/breakout/utils/find-breakout-node.js +0 -42
  23. package/dist/cjs/plugins/breakout/utils/get-breakout-mode.js +0 -24
  24. package/dist/cjs/plugins/breakout/utils/is-breakout-mark-allowed.js +0 -27
  25. package/dist/cjs/plugins/breakout/utils/is-supported-node.js +0 -15
  26. package/dist/es2019/plugins/breakout/commands/remove-breakout.js +0 -22
  27. package/dist/es2019/plugins/breakout/commands/set-breakout-mode.js +0 -23
  28. package/dist/es2019/plugins/breakout/index.js +0 -208
  29. package/dist/es2019/plugins/breakout/plugin-key.js +0 -3
  30. package/dist/es2019/plugins/breakout/types.js +0 -1
  31. package/dist/es2019/plugins/breakout/ui/LayoutButton.js +0 -117
  32. package/dist/es2019/plugins/breakout/utils/find-breakout-node.js +0 -37
  33. package/dist/es2019/plugins/breakout/utils/get-breakout-mode.js +0 -16
  34. package/dist/es2019/plugins/breakout/utils/is-breakout-mark-allowed.js +0 -22
  35. package/dist/es2019/plugins/breakout/utils/is-supported-node.js +0 -9
  36. package/dist/esm/plugins/breakout/commands/remove-breakout.js +0 -24
  37. package/dist/esm/plugins/breakout/commands/set-breakout-mode.js +0 -23
  38. package/dist/esm/plugins/breakout/index.js +0 -211
  39. package/dist/esm/plugins/breakout/plugin-key.js +0 -5
  40. package/dist/esm/plugins/breakout/types.js +0 -1
  41. package/dist/esm/plugins/breakout/ui/LayoutButton.js +0 -126
  42. package/dist/esm/plugins/breakout/utils/find-breakout-node.js +0 -37
  43. package/dist/esm/plugins/breakout/utils/get-breakout-mode.js +0 -18
  44. package/dist/esm/plugins/breakout/utils/is-breakout-mark-allowed.js +0 -22
  45. package/dist/esm/plugins/breakout/utils/is-supported-node.js +0 -9
  46. package/dist/types/plugins/breakout/commands/remove-breakout.d.ts +0 -2
  47. package/dist/types/plugins/breakout/commands/set-breakout-mode.d.ts +0 -3
  48. package/dist/types/plugins/breakout/index.d.ts +0 -12
  49. package/dist/types/plugins/breakout/plugin-key.d.ts +0 -5
  50. package/dist/types/plugins/breakout/types.d.ts +0 -4
  51. package/dist/types/plugins/breakout/ui/LayoutButton.d.ts +0 -17
  52. package/dist/types/plugins/breakout/utils/find-breakout-node.d.ts +0 -9
  53. package/dist/types/plugins/breakout/utils/get-breakout-mode.d.ts +0 -7
  54. package/dist/types/plugins/breakout/utils/is-breakout-mark-allowed.d.ts +0 -9
  55. package/dist/types/plugins/breakout/utils/is-supported-node.d.ts +0 -6
  56. package/dist/types-ts4.5/plugins/breakout/commands/remove-breakout.d.ts +0 -2
  57. package/dist/types-ts4.5/plugins/breakout/commands/set-breakout-mode.d.ts +0 -3
  58. package/dist/types-ts4.5/plugins/breakout/index.d.ts +0 -14
  59. package/dist/types-ts4.5/plugins/breakout/plugin-key.d.ts +0 -5
  60. package/dist/types-ts4.5/plugins/breakout/types.d.ts +0 -4
  61. package/dist/types-ts4.5/plugins/breakout/ui/LayoutButton.d.ts +0 -17
  62. package/dist/types-ts4.5/plugins/breakout/utils/find-breakout-node.d.ts +0 -9
  63. package/dist/types-ts4.5/plugins/breakout/utils/get-breakout-mode.d.ts +0 -7
  64. package/dist/types-ts4.5/plugins/breakout/utils/is-breakout-mark-allowed.d.ts +0 -9
  65. package/dist/types-ts4.5/plugins/breakout/utils/is-supported-node.d.ts +0 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/editor-core
2
2
 
3
+ ## 190.1.16
4
+
5
+ ### Patch Changes
6
+
7
+ - [#62880](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/62880) [`a23ec26652ea`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a23ec26652ea) - Extracting breakout plugin from editor-core into new package @atlaskit/editor-plugin-breakout
8
+ - Updated dependencies
9
+
3
10
  ## 190.1.15
4
11
 
5
12
  ### Patch Changes
@@ -76,6 +76,9 @@
76
76
  {
77
77
  "path": "../../editor-plugin-border/afm-cc/tsconfig.json"
78
78
  },
79
+ {
80
+ "path": "../../editor-plugin-breakout/afm-cc/tsconfig.json"
81
+ },
79
82
  {
80
83
  "path": "../../editor-plugin-caption/afm-cc/tsconfig.json"
81
84
  },
@@ -22,12 +22,6 @@ Object.defineProperty(exports, "beforePrimaryToolbarPlugin", {
22
22
  return _beforePrimaryToolbar.default;
23
23
  }
24
24
  });
25
- Object.defineProperty(exports, "breakoutPlugin", {
26
- enumerable: true,
27
- get: function get() {
28
- return _breakout.default;
29
- }
30
- });
31
25
  Object.defineProperty(exports, "collabEditPlugin", {
32
26
  enumerable: true,
33
27
  get: function get() {
@@ -68,7 +62,6 @@ var _collabEdit = _interopRequireDefault(require("./collab-edit"));
68
62
  var _extension = _interopRequireDefault(require("./extension"));
69
63
  var _jiraIssue = _interopRequireDefault(require("./jira-issue"));
70
64
  var _paste = _interopRequireDefault(require("./paste"));
71
- var _breakout = _interopRequireDefault(require("./breakout"));
72
65
  var _annotation = _interopRequireDefault(require("./annotation"));
73
66
  var _feedbackDialog = _interopRequireDefault(require("./feedback-dialog"));
74
67
  var _findReplace = _interopRequireDefault(require("./find-replace"));
@@ -36,6 +36,7 @@ var _editorPluginPasteOptionsToolbar = require("@atlaskit/editor-plugin-paste-op
36
36
  var _editorPluginPlaceholderText = require("@atlaskit/editor-plugin-placeholder-text");
37
37
  var _editorPluginRule = require("@atlaskit/editor-plugin-rule");
38
38
  var _editorPluginSaveOnEnter = require("@atlaskit/editor-plugin-save-on-enter");
39
+ var _editorPluginBreakout = require("@atlaskit/editor-plugin-breakout");
39
40
  var _editorPluginScrollIntoView = require("@atlaskit/editor-plugin-scroll-into-view");
40
41
  var _editorPluginStatus = require("@atlaskit/editor-plugin-status");
41
42
  var _editorPluginTable = require("@atlaskit/editor-plugin-table");
@@ -81,7 +82,7 @@ function createUniversalPreset(appearance, props, featureFlags, prevAppearance,
81
82
  }
82
83
  return false;
83
84
  };
84
- var finalPreset = defaultPreset.add(_editorPluginDataConsumer.dataConsumerPlugin).add(_editorPluginContentInsertion.contentInsertionPlugin).maybeAdd(_plugins.breakoutPlugin, function (plugin, builder) {
85
+ var finalPreset = defaultPreset.add(_editorPluginDataConsumer.dataConsumerPlugin).add(_editorPluginContentInsertion.contentInsertionPlugin).maybeAdd(_editorPluginBreakout.breakoutPlugin, function (plugin, builder) {
85
86
  if (props.allowBreakout && isFullPage) {
86
87
  return builder.add([plugin, {
87
88
  allowBreakoutButton: appearance === 'full-page'
@@ -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 = "190.1.15";
8
+ var version = exports.version = "190.1.16";
@@ -2,7 +2,6 @@ export { default as collabEditPlugin } from './collab-edit';
2
2
  export { default as extensionPlugin } from './extension';
3
3
  export { default as jiraIssuePlugin } from './jira-issue';
4
4
  export { default as pastePlugin } from './paste';
5
- export { default as breakoutPlugin } from './breakout';
6
5
  export { default as annotationPlugin } from './annotation';
7
6
  export { default as feedbackDialogPlugin } from './feedback-dialog';
8
7
  export { default as findReplacePlugin } from './find-replace';
@@ -26,6 +26,7 @@ import { pasteOptionsToolbarPlugin } from '@atlaskit/editor-plugin-paste-options
26
26
  import { placeholderTextPlugin } from '@atlaskit/editor-plugin-placeholder-text';
27
27
  import { rulePlugin } from '@atlaskit/editor-plugin-rule';
28
28
  import { saveOnEnterPlugin } from '@atlaskit/editor-plugin-save-on-enter';
29
+ import { breakoutPlugin } from '@atlaskit/editor-plugin-breakout';
29
30
  import { scrollIntoViewPlugin } from '@atlaskit/editor-plugin-scroll-into-view';
30
31
  import { statusPlugin } from '@atlaskit/editor-plugin-status';
31
32
  import { tablesPlugin } from '@atlaskit/editor-plugin-table';
@@ -36,7 +37,7 @@ import { customAutoformatPlugin } from '@atlaskit/editor-plugin-custom-autoforma
36
37
  import { alignmentPlugin } from '@atlaskit/editor-plugin-alignment';
37
38
  import { dataConsumerPlugin } from '@atlaskit/editor-plugin-data-consumer';
38
39
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
39
- import { annotationPlugin, avatarGroupPlugin, beforePrimaryToolbarPlugin, breakoutPlugin, collabEditPlugin, extensionPlugin, feedbackDialogPlugin, findReplacePlugin, jiraIssuePlugin } from '../plugins';
40
+ import { annotationPlugin, avatarGroupPlugin, beforePrimaryToolbarPlugin, collabEditPlugin, extensionPlugin, feedbackDialogPlugin, findReplacePlugin, jiraIssuePlugin } from '../plugins';
40
41
  import { shouldForceTracking } from '@atlaskit/editor-common/utils';
41
42
  import { isFullPage as fullPageCheck } from '../utils/is-full-page';
42
43
  import { createDefaultPreset } from './default';
@@ -1,2 +1,2 @@
1
1
  export const name = "@atlaskit/editor-core";
2
- export const version = "190.1.15";
2
+ export const version = "190.1.16";
@@ -2,7 +2,6 @@ export { default as collabEditPlugin } from './collab-edit';
2
2
  export { default as extensionPlugin } from './extension';
3
3
  export { default as jiraIssuePlugin } from './jira-issue';
4
4
  export { default as pastePlugin } from './paste';
5
- export { default as breakoutPlugin } from './breakout';
6
5
  export { default as annotationPlugin } from './annotation';
7
6
  export { default as feedbackDialogPlugin } from './feedback-dialog';
8
7
  export { default as findReplacePlugin } from './find-replace';
@@ -30,6 +30,7 @@ import { pasteOptionsToolbarPlugin } from '@atlaskit/editor-plugin-paste-options
30
30
  import { placeholderTextPlugin } from '@atlaskit/editor-plugin-placeholder-text';
31
31
  import { rulePlugin } from '@atlaskit/editor-plugin-rule';
32
32
  import { saveOnEnterPlugin } from '@atlaskit/editor-plugin-save-on-enter';
33
+ import { breakoutPlugin } from '@atlaskit/editor-plugin-breakout';
33
34
  import { scrollIntoViewPlugin } from '@atlaskit/editor-plugin-scroll-into-view';
34
35
  import { statusPlugin } from '@atlaskit/editor-plugin-status';
35
36
  import { tablesPlugin } from '@atlaskit/editor-plugin-table';
@@ -40,7 +41,7 @@ import { customAutoformatPlugin } from '@atlaskit/editor-plugin-custom-autoforma
40
41
  import { alignmentPlugin } from '@atlaskit/editor-plugin-alignment';
41
42
  import { dataConsumerPlugin } from '@atlaskit/editor-plugin-data-consumer';
42
43
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
43
- import { annotationPlugin, avatarGroupPlugin, beforePrimaryToolbarPlugin, breakoutPlugin, collabEditPlugin, extensionPlugin, feedbackDialogPlugin, findReplacePlugin, jiraIssuePlugin } from '../plugins';
44
+ import { annotationPlugin, avatarGroupPlugin, beforePrimaryToolbarPlugin, collabEditPlugin, extensionPlugin, feedbackDialogPlugin, findReplacePlugin, jiraIssuePlugin } from '../plugins';
44
45
  import { shouldForceTracking } from '@atlaskit/editor-common/utils';
45
46
  import { isFullPage as fullPageCheck } from '../utils/is-full-page';
46
47
  import { createDefaultPreset } from './default';
@@ -1,2 +1,2 @@
1
1
  export var name = "@atlaskit/editor-core";
2
- export var version = "190.1.15";
2
+ export var version = "190.1.16";
@@ -2,7 +2,6 @@ export { default as collabEditPlugin } from './collab-edit';
2
2
  export { default as extensionPlugin } from './extension';
3
3
  export { default as jiraIssuePlugin } from './jira-issue';
4
4
  export { default as pastePlugin } from './paste';
5
- export { default as breakoutPlugin } from './breakout';
6
5
  export { default as annotationPlugin } from './annotation';
7
6
  export { default as feedbackDialogPlugin } from './feedback-dialog';
8
7
  export { default as findReplacePlugin } from './find-replace';
@@ -2,7 +2,6 @@ export { default as collabEditPlugin } from './collab-edit';
2
2
  export { default as extensionPlugin } from './extension';
3
3
  export { default as jiraIssuePlugin } from './jira-issue';
4
4
  export { default as pastePlugin } from './paste';
5
- export { default as breakoutPlugin } from './breakout';
6
5
  export { default as annotationPlugin } from './annotation';
7
6
  export { default as feedbackDialogPlugin } from './feedback-dialog';
8
7
  export { default as findReplacePlugin } from './find-replace';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-core",
3
- "version": "190.1.15",
3
+ "version": "190.1.16",
4
4
  "description": "A package contains Atlassian editor core functionality",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -60,6 +60,7 @@
60
60
  "@atlaskit/editor-plugin-better-type-history": "^0.1.0",
61
61
  "@atlaskit/editor-plugin-block-type": "^3.0.0",
62
62
  "@atlaskit/editor-plugin-border": "^0.1.0",
63
+ "@atlaskit/editor-plugin-breakout": "^0.1.0",
63
64
  "@atlaskit/editor-plugin-caption": "^0.2.0",
64
65
  "@atlaskit/editor-plugin-card": "^0.14.0",
65
66
  "@atlaskit/editor-plugin-clear-marks-on-empty-doc": "^0.1.0",
package/tsconfig.json CHANGED
@@ -10,7 +10,7 @@
10
10
  "./example-helpers/**/*.ts",
11
11
  "./example-helpers/**/*.tsx",
12
12
  "./playwright/**/*.ts"
13
- , "../editor-plugin-data-consumer/src/index.tsx", "../editor-plugin-undo-redo/src/types.ts", "../editor-plugin-undo-redo/src/attach-input-meta.ts", "../editor-plugin-undo-redo/src/commands.ts", "../editor-plugin-undo-redo/src/enums.ts", "../editor-plugin-undo-redo/src/index.tsx" ],
13
+ ],
14
14
  "compilerOptions": {
15
15
  "baseUrl": "./"
16
16
  }
@@ -1,30 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.removeBreakout = removeBreakout;
7
- var _findBreakoutNode = require("../utils/find-breakout-node");
8
- var _state = require("@atlaskit/editor-prosemirror/state");
9
- function removeBreakout() {
10
- return function (state, dispatch) {
11
- var node = (0, _findBreakoutNode.findSupportedNodeForBreakout)(state.selection);
12
- if (!node) {
13
- return false;
14
- }
15
- var marks = node.node.marks.filter(function (m) {
16
- return m.type.name !== 'breakout';
17
- });
18
- var tr = state.tr.setNodeMarkup(node.pos, node.node.type, node.node.attrs, marks);
19
- tr.setMeta('scrollIntoView', false);
20
- if (state.selection instanceof _state.NodeSelection) {
21
- if (state.selection.$anchor.pos === node.pos) {
22
- tr.setSelection(_state.NodeSelection.create(tr.doc, node.pos));
23
- }
24
- }
25
- if (dispatch) {
26
- dispatch(tr);
27
- }
28
- return true;
29
- };
30
- }
@@ -1,29 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.setBreakoutMode = setBreakoutMode;
7
- var _findBreakoutNode = require("../utils/find-breakout-node");
8
- var _state = require("@atlaskit/editor-prosemirror/state");
9
- function setBreakoutMode(mode) {
10
- return function (state, dispatch) {
11
- var node = (0, _findBreakoutNode.findSupportedNodeForBreakout)(state.selection);
12
- if (!node) {
13
- return false;
14
- }
15
- var tr = state.tr.setNodeMarkup(node.pos, node.node.type, node.node.attrs, [state.schema.marks.breakout.create({
16
- mode: mode
17
- })]);
18
- tr.setMeta('scrollIntoView', false);
19
- if (state.selection instanceof _state.NodeSelection) {
20
- if (state.selection.$anchor.pos === node.pos) {
21
- tr.setSelection(_state.NodeSelection.create(tr.doc, node.pos));
22
- }
23
- }
24
- if (dispatch) {
25
- dispatch(tr);
26
- }
27
- return true;
28
- };
29
- }
@@ -1,218 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
9
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
10
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
- var _react = _interopRequireDefault(require("react"));
12
- var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
13
- var _adfSchema = require("@atlaskit/adf-schema");
14
- var _utils = require("@atlaskit/editor-common/utils");
15
- var _LayoutButton = _interopRequireDefault(require("./ui/LayoutButton"));
16
- var _pluginKey = require("./plugin-key");
17
- var _findBreakoutNode = require("./utils/find-breakout-node");
18
- var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
19
- var _styles = require("@atlaskit/editor-common/styles");
20
- var _hooks = require("@atlaskit/editor-common/hooks");
21
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
22
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
23
- var BreakoutView = /*#__PURE__*/function () {
24
- function BreakoutView(
25
- /**
26
- * Note: this is actually a PMMark -- however our version
27
- * of the prosemirror and prosemirror types mean using PMNode
28
- * is not problematic.
29
- */
30
- mark, view, pluginInjectionApi) {
31
- var _this = this;
32
- (0, _classCallCheck2.default)(this, BreakoutView);
33
- (0, _defineProperty2.default)(this, "updateWidth", function (widthState) {
34
- // we skip updating the width of breakout nodes if the editorView dom
35
- // element was hidden (to avoid breakout width and button thrashing
36
- // when an editor is hidden, re-rendered and unhidden).
37
- if (widthState === undefined || widthState.width === 0) {
38
- return;
39
- }
40
- var containerStyle = "";
41
- var contentStyle = "";
42
- var breakoutWidthPx = (0, _utils.calcBreakoutWidthPx)(_this.mark.attrs.mode, widthState.width);
43
- if (widthState.lineLength) {
44
- if (breakoutWidthPx < widthState.lineLength) {
45
- breakoutWidthPx = widthState.lineLength;
46
- }
47
- containerStyle += "\n transform: none;\n display: flex;\n justify-content: center;\n ";
48
-
49
- // There is a delay in the animation because widthState is delayed.
50
- // When the editor goes full width the animation for the editor
51
- // begins and finishes before widthState can update the new dimensions.
52
- contentStyle += "\n min-width: ".concat(breakoutWidthPx, "px;\n transition: min-width 0.5s ").concat(_editorSharedStyles.akEditorSwoopCubicBezier, ";\n ");
53
- } else {
54
- // fallback method
55
- // (lineLength is not normally undefined, but might be in e.g. SSR or initial render)
56
- //
57
- // this approach doesn't work well with position: fixed, so
58
- // it breaks things like sticky headers
59
- containerStyle += "width: ".concat(breakoutWidthPx, "px; transform: translateX(-50%); margin-left: 50%;");
60
- }
61
-
62
- // NOTE: This is a hack to ignore mutation since mark NodeView doesn't support
63
- // `ignoreMutation` life-cycle event. @see ED-9947
64
- var viewDomObserver = _this.view.domObserver;
65
- if (viewDomObserver && _this.view.dom) {
66
- viewDomObserver.stop();
67
- setTimeout(function () {
68
- viewDomObserver.start();
69
- }, 0);
70
- }
71
- if (typeof _this.dom.style.cssText !== 'undefined') {
72
- _this.dom.style.cssText = containerStyle;
73
- _this.contentDOM.style.cssText = contentStyle;
74
- } else {
75
- _this.dom.setAttribute('style', containerStyle);
76
- _this.contentDOM.setAttribute('style', contentStyle);
77
- }
78
- });
79
- var contentDOM = document.createElement('div');
80
- contentDOM.className = _styles.BreakoutCssClassName.BREAKOUT_MARK_DOM;
81
- var dom = document.createElement('div');
82
- dom.className = _styles.BreakoutCssClassName.BREAKOUT_MARK;
83
- dom.setAttribute('data-layout', mark.attrs.mode);
84
- dom.appendChild(contentDOM);
85
- this.dom = dom;
86
- this.mark = mark;
87
- this.view = view;
88
- this.contentDOM = contentDOM;
89
- this.unsubscribe = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.width.sharedState.onChange(function (_ref) {
90
- var nextSharedState = _ref.nextSharedState;
91
- return _this.updateWidth(nextSharedState);
92
- });
93
- this.updateWidth(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.width.sharedState.currentState());
94
- }
95
- (0, _createClass2.default)(BreakoutView, [{
96
- key: "destroy",
97
- value:
98
- // NOTE: Lifecycle events doesn't work for mark NodeView. So currently this is a no-op.
99
- // @see https://github.com/ProseMirror/prosemirror/issues/1082
100
- function destroy() {
101
- var _this$unsubscribe;
102
- (_this$unsubscribe = this.unsubscribe) === null || _this$unsubscribe === void 0 || _this$unsubscribe.call(this);
103
- }
104
- }]);
105
- return BreakoutView;
106
- }();
107
- function shouldPluginStateUpdate(newBreakoutNode, currentBreakoutNode) {
108
- if (newBreakoutNode && currentBreakoutNode) {
109
- return newBreakoutNode !== currentBreakoutNode;
110
- }
111
- return newBreakoutNode || currentBreakoutNode ? true : false;
112
- }
113
- function createPlugin(pluginInjectionApi, _ref2) {
114
- var dispatch = _ref2.dispatch;
115
- return new _safePlugin.SafePlugin({
116
- state: {
117
- init: function init() {
118
- return {
119
- breakoutNode: undefined
120
- };
121
- },
122
- apply: function apply(tr, pluginState) {
123
- var breakoutNode = (0, _findBreakoutNode.findSupportedNodeForBreakout)(tr.selection);
124
- if (shouldPluginStateUpdate(breakoutNode, pluginState.breakoutNode)) {
125
- var nextPluginState = _objectSpread(_objectSpread({}, pluginState), {}, {
126
- breakoutNode: breakoutNode
127
- });
128
- dispatch(_pluginKey.pluginKey, nextPluginState);
129
- return nextPluginState;
130
- }
131
- return pluginState;
132
- }
133
- },
134
- key: _pluginKey.pluginKey,
135
- props: {
136
- nodeViews: {
137
- // Note: When we upgrade to prosemirror 1.27.2 -- we should
138
- // move this to markViews.
139
- // See the following link for more details:
140
- // https://prosemirror.net/docs/ref/#view.EditorProps.nodeViews.
141
- breakout: function breakout(mark, view) {
142
- return new BreakoutView(mark, view, pluginInjectionApi);
143
- }
144
- }
145
- }
146
- });
147
- }
148
- var LayoutButtonWrapper = function LayoutButtonWrapper(_ref3) {
149
- var _breakoutState$breako, _breakoutState$breako2;
150
- var api = _ref3.api,
151
- editorView = _ref3.editorView,
152
- boundariesElement = _ref3.boundariesElement,
153
- scrollableElement = _ref3.scrollableElement,
154
- mountPoint = _ref3.mountPoint;
155
- // Re-render with `width` (but don't use state) due to https://bitbucket.org/atlassian/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/24272
156
- var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['width', 'breakout']),
157
- breakoutState = _useSharedPluginState.breakoutState;
158
- return /*#__PURE__*/_react.default.createElement(_LayoutButton.default, {
159
- editorView: editorView,
160
- mountPoint: mountPoint,
161
- boundariesElement: boundariesElement,
162
- scrollableElement: scrollableElement,
163
- node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 || (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
164
- });
165
- };
166
- var breakoutPlugin = function breakoutPlugin(_ref4) {
167
- var options = _ref4.config,
168
- api = _ref4.api;
169
- return {
170
- name: 'breakout',
171
- pmPlugins: function pmPlugins() {
172
- return [{
173
- name: 'breakout',
174
- plugin: function plugin(props) {
175
- return createPlugin(api, props);
176
- }
177
- }];
178
- },
179
- marks: function marks() {
180
- return [{
181
- name: 'breakout',
182
- mark: _adfSchema.breakout
183
- }];
184
- },
185
- getSharedState: function getSharedState(editorState) {
186
- if (!editorState) {
187
- return {
188
- breakoutNode: undefined
189
- };
190
- }
191
- var pluginState = _pluginKey.pluginKey.getState(editorState);
192
- if (!pluginState) {
193
- return {
194
- breakoutNode: undefined
195
- };
196
- }
197
- return pluginState;
198
- },
199
- contentComponent: function contentComponent(_ref5) {
200
- var editorView = _ref5.editorView,
201
- popupsMountPoint = _ref5.popupsMountPoint,
202
- popupsBoundariesElement = _ref5.popupsBoundariesElement,
203
- popupsScrollableElement = _ref5.popupsScrollableElement;
204
- // This is a bit crappy, but should be resolved once we move to a static schema.
205
- if (options && !options.allowBreakoutButton) {
206
- return null;
207
- }
208
- return /*#__PURE__*/_react.default.createElement(LayoutButtonWrapper, {
209
- api: api,
210
- mountPoint: popupsMountPoint,
211
- editorView: editorView,
212
- boundariesElement: popupsBoundariesElement,
213
- scrollableElement: popupsScrollableElement
214
- });
215
- }
216
- };
217
- };
218
- var _default = exports.default = breakoutPlugin;
@@ -1,11 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.pluginKey = exports.getPluginState = void 0;
7
- var _state = require("@atlaskit/editor-prosemirror/state");
8
- var pluginKey = exports.pluginKey = new _state.PluginKey('breakoutPlugin');
9
- var getPluginState = exports.getPluginState = function getPluginState(state) {
10
- return pluginKey.getState(state) || undefined;
11
- };
@@ -1,5 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
@@ -1,133 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
9
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
10
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
11
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
12
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
13
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
14
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
16
- var _react = _interopRequireDefault(require("react"));
17
- var _react2 = require("@emotion/react");
18
- var _colors = require("@atlaskit/theme/colors");
19
- var _reactIntlNext = require("react-intl-next");
20
- var _utils = require("@atlaskit/editor-prosemirror/utils");
21
- var _ui = require("@atlaskit/editor-common/ui");
22
- var _collapse = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/collapse"));
23
- var _expand = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/expand"));
24
- var _ToolbarButton = _interopRequireDefault(require("../../../ui/ToolbarButton"));
25
- var _getBreakoutMode = require("../utils/get-breakout-mode");
26
- var _setBreakoutMode = require("../commands/set-breakout-mode");
27
- var _removeBreakout = require("../commands/remove-breakout");
28
- var _styles = require("@atlaskit/editor-common/styles");
29
- var _isBreakoutMarkAllowed = require("../utils/is-breakout-mark-allowed");
30
- var _pluginKey = require("../plugin-key");
31
- var _state = require("@atlaskit/editor-prosemirror/state");
32
- var _isSupportedNode = require("../utils/is-supported-node");
33
- var _constants = require("@atlaskit/theme/constants");
34
- var _utils2 = require("@atlaskit/editor-common/utils");
35
- var _templateObject;
36
- /** @jsx jsx */
37
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
38
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
39
- var toolbarButtonWrapper = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n && button {\n background: ", ";\n color: ", ";\n :hover {\n background: ", ";\n color: ", " !important;\n }\n }\n"])), "var(--ds-background-neutral, ".concat(_colors.N20A, ")"), "var(--ds-icon, ".concat(_colors.N300, ")"), "var(--ds-background-neutral-hovered, ".concat(_colors.B300, ")"), "var(--ds-icon, white)");
40
- function getBreakoutNodeElement(pluginState, selection, editorView) {
41
- if (!pluginState.breakoutNode) {
42
- return undefined;
43
- }
44
- if (selection instanceof _state.NodeSelection && (0, _isSupportedNode.isSupportedNodeForBreakout)(selection.node)) {
45
- return (0, _utils.findDomRefAtPos)(selection.from, editorView.domAtPos.bind(editorView));
46
- }
47
- return (0, _utils.findParentDomRefOfType)(pluginState.breakoutNode.node.type, editorView.domAtPos.bind(editorView))(selection);
48
- }
49
- var LayoutButton = /*#__PURE__*/function (_React$Component) {
50
- (0, _inherits2.default)(LayoutButton, _React$Component);
51
- var _super = _createSuper(LayoutButton);
52
- function LayoutButton() {
53
- var _this;
54
- (0, _classCallCheck2.default)(this, LayoutButton);
55
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
56
- args[_key] = arguments[_key];
57
- }
58
- _this = _super.call.apply(_super, [this].concat(args));
59
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleClick", function (breakoutMode) {
60
- return function () {
61
- var _this$props$editorVie = _this.props.editorView,
62
- state = _this$props$editorVie.state,
63
- dispatch = _this$props$editorVie.dispatch;
64
- if (['wide', 'full-width'].indexOf(breakoutMode) !== -1) {
65
- (0, _setBreakoutMode.setBreakoutMode)(breakoutMode)(state, dispatch);
66
- } else {
67
- (0, _removeBreakout.removeBreakout)()(state, dispatch);
68
- }
69
- };
70
- });
71
- return _this;
72
- }
73
- (0, _createClass2.default)(LayoutButton, [{
74
- key: "render",
75
- value: function render() {
76
- var _this$props = this.props,
77
- formatMessage = _this$props.intl.formatMessage,
78
- mountPoint = _this$props.mountPoint,
79
- boundariesElement = _this$props.boundariesElement,
80
- scrollableElement = _this$props.scrollableElement,
81
- editorView = _this$props.editorView,
82
- node = _this$props.node;
83
- var state = editorView.state;
84
- if (!node || !(0, _isBreakoutMarkAllowed.isBreakoutMarkAllowed)(state)) {
85
- return null;
86
- }
87
- var breakoutMode = (0, _getBreakoutMode.getBreakoutMode)(editorView.state);
88
- var titleMessage = (0, _utils2.getTitle)(breakoutMode);
89
- var title = formatMessage(titleMessage);
90
- var nextBreakoutMode = (0, _utils2.getNextBreakoutMode)(breakoutMode);
91
- var belowOtherPopupsZIndex = _constants.layers.layer() - 1;
92
- var pluginState = (0, _pluginKey.getPluginState)(state);
93
- if (!pluginState) {
94
- return null;
95
- }
96
- var element = getBreakoutNodeElement(pluginState, state.selection, editorView);
97
- if (!element) {
98
- return null;
99
- }
100
- var closestEl = element.querySelector(".".concat(_styles.BreakoutCssClassName.BREAKOUT_MARK_DOM));
101
- if (closestEl && closestEl.firstChild) {
102
- element = closestEl.firstChild;
103
- }
104
- return (0, _react2.jsx)(_ui.Popup, {
105
- ariaLabel: title,
106
- target: element,
107
- offset: [5, 0],
108
- alignY: "start",
109
- alignX: "end",
110
- mountTo: mountPoint,
111
- boundariesElement: boundariesElement,
112
- scrollableElement: scrollableElement,
113
- stick: true,
114
- forcePlacement: true,
115
- zIndex: belowOtherPopupsZIndex
116
- }, (0, _react2.jsx)("div", {
117
- css: toolbarButtonWrapper
118
- }, (0, _react2.jsx)(_ToolbarButton.default, {
119
- title: title,
120
- testId: titleMessage.id,
121
- onClick: this.handleClick(nextBreakoutMode),
122
- iconBefore: breakoutMode === 'full-width' ? (0, _react2.jsx)(_collapse.default, {
123
- label: title
124
- }) : (0, _react2.jsx)(_expand.default, {
125
- label: title
126
- })
127
- })));
128
- }
129
- }]);
130
- return LayoutButton;
131
- }(_react.default.Component);
132
- (0, _defineProperty2.default)(LayoutButton, "displayName", 'LayoutButton');
133
- var _default = exports.default = (0, _reactIntlNext.injectIntl)(LayoutButton);