@atlaskit/editor-common 78.8.3 → 78.8.5

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 (33) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/cjs/i18n/en.js +1 -1
  3. package/dist/cjs/i18n/en_GB.js +1 -1
  4. package/dist/cjs/i18n/en_ZZ.js +1 -1
  5. package/dist/cjs/messages/paste-options-toolbar.js +1 -1
  6. package/dist/cjs/monitoring/error.js +1 -1
  7. package/dist/cjs/styles/index.js +6 -0
  8. package/dist/cjs/styles/shared/extension.js +3 -2
  9. package/dist/cjs/ui/DropList/index.js +1 -1
  10. package/dist/cjs/ui/MultiBodiedExtension/index.js +65 -6
  11. package/dist/es2019/i18n/en.js +1 -1
  12. package/dist/es2019/i18n/en_GB.js +1 -1
  13. package/dist/es2019/i18n/en_ZZ.js +1 -1
  14. package/dist/es2019/messages/paste-options-toolbar.js +1 -1
  15. package/dist/es2019/monitoring/error.js +1 -1
  16. package/dist/es2019/styles/index.js +2 -1
  17. package/dist/es2019/styles/shared/extension.js +2 -1
  18. package/dist/es2019/ui/DropList/index.js +1 -1
  19. package/dist/es2019/ui/MultiBodiedExtension/index.js +62 -74
  20. package/dist/esm/i18n/en.js +1 -1
  21. package/dist/esm/i18n/en_GB.js +1 -1
  22. package/dist/esm/i18n/en_ZZ.js +1 -1
  23. package/dist/esm/messages/paste-options-toolbar.js +1 -1
  24. package/dist/esm/monitoring/error.js +1 -1
  25. package/dist/esm/styles/index.js +2 -1
  26. package/dist/esm/styles/shared/extension.js +2 -1
  27. package/dist/esm/ui/DropList/index.js +1 -1
  28. package/dist/esm/ui/MultiBodiedExtension/index.js +65 -5
  29. package/dist/types/styles/index.d.ts +1 -0
  30. package/dist/types/styles/shared/extension.d.ts +1 -0
  31. package/dist/types-ts4.5/styles/index.d.ts +1 -0
  32. package/dist/types-ts4.5/styles/shared/extension.d.ts +1 -0
  33. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @atlaskit/editor-common
2
2
 
3
+ ## 78.8.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [#77651](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/77651) [`25b3713456e7`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/25b3713456e7) - ED-22342 Updated tooltip for paste option toolbar
8
+
9
+ ## 78.8.4
10
+
11
+ ### Patch Changes
12
+
13
+ - [#75087](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/75087) [`ede66b0fc1d5`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ede66b0fc1d5) - [ux] ED-22045 Removing custom logic for MBE floating toolbar.
14
+
3
15
  ## 78.8.3
4
16
 
5
17
  ### Patch Changes
@@ -307,7 +307,7 @@ var _default = exports.default = {
307
307
  'fabric.editor.pageActionsLabel': 'Page actions',
308
308
  'fabric.editor.panel.backgroundColor': 'Background color',
309
309
  'fabric.editor.panel.emoji': 'Add emoji',
310
- 'fabric.editor.pasteOptions': 'Paste options floating controls',
310
+ 'fabric.editor.pasteOptions': 'Paste options',
311
311
  'fabric.editor.pastePlainText': 'Paste plain text',
312
312
  'fabric.editor.placeholderAltText': 'Describe this image with alt text',
313
313
  'fabric.editor.placeholderText': 'Placeholder text',
@@ -307,7 +307,7 @@ var _default = exports.default = {
307
307
  'fabric.editor.pageActionsLabel': 'Page actions',
308
308
  'fabric.editor.panel.backgroundColor': 'Background colour',
309
309
  'fabric.editor.panel.emoji': 'Add emoji',
310
- 'fabric.editor.pasteOptions': 'Paste options floating controls',
310
+ 'fabric.editor.pasteOptions': 'Paste options',
311
311
  'fabric.editor.pastePlainText': 'Paste plain text',
312
312
  'fabric.editor.placeholderAltText': 'Describe this image with alt text',
313
313
  'fabric.editor.placeholderText': 'Placeholder text',
@@ -307,7 +307,7 @@ var _default = exports.default = {
307
307
  'fabric.editor.pageActionsLabel': '⁣⁢Page actions‌؜؜؜‍⁡‍؜‌‍⁣⁤',
308
308
  'fabric.editor.panel.backgroundColor': '⁣⁢Background color‍‌⁠⁠‌‌‍‍⁠⁠⁣⁤',
309
309
  'fabric.editor.panel.emoji': '⁣⁢Add emoji⁠؜‍‍‌⁠؜⁠؜؜‍⁣⁤',
310
- 'fabric.editor.pasteOptions': '⁣⁢Paste options floating controls‌⁠‌⁠⁡⁡⁡‍؜⁠؜؜⁣⁤',
310
+ 'fabric.editor.pasteOptions': 'Paste options⁠‌⁠⁡⁡⁡‍؜⁠؜؜⁣⁤',
311
311
  'fabric.editor.pastePlainText': '⁣⁢Paste plain text؜؜‍‌‌⁡‍‌⁠‌‍‌⁣⁤',
312
312
  'fabric.editor.placeholderAltText': '⁣⁢Describe this image with alt text؜⁠‌‌⁡‍‍‌⁠؜‍‌⁣⁤',
313
313
  'fabric.editor.placeholderText': '⁣⁢Placeholder text⁠؜‌؜‌‌‌‌⁠‍⁣⁤',
@@ -8,7 +8,7 @@ var _reactIntlNext = require("react-intl-next");
8
8
  var pasteOptionsToolbarMessages = exports.pasteOptionsToolbarMessages = (0, _reactIntlNext.defineMessages)({
9
9
  pasteOptions: {
10
10
  id: 'fabric.editor.pasteOptions',
11
- defaultMessage: 'Paste options floating controls',
11
+ defaultMessage: 'Paste options',
12
12
  description: 'Opens a menu with additional paste options'
13
13
  },
14
14
  plainText: {
@@ -16,7 +16,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
16
16
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
17
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
18
18
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
19
- var packageVersion = "78.8.3";
19
+ var packageVersion = "78.8.5";
20
20
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
21
21
  // Remove URL as it has UGC
22
22
  // TODO: Sanitise the URL instead of just removing it
@@ -15,6 +15,12 @@ Object.defineProperty(exports, "AnnotationSharedClassNames", {
15
15
  return _annotation.AnnotationSharedClassNames;
16
16
  }
17
17
  });
18
+ Object.defineProperty(exports, "BODIED_EXT_MBE_MARGIN_TOP", {
19
+ enumerable: true,
20
+ get: function get() {
21
+ return _extension.BODIED_EXT_MBE_MARGIN_TOP;
22
+ }
23
+ });
18
24
  Object.defineProperty(exports, "BODIED_EXT_PADDING", {
19
25
  enumerable: true,
20
26
  get: function get() {
@@ -3,11 +3,12 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.EXTENSION_PADDING = exports.BODIED_EXT_PADDING = void 0;
6
+ exports.EXTENSION_PADDING = exports.BODIED_EXT_PADDING = exports.BODIED_EXT_MBE_MARGIN_TOP = void 0;
7
7
  var _constants = require("@atlaskit/theme/constants");
8
8
  // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
9
9
 
10
10
  // TODO: Migrate away from gridSize
11
11
  // Recommendation: Replace gridSize with 8
12
12
  var EXTENSION_PADDING = exports.EXTENSION_PADDING = (0, _constants.gridSize)();
13
- var BODIED_EXT_PADDING = exports.BODIED_EXT_PADDING = EXTENSION_PADDING * 2;
13
+ var BODIED_EXT_PADDING = exports.BODIED_EXT_PADDING = EXTENSION_PADDING * 2;
14
+ var BODIED_EXT_MBE_MARGIN_TOP = exports.BODIED_EXT_MBE_MARGIN_TOP = 12;
@@ -22,7 +22,7 @@ var _templateObject, _templateObject2, _templateObject3;
22
22
  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); }; }
23
23
  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; } } /** @jsx jsx */
24
24
  var packageName = "@atlaskit/editor-common";
25
- var packageVersion = "78.8.3";
25
+ var packageVersion = "78.8.5";
26
26
  var halfFocusRing = 1;
27
27
  var dropOffset = '0, 8';
28
28
  var DropList = /*#__PURE__*/function (_Component) {
@@ -1,19 +1,78 @@
1
1
  "use strict";
2
2
 
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
3
  Object.defineProperty(exports, "__esModule", {
5
4
  value: true
6
5
  });
7
6
  exports.sharedMultiBodiedExtensionStyles = void 0;
8
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
9
7
  var _react = require("@emotion/react");
10
8
  var _colors = require("@atlaskit/theme/colors");
11
- var _templateObject, _templateObject2, _templateObject3;
9
+ var _styles = require("../../styles");
12
10
  /** @jsx jsx */
11
+
13
12
  // Wraps the navigation bar and extensionFrames
14
- var mbeExtensionContainer = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n background: transpaent !important;\n padding: {\n bottom: ", " !important;\n left: ", " !important;\n right: ", " !important;\n }\n padding-bottom: ", ";\n position: relative;\n vertical-align: middle;\n cursor: pointer;\n\n .multiBodiedExtension-handler-result {\n margin-left: ", ";\n }\n\n .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'],\n .multiBodiedExtension--frames > [data-extension-frame='true'] {\n display: none;\n background: ", ";\n }\n\n .multiBodiedExtension-content-dom-wrapper,\n .multiBodiedExtension--frames {\n [data-extension-frame='true'] > :not(style):first-child,\n [data-extension-frame='true'] > style:first-child + * {\n margin-top: 0;\n }\n }\n"])), "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-surface, white)");
15
- var mbeNavigation = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n // make sure the user can't see a range selection inside the navigation\n // This is really important to keep the navigation working properly\n border-top-left-radius: ", ";\n border-top-right-radius: ", ";\n\n user-select: none;\n -webkit-user-modify: read-only;\n border: 1px solid ", ";\n border-bottom: none !important;\n background: ", ";\n margin-left: ", ";\n margin-right: ", ";\n"])), "var(--ds-border-radius, 3px)", "var(--ds-border-radius, 3px)", "var(--ds-border, ".concat(_colors.N40, ")"), "var(--ds-surface, white)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)");
16
- var extensionFrameContent = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n padding: ", " !important;\n border: 1px solid ", ";\n display: block;\n min-height: 100px;\n background: ", ";\n border-bottom-left-radius: ", ";\n border-bottom-right-radius: ", ";\n\n margin-left: ", ";\n margin-right: ", ";\n cursor: initial;\n\n .pm-table-with-controls {\n margin-left: ", " !important;\n padding-right: ", " !important;\n }\n .bodiedExtensionView-content-wrap {\n margin-top: ", " !important;\n }\n // Extension wrap have an additional margin on all four borders, so we need to adjust the spacing\n // compared to the bodiedExtensionView-content-wrap\n .extensionView-content-wrap {\n margin-top: ", " !important;\n }\n .decisionItemView-content-wrap {\n margin-top: 0px !important;\n }\n\n .decisionItemView-content-wrap > [data-decision-wrapper] {\n margin-top: 0px !important;\n }\n"])), "var(--ds-space-100, 8px)", "var(--ds-border, ".concat(_colors.N30, ")"), "var(--ds-surface, white)", "var(--ds-border-radius, 3px)", "var(--ds-border-radius, 3px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-space-150, 12px)", "var(--ds-space-150, 12px)", "var(--ds-space-150, 12px)", "var(--ds-space-100, 8px)");
13
+ var mbeExtensionContainer = (0, _react.css)({
14
+ background: 'transpaent !important',
15
+ 'padding:': {
16
+ bottom: "var(--ds-space-100, 8px)".concat(" !important"),
17
+ left: "var(--ds-space-100, 8px)".concat(" !important"),
18
+ right: "var(--ds-space-100, 8px)".concat(" !important")
19
+ },
20
+ paddingBottom: "var(--ds-space-100, 8px)",
21
+ position: 'relative',
22
+ verticalAlign: 'middle',
23
+ cursor: 'pointer',
24
+ '.multiBodiedExtension-handler-result': {
25
+ marginLeft: "var(--ds-space-100, 8px)"
26
+ },
27
+ ".multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'], .multiBodiedExtension--frames > [data-extension-frame='true']": {
28
+ display: 'none',
29
+ background: "var(--ds-surface, white)"
30
+ },
31
+ '.multiBodiedExtension-content-dom-wrapper, .multiBodiedExtension--frames': {
32
+ "[data-extension-frame='true'] > :not(style):first-child, [data-extension-frame='true'] > style:first-child + *": {
33
+ marginTop: 0
34
+ }
35
+ }
36
+ });
37
+ var mbeNavigation = (0, _react.css)({
38
+ borderTopLeftRadius: "var(--ds-border-radius, 3px)",
39
+ borderTopRightRadius: "var(--ds-border-radius, 3px)",
40
+ userSelect: 'none',
41
+ WebkitUserModify: 'read-only',
42
+ border: "1px solid ".concat("var(--ds-border, ".concat(_colors.N40, ")")),
43
+ borderBottom: 'none !important',
44
+ background: "var(--ds-surface, white)",
45
+ marginLeft: "var(--ds-space-100, 8px)",
46
+ marginRight: "var(--ds-space-100, 8px)"
47
+ });
48
+ var extensionFrameContent = (0, _react.css)({
49
+ padding: "var(--ds-space-100, 8px)".concat(" !important"),
50
+ border: "1px solid ".concat("var(--ds-border, ".concat(_colors.N30, ")")),
51
+ display: 'block',
52
+ minHeight: '100px',
53
+ background: "var(--ds-surface, white)",
54
+ borderBottomLeftRadius: "var(--ds-border-radius, 3px)",
55
+ borderBottomRightRadius: "var(--ds-border-radius, 3px)",
56
+ marginLeft: "var(--ds-space-100, 8px)",
57
+ marginRight: "var(--ds-space-100, 8px)",
58
+ cursor: 'initial',
59
+ '.pm-table-with-controls': {
60
+ marginLeft: "var(--ds-space-150, 12px)".concat(" !important"),
61
+ paddingRight: "var(--ds-space-150, 12px)".concat(" !important")
62
+ },
63
+ '.bodiedExtensionView-content-wrap': {
64
+ marginTop: "".concat(_styles.BODIED_EXT_MBE_MARGIN_TOP, "px !important")
65
+ },
66
+ '.extensionView-content-wrap': {
67
+ marginTop: "var(--ds-space-100, 8px)".concat(" !important")
68
+ },
69
+ '.decisionItemView-content-wrap': {
70
+ marginTop: '0px !important'
71
+ },
72
+ '.decisionItemView-content-wrap > [data-decision-wrapper]': {
73
+ marginTop: '0px !important'
74
+ }
75
+ });
17
76
  var sharedMultiBodiedExtensionStyles = exports.sharedMultiBodiedExtensionStyles = {
18
77
  mbeExtensionContainer: mbeExtensionContainer,
19
78
  mbeNavigation: mbeNavigation,
@@ -301,7 +301,7 @@ export default {
301
301
  'fabric.editor.pageActionsLabel': 'Page actions',
302
302
  'fabric.editor.panel.backgroundColor': 'Background color',
303
303
  'fabric.editor.panel.emoji': 'Add emoji',
304
- 'fabric.editor.pasteOptions': 'Paste options floating controls',
304
+ 'fabric.editor.pasteOptions': 'Paste options',
305
305
  'fabric.editor.pastePlainText': 'Paste plain text',
306
306
  'fabric.editor.placeholderAltText': 'Describe this image with alt text',
307
307
  'fabric.editor.placeholderText': 'Placeholder text',
@@ -301,7 +301,7 @@ export default {
301
301
  'fabric.editor.pageActionsLabel': 'Page actions',
302
302
  'fabric.editor.panel.backgroundColor': 'Background colour',
303
303
  'fabric.editor.panel.emoji': 'Add emoji',
304
- 'fabric.editor.pasteOptions': 'Paste options floating controls',
304
+ 'fabric.editor.pasteOptions': 'Paste options',
305
305
  'fabric.editor.pastePlainText': 'Paste plain text',
306
306
  'fabric.editor.placeholderAltText': 'Describe this image with alt text',
307
307
  'fabric.editor.placeholderText': 'Placeholder text',
@@ -301,7 +301,7 @@ export default {
301
301
  'fabric.editor.pageActionsLabel': '⁣⁢Page actions‌؜؜؜‍⁡‍؜‌‍⁣⁤',
302
302
  'fabric.editor.panel.backgroundColor': '⁣⁢Background color‍‌⁠⁠‌‌‍‍⁠⁠⁣⁤',
303
303
  'fabric.editor.panel.emoji': '⁣⁢Add emoji⁠؜‍‍‌⁠؜⁠؜؜‍⁣⁤',
304
- 'fabric.editor.pasteOptions': '⁣⁢Paste options floating controls‌⁠‌⁠⁡⁡⁡‍؜⁠؜؜⁣⁤',
304
+ 'fabric.editor.pasteOptions': 'Paste options⁠‌⁠⁡⁡⁡‍؜⁠؜؜⁣⁤',
305
305
  'fabric.editor.pastePlainText': '⁣⁢Paste plain text؜؜‍‌‌⁡‍‌⁠‌‍‌⁣⁤',
306
306
  'fabric.editor.placeholderAltText': '⁣⁢Describe this image with alt text؜⁠‌‌⁡‍‍‌⁠؜‍‌⁣⁤',
307
307
  'fabric.editor.placeholderText': '⁣⁢Placeholder text⁠؜‌؜‌‌‌‌⁠‍⁣⁤',
@@ -2,7 +2,7 @@ import { defineMessages } from 'react-intl-next';
2
2
  export const pasteOptionsToolbarMessages = defineMessages({
3
3
  pasteOptions: {
4
4
  id: 'fabric.editor.pasteOptions',
5
- defaultMessage: 'Paste options floating controls',
5
+ defaultMessage: 'Paste options',
6
6
  description: 'Opens a menu with additional paste options'
7
7
  },
8
8
  plainText: {
@@ -1,6 +1,6 @@
1
1
  const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
2
2
  const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
3
- const packageVersion = "78.8.3";
3
+ const packageVersion = "78.8.5";
4
4
  const sanitiseSentryEvents = (data, _hint) => {
5
5
  // Remove URL as it has UGC
6
6
  // TODO: Sanitise the URL instead of just removing it
@@ -30,4 +30,5 @@ export { buttonGroupStyle, separatorStyles, wrapperStyle, triggerWrapperStyles }
30
30
  export { UnsupportedSharedCssClassName, unsupportedStyles } from './shared/unsupported-content';
31
31
  export { expandIconWrapperStyle, expandClassNames } from './shared/expand';
32
32
  export { ClassNames as MediaSharedClassNames } from './shared/media';
33
- export { BreakoutCssClassName } from './shared/breakout';
33
+ export { BreakoutCssClassName } from './shared/breakout';
34
+ export { BODIED_EXT_MBE_MARGIN_TOP } from './shared/extension';
@@ -4,4 +4,5 @@ import { gridSize } from '@atlaskit/theme/constants';
4
4
  // TODO: Migrate away from gridSize
5
5
  // Recommendation: Replace gridSize with 8
6
6
  export const EXTENSION_PADDING = gridSize();
7
- export const BODIED_EXT_PADDING = EXTENSION_PADDING * 2;
7
+ export const BODIED_EXT_PADDING = EXTENSION_PADDING * 2;
8
+ export const BODIED_EXT_MBE_MARGIN_TOP = 12;
@@ -7,7 +7,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
7
7
  import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
8
8
  import Layer from '../Layer';
9
9
  const packageName = "@atlaskit/editor-common";
10
- const packageVersion = "78.8.3";
10
+ const packageVersion = "78.8.5";
11
11
  const halfFocusRing = 1;
12
12
  const dropOffset = '0, 8';
13
13
  class DropList extends Component {
@@ -2,84 +2,72 @@
2
2
 
3
3
  import { css } from '@emotion/react';
4
4
  import { N30, N40 } from '@atlaskit/theme/colors';
5
- // Wraps the navigation bar and extensionFrames
6
- const mbeExtensionContainer = css`
7
- background: transpaent !important;
8
- padding: {
9
- bottom: ${"var(--ds-space-100, 8px)"} !important;
10
- left: ${"var(--ds-space-100, 8px)"} !important;
11
- right: ${"var(--ds-space-100, 8px)"} !important;
12
- }
13
- padding-bottom: ${"var(--ds-space-100, 8px)"};
14
- position: relative;
15
- vertical-align: middle;
16
- cursor: pointer;
17
-
18
- .multiBodiedExtension-handler-result {
19
- margin-left: ${"var(--ds-space-100, 8px)"};
20
- }
5
+ import { BODIED_EXT_MBE_MARGIN_TOP } from '../../styles';
21
6
 
22
- .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'],
23
- .multiBodiedExtension--frames > [data-extension-frame='true'] {
24
- display: none;
25
- background: ${"var(--ds-surface, white)"};
26
- }
27
-
28
- .multiBodiedExtension-content-dom-wrapper,
29
- .multiBodiedExtension--frames {
30
- [data-extension-frame='true'] > :not(style):first-child,
31
- [data-extension-frame='true'] > style:first-child + * {
32
- margin-top: 0;
7
+ // Wraps the navigation bar and extensionFrames
8
+ const mbeExtensionContainer = css({
9
+ background: 'transpaent !important',
10
+ 'padding:': {
11
+ bottom: `${"var(--ds-space-100, 8px)"} !important`,
12
+ left: `${"var(--ds-space-100, 8px)"} !important`,
13
+ right: `${"var(--ds-space-100, 8px)"} !important`
14
+ },
15
+ paddingBottom: "var(--ds-space-100, 8px)",
16
+ position: 'relative',
17
+ verticalAlign: 'middle',
18
+ cursor: 'pointer',
19
+ '.multiBodiedExtension-handler-result': {
20
+ marginLeft: "var(--ds-space-100, 8px)"
21
+ },
22
+ ".multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'], .multiBodiedExtension--frames > [data-extension-frame='true']": {
23
+ display: 'none',
24
+ background: "var(--ds-surface, white)"
25
+ },
26
+ '.multiBodiedExtension-content-dom-wrapper, .multiBodiedExtension--frames': {
27
+ "[data-extension-frame='true'] > :not(style):first-child, [data-extension-frame='true'] > style:first-child + *": {
28
+ marginTop: 0
33
29
  }
34
30
  }
35
- `;
36
- const mbeNavigation = css`
37
- // make sure the user can't see a range selection inside the navigation
38
- // This is really important to keep the navigation working properly
39
- border-top-left-radius: ${"var(--ds-border-radius, 3px)"};
40
- border-top-right-radius: ${"var(--ds-border-radius, 3px)"};
41
-
42
- user-select: none;
43
- -webkit-user-modify: read-only;
44
- border: 1px solid ${`var(--ds-border, ${N40})`};
45
- border-bottom: none !important;
46
- background: ${"var(--ds-surface, white)"};
47
- margin-left: ${"var(--ds-space-100, 8px)"};
48
- margin-right: ${"var(--ds-space-100, 8px)"};
49
- `;
50
- const extensionFrameContent = css`
51
- padding: ${"var(--ds-space-100, 8px)"} !important;
52
- border: 1px solid ${`var(--ds-border, ${N30})`};
53
- display: block;
54
- min-height: 100px;
55
- background: ${"var(--ds-surface, white)"};
56
- border-bottom-left-radius: ${"var(--ds-border-radius, 3px)"};
57
- border-bottom-right-radius: ${"var(--ds-border-radius, 3px)"};
58
-
59
- margin-left: ${"var(--ds-space-100, 8px)"};
60
- margin-right: ${"var(--ds-space-100, 8px)"};
61
- cursor: initial;
62
-
63
- .pm-table-with-controls {
64
- margin-left: ${"var(--ds-space-150, 12px)"} !important;
65
- padding-right: ${"var(--ds-space-150, 12px)"} !important;
66
- }
67
- .bodiedExtensionView-content-wrap {
68
- margin-top: ${"var(--ds-space-150, 12px)"} !important;
69
- }
70
- // Extension wrap have an additional margin on all four borders, so we need to adjust the spacing
71
- // compared to the bodiedExtensionView-content-wrap
72
- .extensionView-content-wrap {
73
- margin-top: ${"var(--ds-space-100, 8px)"} !important;
74
- }
75
- .decisionItemView-content-wrap {
76
- margin-top: 0px !important;
77
- }
78
-
79
- .decisionItemView-content-wrap > [data-decision-wrapper] {
80
- margin-top: 0px !important;
31
+ });
32
+ const mbeNavigation = css({
33
+ borderTopLeftRadius: "var(--ds-border-radius, 3px)",
34
+ borderTopRightRadius: "var(--ds-border-radius, 3px)",
35
+ userSelect: 'none',
36
+ WebkitUserModify: 'read-only',
37
+ border: `1px solid ${`var(--ds-border, ${N40})`}`,
38
+ borderBottom: 'none !important',
39
+ background: "var(--ds-surface, white)",
40
+ marginLeft: "var(--ds-space-100, 8px)",
41
+ marginRight: "var(--ds-space-100, 8px)"
42
+ });
43
+ const extensionFrameContent = css({
44
+ padding: `${"var(--ds-space-100, 8px)"} !important`,
45
+ border: `1px solid ${`var(--ds-border, ${N30})`}`,
46
+ display: 'block',
47
+ minHeight: '100px',
48
+ background: "var(--ds-surface, white)",
49
+ borderBottomLeftRadius: "var(--ds-border-radius, 3px)",
50
+ borderBottomRightRadius: "var(--ds-border-radius, 3px)",
51
+ marginLeft: "var(--ds-space-100, 8px)",
52
+ marginRight: "var(--ds-space-100, 8px)",
53
+ cursor: 'initial',
54
+ '.pm-table-with-controls': {
55
+ marginLeft: `${"var(--ds-space-150, 12px)"} !important`,
56
+ paddingRight: `${"var(--ds-space-150, 12px)"} !important`
57
+ },
58
+ '.bodiedExtensionView-content-wrap': {
59
+ marginTop: `${BODIED_EXT_MBE_MARGIN_TOP}px !important`
60
+ },
61
+ '.extensionView-content-wrap': {
62
+ marginTop: `${"var(--ds-space-100, 8px)"} !important`
63
+ },
64
+ '.decisionItemView-content-wrap': {
65
+ marginTop: '0px !important'
66
+ },
67
+ '.decisionItemView-content-wrap > [data-decision-wrapper]': {
68
+ marginTop: '0px !important'
81
69
  }
82
- `;
70
+ });
83
71
  export const sharedMultiBodiedExtensionStyles = {
84
72
  mbeExtensionContainer,
85
73
  mbeNavigation,
@@ -301,7 +301,7 @@ export default {
301
301
  'fabric.editor.pageActionsLabel': 'Page actions',
302
302
  'fabric.editor.panel.backgroundColor': 'Background color',
303
303
  'fabric.editor.panel.emoji': 'Add emoji',
304
- 'fabric.editor.pasteOptions': 'Paste options floating controls',
304
+ 'fabric.editor.pasteOptions': 'Paste options',
305
305
  'fabric.editor.pastePlainText': 'Paste plain text',
306
306
  'fabric.editor.placeholderAltText': 'Describe this image with alt text',
307
307
  'fabric.editor.placeholderText': 'Placeholder text',
@@ -301,7 +301,7 @@ export default {
301
301
  'fabric.editor.pageActionsLabel': 'Page actions',
302
302
  'fabric.editor.panel.backgroundColor': 'Background colour',
303
303
  'fabric.editor.panel.emoji': 'Add emoji',
304
- 'fabric.editor.pasteOptions': 'Paste options floating controls',
304
+ 'fabric.editor.pasteOptions': 'Paste options',
305
305
  'fabric.editor.pastePlainText': 'Paste plain text',
306
306
  'fabric.editor.placeholderAltText': 'Describe this image with alt text',
307
307
  'fabric.editor.placeholderText': 'Placeholder text',
@@ -301,7 +301,7 @@ export default {
301
301
  'fabric.editor.pageActionsLabel': '⁣⁢Page actions‌؜؜؜‍⁡‍؜‌‍⁣⁤',
302
302
  'fabric.editor.panel.backgroundColor': '⁣⁢Background color‍‌⁠⁠‌‌‍‍⁠⁠⁣⁤',
303
303
  'fabric.editor.panel.emoji': '⁣⁢Add emoji⁠؜‍‍‌⁠؜⁠؜؜‍⁣⁤',
304
- 'fabric.editor.pasteOptions': '⁣⁢Paste options floating controls‌⁠‌⁠⁡⁡⁡‍؜⁠؜؜⁣⁤',
304
+ 'fabric.editor.pasteOptions': 'Paste options⁠‌⁠⁡⁡⁡‍؜⁠؜؜⁣⁤',
305
305
  'fabric.editor.pastePlainText': '⁣⁢Paste plain text؜؜‍‌‌⁡‍‌⁠‌‍‌⁣⁤',
306
306
  'fabric.editor.placeholderAltText': '⁣⁢Describe this image with alt text؜⁠‌‌⁡‍‍‌⁠؜‍‌⁣⁤',
307
307
  'fabric.editor.placeholderText': '⁣⁢Placeholder text⁠؜‌؜‌‌‌‌⁠‍⁣⁤',
@@ -2,7 +2,7 @@ import { defineMessages } from 'react-intl-next';
2
2
  export var pasteOptionsToolbarMessages = defineMessages({
3
3
  pasteOptions: {
4
4
  id: 'fabric.editor.pasteOptions',
5
- defaultMessage: 'Paste options floating controls',
5
+ defaultMessage: 'Paste options',
6
6
  description: 'Opens a menu with additional paste options'
7
7
  },
8
8
  plainText: {
@@ -6,7 +6,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
6
6
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
7
7
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
8
8
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
9
- var packageVersion = "78.8.3";
9
+ var packageVersion = "78.8.5";
10
10
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
11
11
  // Remove URL as it has UGC
12
12
  // TODO: Sanitise the URL instead of just removing it
@@ -30,4 +30,5 @@ export { buttonGroupStyle, separatorStyles, wrapperStyle, triggerWrapperStyles }
30
30
  export { UnsupportedSharedCssClassName, unsupportedStyles } from './shared/unsupported-content';
31
31
  export { expandIconWrapperStyle, expandClassNames } from './shared/expand';
32
32
  export { ClassNames as MediaSharedClassNames } from './shared/media';
33
- export { BreakoutCssClassName } from './shared/breakout';
33
+ export { BreakoutCssClassName } from './shared/breakout';
34
+ export { BODIED_EXT_MBE_MARGIN_TOP } from './shared/extension';
@@ -4,4 +4,5 @@ import { gridSize } from '@atlaskit/theme/constants';
4
4
  // TODO: Migrate away from gridSize
5
5
  // Recommendation: Replace gridSize with 8
6
6
  export var EXTENSION_PADDING = gridSize();
7
- export var BODIED_EXT_PADDING = EXTENSION_PADDING * 2;
7
+ export var BODIED_EXT_PADDING = EXTENSION_PADDING * 2;
8
+ export var BODIED_EXT_MBE_MARGIN_TOP = 12;
@@ -17,7 +17,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
17
17
  import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
18
18
  import Layer from '../Layer';
19
19
  var packageName = "@atlaskit/editor-common";
20
- var packageVersion = "78.8.3";
20
+ var packageVersion = "78.8.5";
21
21
  var halfFocusRing = 1;
22
22
  var dropOffset = '0, 8';
23
23
  var DropList = /*#__PURE__*/function (_Component) {
@@ -1,13 +1,73 @@
1
- import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
2
- var _templateObject, _templateObject2, _templateObject3;
3
1
  /** @jsx jsx */
4
2
 
5
3
  import { css } from '@emotion/react';
6
4
  import { N30, N40 } from '@atlaskit/theme/colors';
5
+ import { BODIED_EXT_MBE_MARGIN_TOP } from '../../styles';
6
+
7
7
  // Wraps the navigation bar and extensionFrames
8
- var mbeExtensionContainer = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background: transpaent !important;\n padding: {\n bottom: ", " !important;\n left: ", " !important;\n right: ", " !important;\n }\n padding-bottom: ", ";\n position: relative;\n vertical-align: middle;\n cursor: pointer;\n\n .multiBodiedExtension-handler-result {\n margin-left: ", ";\n }\n\n .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'],\n .multiBodiedExtension--frames > [data-extension-frame='true'] {\n display: none;\n background: ", ";\n }\n\n .multiBodiedExtension-content-dom-wrapper,\n .multiBodiedExtension--frames {\n [data-extension-frame='true'] > :not(style):first-child,\n [data-extension-frame='true'] > style:first-child + * {\n margin-top: 0;\n }\n }\n"])), "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-surface, white)");
9
- var mbeNavigation = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n // make sure the user can't see a range selection inside the navigation\n // This is really important to keep the navigation working properly\n border-top-left-radius: ", ";\n border-top-right-radius: ", ";\n\n user-select: none;\n -webkit-user-modify: read-only;\n border: 1px solid ", ";\n border-bottom: none !important;\n background: ", ";\n margin-left: ", ";\n margin-right: ", ";\n"])), "var(--ds-border-radius, 3px)", "var(--ds-border-radius, 3px)", "var(--ds-border, ".concat(N40, ")"), "var(--ds-surface, white)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)");
10
- var extensionFrameContent = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n padding: ", " !important;\n border: 1px solid ", ";\n display: block;\n min-height: 100px;\n background: ", ";\n border-bottom-left-radius: ", ";\n border-bottom-right-radius: ", ";\n\n margin-left: ", ";\n margin-right: ", ";\n cursor: initial;\n\n .pm-table-with-controls {\n margin-left: ", " !important;\n padding-right: ", " !important;\n }\n .bodiedExtensionView-content-wrap {\n margin-top: ", " !important;\n }\n // Extension wrap have an additional margin on all four borders, so we need to adjust the spacing\n // compared to the bodiedExtensionView-content-wrap\n .extensionView-content-wrap {\n margin-top: ", " !important;\n }\n .decisionItemView-content-wrap {\n margin-top: 0px !important;\n }\n\n .decisionItemView-content-wrap > [data-decision-wrapper] {\n margin-top: 0px !important;\n }\n"])), "var(--ds-space-100, 8px)", "var(--ds-border, ".concat(N30, ")"), "var(--ds-surface, white)", "var(--ds-border-radius, 3px)", "var(--ds-border-radius, 3px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-space-150, 12px)", "var(--ds-space-150, 12px)", "var(--ds-space-150, 12px)", "var(--ds-space-100, 8px)");
8
+ var mbeExtensionContainer = css({
9
+ background: 'transpaent !important',
10
+ 'padding:': {
11
+ bottom: "var(--ds-space-100, 8px)".concat(" !important"),
12
+ left: "var(--ds-space-100, 8px)".concat(" !important"),
13
+ right: "var(--ds-space-100, 8px)".concat(" !important")
14
+ },
15
+ paddingBottom: "var(--ds-space-100, 8px)",
16
+ position: 'relative',
17
+ verticalAlign: 'middle',
18
+ cursor: 'pointer',
19
+ '.multiBodiedExtension-handler-result': {
20
+ marginLeft: "var(--ds-space-100, 8px)"
21
+ },
22
+ ".multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'], .multiBodiedExtension--frames > [data-extension-frame='true']": {
23
+ display: 'none',
24
+ background: "var(--ds-surface, white)"
25
+ },
26
+ '.multiBodiedExtension-content-dom-wrapper, .multiBodiedExtension--frames': {
27
+ "[data-extension-frame='true'] > :not(style):first-child, [data-extension-frame='true'] > style:first-child + *": {
28
+ marginTop: 0
29
+ }
30
+ }
31
+ });
32
+ var mbeNavigation = css({
33
+ borderTopLeftRadius: "var(--ds-border-radius, 3px)",
34
+ borderTopRightRadius: "var(--ds-border-radius, 3px)",
35
+ userSelect: 'none',
36
+ WebkitUserModify: 'read-only',
37
+ border: "1px solid ".concat("var(--ds-border, ".concat(N40, ")")),
38
+ borderBottom: 'none !important',
39
+ background: "var(--ds-surface, white)",
40
+ marginLeft: "var(--ds-space-100, 8px)",
41
+ marginRight: "var(--ds-space-100, 8px)"
42
+ });
43
+ var extensionFrameContent = css({
44
+ padding: "var(--ds-space-100, 8px)".concat(" !important"),
45
+ border: "1px solid ".concat("var(--ds-border, ".concat(N30, ")")),
46
+ display: 'block',
47
+ minHeight: '100px',
48
+ background: "var(--ds-surface, white)",
49
+ borderBottomLeftRadius: "var(--ds-border-radius, 3px)",
50
+ borderBottomRightRadius: "var(--ds-border-radius, 3px)",
51
+ marginLeft: "var(--ds-space-100, 8px)",
52
+ marginRight: "var(--ds-space-100, 8px)",
53
+ cursor: 'initial',
54
+ '.pm-table-with-controls': {
55
+ marginLeft: "var(--ds-space-150, 12px)".concat(" !important"),
56
+ paddingRight: "var(--ds-space-150, 12px)".concat(" !important")
57
+ },
58
+ '.bodiedExtensionView-content-wrap': {
59
+ marginTop: "".concat(BODIED_EXT_MBE_MARGIN_TOP, "px !important")
60
+ },
61
+ '.extensionView-content-wrap': {
62
+ marginTop: "var(--ds-space-100, 8px)".concat(" !important")
63
+ },
64
+ '.decisionItemView-content-wrap': {
65
+ marginTop: '0px !important'
66
+ },
67
+ '.decisionItemView-content-wrap > [data-decision-wrapper]': {
68
+ marginTop: '0px !important'
69
+ }
70
+ });
11
71
  export var sharedMultiBodiedExtensionStyles = {
12
72
  mbeExtensionContainer: mbeExtensionContainer,
13
73
  mbeNavigation: mbeNavigation,
@@ -31,3 +31,4 @@ export { UnsupportedSharedCssClassName, unsupportedStyles, } from './shared/unsu
31
31
  export { expandIconWrapperStyle, expandClassNames } from './shared/expand';
32
32
  export { ClassNames as MediaSharedClassNames } from './shared/media';
33
33
  export { BreakoutCssClassName } from './shared/breakout';
34
+ export { BODIED_EXT_MBE_MARGIN_TOP } from './shared/extension';
@@ -1,2 +1,3 @@
1
1
  export declare const EXTENSION_PADDING: number;
2
2
  export declare const BODIED_EXT_PADDING: number;
3
+ export declare const BODIED_EXT_MBE_MARGIN_TOP = 12;
@@ -31,3 +31,4 @@ export { UnsupportedSharedCssClassName, unsupportedStyles, } from './shared/unsu
31
31
  export { expandIconWrapperStyle, expandClassNames } from './shared/expand';
32
32
  export { ClassNames as MediaSharedClassNames } from './shared/media';
33
33
  export { BreakoutCssClassName } from './shared/breakout';
34
+ export { BODIED_EXT_MBE_MARGIN_TOP } from './shared/extension';
@@ -1,2 +1,3 @@
1
1
  export declare const EXTENSION_PADDING: number;
2
2
  export declare const BODIED_EXT_PADDING: number;
3
+ export declare const BODIED_EXT_MBE_MARGIN_TOP = 12;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-common",
3
- "version": "78.8.3",
3
+ "version": "78.8.5",
4
4
  "description": "A package that contains common classes and components for editor and renderer",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"