@atlaskit/editor-common 96.3.5 → 96.3.7

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/editor-common
2
2
 
3
+ ## 96.3.7
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 96.3.6
10
+
11
+ ### Patch Changes
12
+
13
+ - [#170382](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/170382)
14
+ [`acd14496d28fd`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/acd14496d28fd) -
15
+ [ux] Update styling for bodied macro in live pages, fix block macro width, and update tests
16
+ - Updated dependencies
17
+
3
18
  ## 96.3.5
4
19
 
5
20
  ### Patch Changes
@@ -69,15 +69,17 @@ function ExtensionWithPluginState(props) {
69
69
  editorAppearance !== 'full-width';
70
70
  var classNames = (0, _classnames2.default)('extension-container', 'block', shadowClassNames, (0, _defineProperty2.default)({
71
71
  'with-overlay': !hasBody && !showMacroInteractionDesignUpdates,
72
- 'with-bodied-border': showMacroInteractionDesignUpdates && hasBody,
73
- 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested,
72
+ 'with-bodied-border': showMacroInteractionDesignUpdates && hasBody && !showBodiedExtensionRendererView,
73
+ 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested && !showBodiedExtensionRendererView,
74
74
  'with-hover-border': showMacroInteractionDesignUpdates && isNodeHovered,
75
75
  'with-danger-overlay': showMacroInteractionDesignUpdates,
76
76
  'without-frame': removeBorder
77
77
  }, _styles2.widerLayoutClassName, shouldBreakout));
78
78
  var overflowClassNames = (0, _classnames2.default)('extension-overflow-wrapper', {
79
79
  'with-body': hasBody,
80
- 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested
80
+ 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested && !showBodiedExtensionRendererView,
81
+ // Adding extra padding for renderer view so users can have a touch target to click on the extension
82
+ 'with-padding-styles': showMacroInteractionDesignUpdates && showBodiedExtensionRendererView
81
83
  });
82
84
  var headerClassNames = (0, _classnames2.default)({
83
85
  'with-children': hasChildren,
@@ -126,6 +128,7 @@ function ExtensionWithPluginState(props) {
126
128
  showBodiedExtensionRendererView: showBodiedExtensionRendererView,
127
129
  setShowBodiedExtensionRendererView: setShowBodiedExtensionRendererView
128
130
  }), (0, _react2.jsx)("div", {
131
+ "data-testid": "extension-container",
129
132
  ref: handleRef,
130
133
  "data-layout": node.attrs.layout
131
134
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -144,7 +147,12 @@ function ExtensionWithPluginState(props) {
144
147
  return handleMouseEvent(false);
145
148
  }
146
149
  }, (0, _react2.jsx)("div", {
147
- className: overflowClassNames,
150
+ "data-testid": "extension-overflow-wrapper"
151
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
152
+ ,
153
+ className: overflowClassNames
154
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
155
+ ,
148
156
  css: _styles2.overflowWrapperStyles
149
157
  }, (0, _react2.jsx)("div", {
150
158
  className: 'extension-overlay',
@@ -163,10 +171,16 @@ function ExtensionWithPluginState(props) {
163
171
  }), children), hasBody &&
164
172
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
165
173
  (0, _react2.jsx)("div", {
166
- css: newContentStyles,
167
- className: newContentClassNames
174
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
175
+ css: newContentStyles
176
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
177
+ ,
178
+ className: newContentClassNames,
179
+ "data-testid": "extension-new-content"
168
180
  }, (0, _react2.jsx)("div", {
181
+ "data-testid": "extension-content"
169
182
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
183
+ ,
170
184
  css: _styles2.content,
171
185
  ref: handleContentDOMRef
172
186
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -32,8 +32,8 @@ var wrapperStyle = exports.wrapperStyle = (0, _react.css)(_styles.wrapperDefault
32
32
  },
33
33
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
34
34
  '&.with-margin-styles': {
35
- margin: "0 ".concat("var(--ds-space-negative-150, -12px)"),
36
- padding: "0 ".concat("var(--ds-space-150, 12px)")
35
+ margin: "0 ".concat("var(--ds-space-negative-250, -20px)"),
36
+ padding: "0 ".concat("var(--ds-space-250, 20px)")
37
37
  }
38
38
  });
39
39
 
@@ -88,6 +88,10 @@ var contentWrapper = exports.contentWrapper = (0, _react.css)({
88
88
  var overflowWrapperStyles = exports.overflowWrapperStyles = (0, _react.css)({
89
89
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
90
90
  '&.with-margin-styles': {
91
- margin: "0 ".concat("var(--ds-space-negative-150, -12px)")
91
+ margin: "0 ".concat("var(--ds-space-negative-250, -20px)")
92
+ },
93
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
94
+ '&.with-padding-styles': {
95
+ padding: "var(--ds-space-100, 8px)"
92
96
  }
93
97
  });
@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
17
17
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
18
18
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
19
19
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
20
- var packageVersion = "96.3.5";
20
+ var packageVersion = "96.3.7";
21
21
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
22
22
  // Remove URL as it has UGC
23
23
  // TODO: Sanitise the URL instead of just removing it
@@ -16,7 +16,7 @@ var FLOATING_TOOLBAR_LINKPICKER_CLASSNAME = exports.FLOATING_TOOLBAR_LINKPICKER_
16
16
 
17
17
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
18
18
  var smartCardStyles = exports.smartCardStyles = function smartCardStyles() {
19
- return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tmax-width: calc(100% - 20px);\n\t\tvertical-align: top;\n\t\tword-break: break-all;\n\t\t", "\n\t\t.card {\n\t\t\tpadding-left: ", ";\n\t\t\tpadding-right: ", ";\n\t\t\tpadding-top: 0.5em;\n\t\t\tpadding-bottom: 0.5em;\n\t\t\tmargin-bottom: -0.5em;\n\n\t\t\t.", " > a:focus {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > a {\n\t\t\t", "\n\t\t}\n\t\t.", " > a {\n\t\t\t/* EDM-1717: box-shadow Safari fix start */\n\t\t\tz-index: 1;\n\t\t\tposition: relative;\n\t\t\t/* EDM-1717: box-shadow Safari fix end */\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " > a {\n\t\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t\t\t/* EDM-1717: box-shadow Safari fix start */\n\t\t\t\tz-index: 2;\n\t\t\t\t/* EDM-1717: box-shadow Safari fix end */\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " > div {\n\t\t\tcursor: ", ";\n\n\t\t\ta {\n\t\t\t\tcursor: ", ";\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > div {\n\t\t\t", "\n\t\t\tborder-radius: ", ";\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " > div {\n\t\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t\t}\n\t\t}\n\t}\n\n\t.", ".", " {\n\t\tmax-width: 100%;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\n\t\t.", " {\n\t\t\tcursor: pointer;\n\t\t\tbackground-color: ", ";\n\t\t\tborder-radius: ", ";\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t&.", " {\n\t\t\t.", " {\n\t\t\t\t", "\n\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " {\n\t\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " > div {\n\t\t\tcursor: pointer;\n\t\t\ta {\n\t\t\t\tcursor: ", ";\n\t\t\t}\n\t\t\t&::after {\n\t\t\t\ttransition: box-shadow 0s;\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > div::after {\n\t\t\t", "\n\t\t}\n\n\t\t&.danger {\n\t\t\t.media-card-frame::after {\n\t\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t\t\tbackground: ", " !important;\n\t\t\t}\n\t\t\t.richMedia-resize-handle-right::after,\n\t\t\t.richMedia-resize-handle-left::after {\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\tpadding: 0;\n\t}\n"])), _smartCard.SmartCardSharedCssClassName.INLINE_CARD_CONTAINER, (0, _platformFeatureFlags.fg)('editor_inline_comments_on_inline_nodes') ? ".card-with-comment {\n background: ".concat("var(--ds-background-accent-yellow-subtler, #F8E6A0)", ";\n border-bottom: 2px solid ", "var(--ds-border-accent-yellow, #B38600)", ";\n box-shadow: ", "var(--ds-shadow-overlay, 0px 8px 12px #091E4226, 0px 0px 1px #091E424f)", ";\n }") : '', "var(--ds-space-025, 2px)", "var(--ds-space-025, 2px)", _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _editorSharedStyles.akEditorSelectedNodeClassName, _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER, _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), _smartCard.SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER,
19
+ return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tmax-width: calc(100% - 20px);\n\t\tvertical-align: top;\n\t\tword-break: break-all;\n\t\t", "\n\t\t.card {\n\t\t\tpadding-left: ", ";\n\t\t\tpadding-right: ", ";\n\t\t\tpadding-top: 0.5em;\n\t\t\tpadding-bottom: 0.5em;\n\t\t\tmargin-bottom: -0.5em;\n\n\t\t\t.", " > a:focus {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > a {\n\t\t\t", "\n\t\t}\n\t\t.", " > a {\n\t\t\t/* EDM-1717: box-shadow Safari fix start */\n\t\t\tz-index: 1;\n\t\t\tposition: relative;\n\t\t\t/* EDM-1717: box-shadow Safari fix end */\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " > a {\n\t\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t\t\t/* EDM-1717: box-shadow Safari fix start */\n\t\t\t\tz-index: 2;\n\t\t\t\t/* EDM-1717: box-shadow Safari fix end */\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " > div {\n\t\t\tcursor: ", ";\n\n\t\t\ta {\n\t\t\t\tcursor: ", ";\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > div {\n\t\t\t", "\n\t\t\tborder-radius: ", ";\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " > div {\n\t\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t\t}\n\t\t}\n\t}\n\n\t.", ".", " {\n\t\tmax-width: 100%;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\n\t\t.", " {\n\t\t\tcursor: pointer;\n\t\t\tbackground-color: ", ";\n\t\t\tborder-radius: ", ";\n\t\t\tborder: 1px solid ", ";\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\t&.", " {\n\t\t\t.", " {\n\t\t\t\t", "\n\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " {\n\t\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " > div {\n\t\t\tcursor: pointer;\n\t\t\ta {\n\t\t\t\tcursor: ", ";\n\t\t\t}\n\t\t\t&::after {\n\t\t\t\ttransition: box-shadow 0s;\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > div::after {\n\t\t\t", "\n\t\t}\n\n\t\t&.danger {\n\t\t\t.media-card-frame::after {\n\t\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t\t\tbackground: ", " !important;\n\t\t\t}\n\t\t\t.richMedia-resize-handle-right::after,\n\t\t\t.richMedia-resize-handle-left::after {\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\tpadding: 0;\n\t}\n"])), _smartCard.SmartCardSharedCssClassName.INLINE_CARD_CONTAINER, (0, _platformFeatureFlags.fg)('editor_inline_comments_on_inline_nodes') ? ".card-with-comment {\n background: ".concat("var(--ds-background-accent-yellow-subtler, #F8E6A0)", ";\n border-bottom: 2px solid ", "var(--ds-border-accent-yellow, #B38600)", ";\n box-shadow: ", "var(--ds-shadow-overlay, 0px 8px 12px #091E4226, 0px 0px 1px #091E424f)", ";\n }") : '', "var(--ds-space-025, 2px)", "var(--ds-space-025, 2px)", _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _editorSharedStyles.akEditorSelectedNodeClassName, _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow]), _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER, _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER, "var(--ds-border-danger, ".concat(_editorSharedStyles.akEditorDeleteBorder, ")"), _smartCard.SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, _smartCard.SmartCardSharedCssClassName.LOADER_WRAPPER,
20
20
  // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
21
21
  (0, _platformFeatureFlags.fg)('linking_platform_smart_links_in_live_pages') ? 'text' : 'pointer',
22
22
  // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
@@ -24,7 +24,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
24
24
  * @jsx jsx
25
25
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
26
26
  var packageName = "@atlaskit/editor-common";
27
- var packageVersion = "96.3.5";
27
+ var packageVersion = "96.3.7";
28
28
  var halfFocusRing = 1;
29
29
  var dropOffset = '0, 8';
30
30
  var DropList = /*#__PURE__*/function (_Component) {
@@ -60,8 +60,8 @@ function ExtensionWithPluginState(props) {
60
60
  editorAppearance !== 'full-width';
61
61
  const classNames = classnames('extension-container', 'block', shadowClassNames, {
62
62
  'with-overlay': !hasBody && !showMacroInteractionDesignUpdates,
63
- 'with-bodied-border': showMacroInteractionDesignUpdates && hasBody,
64
- 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested,
63
+ 'with-bodied-border': showMacroInteractionDesignUpdates && hasBody && !showBodiedExtensionRendererView,
64
+ 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested && !showBodiedExtensionRendererView,
65
65
  'with-hover-border': showMacroInteractionDesignUpdates && isNodeHovered,
66
66
  'with-danger-overlay': showMacroInteractionDesignUpdates,
67
67
  'without-frame': removeBorder,
@@ -69,7 +69,9 @@ function ExtensionWithPluginState(props) {
69
69
  });
70
70
  const overflowClassNames = classnames('extension-overflow-wrapper', {
71
71
  'with-body': hasBody,
72
- 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested
72
+ 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested && !showBodiedExtensionRendererView,
73
+ // Adding extra padding for renderer view so users can have a touch target to click on the extension
74
+ 'with-padding-styles': showMacroInteractionDesignUpdates && showBodiedExtensionRendererView
73
75
  });
74
76
  const headerClassNames = classnames({
75
77
  'with-children': hasChildren,
@@ -124,6 +126,7 @@ function ExtensionWithPluginState(props) {
124
126
  showBodiedExtensionRendererView: showBodiedExtensionRendererView,
125
127
  setShowBodiedExtensionRendererView: setShowBodiedExtensionRendererView
126
128
  }), jsx("div", {
129
+ "data-testid": "extension-container",
127
130
  ref: handleRef,
128
131
  "data-layout": node.attrs.layout
129
132
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -138,7 +141,12 @@ function ExtensionWithPluginState(props) {
138
141
  onMouseEnter: () => handleMouseEvent(true),
139
142
  onMouseLeave: () => handleMouseEvent(false)
140
143
  }, jsx("div", {
141
- className: overflowClassNames,
144
+ "data-testid": "extension-overflow-wrapper"
145
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
146
+ ,
147
+ className: overflowClassNames
148
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
149
+ ,
142
150
  css: overflowWrapperStyles
143
151
  }, jsx("div", {
144
152
  className: 'extension-overlay',
@@ -157,10 +165,16 @@ function ExtensionWithPluginState(props) {
157
165
  }), children), hasBody &&
158
166
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
159
167
  jsx("div", {
160
- css: newContentStyles,
161
- className: newContentClassNames
168
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
169
+ css: newContentStyles
170
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
171
+ ,
172
+ className: newContentClassNames,
173
+ "data-testid": "extension-new-content"
162
174
  }, jsx("div", {
175
+ "data-testid": "extension-content"
163
176
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
177
+ ,
164
178
  css: content,
165
179
  ref: handleContentDOMRef
166
180
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -25,8 +25,8 @@ export const wrapperStyle = css(wrapperDefault, {
25
25
  },
26
26
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
27
27
  '&.with-margin-styles': {
28
- margin: `0 ${"var(--ds-space-negative-150, -12px)"}`,
29
- padding: `0 ${"var(--ds-space-150, 12px)"}`
28
+ margin: `0 ${"var(--ds-space-negative-250, -20px)"}`,
29
+ padding: `0 ${"var(--ds-space-250, 20px)"}`
30
30
  }
31
31
  });
32
32
 
@@ -81,6 +81,10 @@ export const contentWrapper = css({
81
81
  export const overflowWrapperStyles = css({
82
82
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
83
83
  '&.with-margin-styles': {
84
- margin: `0 ${"var(--ds-space-negative-150, -12px)"}`
84
+ margin: `0 ${"var(--ds-space-negative-250, -20px)"}`
85
+ },
86
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
87
+ '&.with-padding-styles': {
88
+ padding: "var(--ds-space-100, 8px)"
85
89
  }
86
90
  });
@@ -1,7 +1,7 @@
1
1
  import { isFedRamp } from './environment';
2
2
  const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
3
3
  const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
4
- const packageVersion = "96.3.5";
4
+ const packageVersion = "96.3.7";
5
5
  const sanitiseSentryEvents = (data, _hint) => {
6
6
  // Remove URL as it has UGC
7
7
  // TODO: Sanitise the URL instead of just removing it
@@ -84,6 +84,7 @@ fg('linking_platform_smart_links_in_live_pages') ? 'pointer' : 'auto'};
84
84
  background-color: ${"var(--ds-background-neutral-subtle, #00000000)"};
85
85
  border-radius: ${"var(--ds-border-radius-200, 8px)"};
86
86
  border: 1px solid ${"var(--ds-border, #091E4224)"};
87
+ overflow: hidden;
87
88
  }
88
89
 
89
90
  &.${akEditorSelectedNodeClassName} {
@@ -13,7 +13,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
13
13
  import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
14
14
  import Layer from '../Layer';
15
15
  const packageName = "@atlaskit/editor-common";
16
- const packageVersion = "96.3.5";
16
+ const packageVersion = "96.3.7";
17
17
  const halfFocusRing = 1;
18
18
  const dropOffset = '0, 8';
19
19
  class DropList extends Component {
@@ -61,15 +61,17 @@ function ExtensionWithPluginState(props) {
61
61
  editorAppearance !== 'full-width';
62
62
  var classNames = classnames('extension-container', 'block', shadowClassNames, _defineProperty({
63
63
  'with-overlay': !hasBody && !showMacroInteractionDesignUpdates,
64
- 'with-bodied-border': showMacroInteractionDesignUpdates && hasBody,
65
- 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested,
64
+ 'with-bodied-border': showMacroInteractionDesignUpdates && hasBody && !showBodiedExtensionRendererView,
65
+ 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested && !showBodiedExtensionRendererView,
66
66
  'with-hover-border': showMacroInteractionDesignUpdates && isNodeHovered,
67
67
  'with-danger-overlay': showMacroInteractionDesignUpdates,
68
68
  'without-frame': removeBorder
69
69
  }, widerLayoutClassName, shouldBreakout));
70
70
  var overflowClassNames = classnames('extension-overflow-wrapper', {
71
71
  'with-body': hasBody,
72
- 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested
72
+ 'with-margin-styles': showMacroInteractionDesignUpdates && !isNodeNested && !showBodiedExtensionRendererView,
73
+ // Adding extra padding for renderer view so users can have a touch target to click on the extension
74
+ 'with-padding-styles': showMacroInteractionDesignUpdates && showBodiedExtensionRendererView
73
75
  });
74
76
  var headerClassNames = classnames({
75
77
  'with-children': hasChildren,
@@ -118,6 +120,7 @@ function ExtensionWithPluginState(props) {
118
120
  showBodiedExtensionRendererView: showBodiedExtensionRendererView,
119
121
  setShowBodiedExtensionRendererView: setShowBodiedExtensionRendererView
120
122
  }), jsx("div", {
123
+ "data-testid": "extension-container",
121
124
  ref: handleRef,
122
125
  "data-layout": node.attrs.layout
123
126
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -136,7 +139,12 @@ function ExtensionWithPluginState(props) {
136
139
  return handleMouseEvent(false);
137
140
  }
138
141
  }, jsx("div", {
139
- className: overflowClassNames,
142
+ "data-testid": "extension-overflow-wrapper"
143
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
144
+ ,
145
+ className: overflowClassNames
146
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values
147
+ ,
140
148
  css: overflowWrapperStyles
141
149
  }, jsx("div", {
142
150
  className: 'extension-overlay',
@@ -155,10 +163,16 @@ function ExtensionWithPluginState(props) {
155
163
  }), children), hasBody &&
156
164
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
157
165
  jsx("div", {
158
- css: newContentStyles,
159
- className: newContentClassNames
166
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
167
+ css: newContentStyles
168
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
169
+ ,
170
+ className: newContentClassNames,
171
+ "data-testid": "extension-new-content"
160
172
  }, jsx("div", {
173
+ "data-testid": "extension-content"
161
174
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
175
+ ,
162
176
  css: content,
163
177
  ref: handleContentDOMRef
164
178
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -25,8 +25,8 @@ export var wrapperStyle = css(wrapperDefault, {
25
25
  },
26
26
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
27
27
  '&.with-margin-styles': {
28
- margin: "0 ".concat("var(--ds-space-negative-150, -12px)"),
29
- padding: "0 ".concat("var(--ds-space-150, 12px)")
28
+ margin: "0 ".concat("var(--ds-space-negative-250, -20px)"),
29
+ padding: "0 ".concat("var(--ds-space-250, 20px)")
30
30
  }
31
31
  });
32
32
 
@@ -81,6 +81,10 @@ export var contentWrapper = css({
81
81
  export var overflowWrapperStyles = css({
82
82
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
83
83
  '&.with-margin-styles': {
84
- margin: "0 ".concat("var(--ds-space-negative-150, -12px)")
84
+ margin: "0 ".concat("var(--ds-space-negative-250, -20px)")
85
+ },
86
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
87
+ '&.with-padding-styles': {
88
+ padding: "var(--ds-space-100, 8px)"
85
89
  }
86
90
  });
@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
7
7
  import { isFedRamp } from './environment';
8
8
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
9
9
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
10
- var packageVersion = "96.3.5";
10
+ var packageVersion = "96.3.7";
11
11
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
12
12
  // Remove URL as it has UGC
13
13
  // TODO: Sanitise the URL instead of just removing it
@@ -10,7 +10,7 @@ export var FLOATING_TOOLBAR_LINKPICKER_CLASSNAME = 'card-floating-toolbar--link-
10
10
 
11
11
  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
12
12
  export var smartCardStyles = function smartCardStyles() {
13
- return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.", " {\n\t\tmax-width: calc(100% - 20px);\n\t\tvertical-align: top;\n\t\tword-break: break-all;\n\t\t", "\n\t\t.card {\n\t\t\tpadding-left: ", ";\n\t\t\tpadding-right: ", ";\n\t\t\tpadding-top: 0.5em;\n\t\t\tpadding-bottom: 0.5em;\n\t\t\tmargin-bottom: -0.5em;\n\n\t\t\t.", " > a:focus {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > a {\n\t\t\t", "\n\t\t}\n\t\t.", " > a {\n\t\t\t/* EDM-1717: box-shadow Safari fix start */\n\t\t\tz-index: 1;\n\t\t\tposition: relative;\n\t\t\t/* EDM-1717: box-shadow Safari fix end */\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " > a {\n\t\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t\t\t/* EDM-1717: box-shadow Safari fix start */\n\t\t\t\tz-index: 2;\n\t\t\t\t/* EDM-1717: box-shadow Safari fix end */\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " > div {\n\t\t\tcursor: ", ";\n\n\t\t\ta {\n\t\t\t\tcursor: ", ";\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > div {\n\t\t\t", "\n\t\t\tborder-radius: ", ";\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " > div {\n\t\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t\t}\n\t\t}\n\t}\n\n\t.", ".", " {\n\t\tmax-width: 100%;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\n\t\t.", " {\n\t\t\tcursor: pointer;\n\t\t\tbackground-color: ", ";\n\t\t\tborder-radius: ", ";\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\n\t\t&.", " {\n\t\t\t.", " {\n\t\t\t\t", "\n\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " {\n\t\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " > div {\n\t\t\tcursor: pointer;\n\t\t\ta {\n\t\t\t\tcursor: ", ";\n\t\t\t}\n\t\t\t&::after {\n\t\t\t\ttransition: box-shadow 0s;\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > div::after {\n\t\t\t", "\n\t\t}\n\n\t\t&.danger {\n\t\t\t.media-card-frame::after {\n\t\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t\t\tbackground: ", " !important;\n\t\t\t}\n\t\t\t.richMedia-resize-handle-right::after,\n\t\t\t.richMedia-resize-handle-left::after {\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\tpadding: 0;\n\t}\n"])), SmartCardSharedCssClassName.INLINE_CARD_CONTAINER, fg('editor_inline_comments_on_inline_nodes') ? ".card-with-comment {\n background: ".concat("var(--ds-background-accent-yellow-subtler, #F8E6A0)", ";\n border-bottom: 2px solid ", "var(--ds-border-accent-yellow, #B38600)", ";\n box-shadow: ", "var(--ds-shadow-overlay, 0px 8px 12px #091E4226, 0px 0px 1px #091E424f)", ";\n }") : '', "var(--ds-space-025, 2px)", "var(--ds-space-025, 2px)", SmartCardSharedCssClassName.LOADER_WRAPPER, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedNodeClassName, SmartCardSharedCssClassName.LOADER_WRAPPER, getSelectionStyles([SelectionStyle.BoxShadow]), SmartCardSharedCssClassName.LOADER_WRAPPER, SmartCardSharedCssClassName.LOADER_WRAPPER, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, SmartCardSharedCssClassName.LOADER_WRAPPER,
13
+ return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t.", " {\n\t\tmax-width: calc(100% - 20px);\n\t\tvertical-align: top;\n\t\tword-break: break-all;\n\t\t", "\n\t\t.card {\n\t\t\tpadding-left: ", ";\n\t\t\tpadding-right: ", ";\n\t\t\tpadding-top: 0.5em;\n\t\t\tpadding-bottom: 0.5em;\n\t\t\tmargin-bottom: -0.5em;\n\n\t\t\t.", " > a:focus {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > a {\n\t\t\t", "\n\t\t}\n\t\t.", " > a {\n\t\t\t/* EDM-1717: box-shadow Safari fix start */\n\t\t\tz-index: 1;\n\t\t\tposition: relative;\n\t\t\t/* EDM-1717: box-shadow Safari fix end */\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " > a {\n\t\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t\t\t/* EDM-1717: box-shadow Safari fix start */\n\t\t\t\tz-index: 2;\n\t\t\t\t/* EDM-1717: box-shadow Safari fix end */\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " > div {\n\t\t\tcursor: ", ";\n\n\t\t\ta {\n\t\t\t\tcursor: ", ";\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > div {\n\t\t\t", "\n\t\t\tborder-radius: ", ";\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " > div {\n\t\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t\t}\n\t\t}\n\t}\n\n\t.", ".", " {\n\t\tmax-width: 100%;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\n\t\t.", " {\n\t\t\tcursor: pointer;\n\t\t\tbackground-color: ", ";\n\t\t\tborder-radius: ", ";\n\t\t\tborder: 1px solid ", ";\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\t&.", " {\n\t\t\t.", " {\n\t\t\t\t", "\n\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t&.danger {\n\t\t\t.", " {\n\t\t\t\tbox-shadow: 0 0 0 1px ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " > div {\n\t\t\tcursor: pointer;\n\t\t\ta {\n\t\t\t\tcursor: ", ";\n\t\t\t}\n\t\t\t&::after {\n\t\t\t\ttransition: box-shadow 0s;\n\t\t\t}\n\t\t}\n\n\t\t&.", " .", " > div::after {\n\t\t\t", "\n\t\t}\n\n\t\t&.danger {\n\t\t\t.media-card-frame::after {\n\t\t\t\tbox-shadow: 0 0 0 1px ", " !important;\n\t\t\t\tbackground: ", " !important;\n\t\t\t}\n\t\t\t.richMedia-resize-handle-right::after,\n\t\t\t.richMedia-resize-handle-left::after {\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\tpadding: 0;\n\t}\n"])), SmartCardSharedCssClassName.INLINE_CARD_CONTAINER, fg('editor_inline_comments_on_inline_nodes') ? ".card-with-comment {\n background: ".concat("var(--ds-background-accent-yellow-subtler, #F8E6A0)", ";\n border-bottom: 2px solid ", "var(--ds-border-accent-yellow, #B38600)", ";\n box-shadow: ", "var(--ds-shadow-overlay, 0px 8px 12px #091E4226, 0px 0px 1px #091E424f)", ";\n }") : '', "var(--ds-space-025, 2px)", "var(--ds-space-025, 2px)", SmartCardSharedCssClassName.LOADER_WRAPPER, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedNodeClassName, SmartCardSharedCssClassName.LOADER_WRAPPER, getSelectionStyles([SelectionStyle.BoxShadow]), SmartCardSharedCssClassName.LOADER_WRAPPER, SmartCardSharedCssClassName.LOADER_WRAPPER, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), SmartCardSharedCssClassName.BLOCK_CARD_CONTAINER, SmartCardSharedCssClassName.LOADER_WRAPPER,
14
14
  // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
15
15
  fg('linking_platform_smart_links_in_live_pages') ? 'text' : 'pointer',
16
16
  // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-registration
@@ -21,7 +21,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
21
21
  import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
22
22
  import Layer from '../Layer';
23
23
  var packageName = "@atlaskit/editor-common";
24
- var packageVersion = "96.3.5";
24
+ var packageVersion = "96.3.7";
25
25
  var halfFocusRing = 1;
26
26
  var dropOffset = '0, 8';
27
27
  var DropList = /*#__PURE__*/function (_Component) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-common",
3
- "version": "96.3.5",
3
+ "version": "96.3.7",
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/"
@@ -130,7 +130,7 @@
130
130
  "@atlaskit/emoji": "^67.11.0",
131
131
  "@atlaskit/icon": "^23.1.0",
132
132
  "@atlaskit/icon-object": "^6.9.0",
133
- "@atlaskit/link-datasource": "^3.14.0",
133
+ "@atlaskit/link-datasource": "^3.15.0",
134
134
  "@atlaskit/link-picker": "^1.47.0",
135
135
  "@atlaskit/media-card": "^78.15.0",
136
136
  "@atlaskit/media-client": "^28.5.0",
@@ -153,9 +153,9 @@
153
153
  "@atlaskit/spinner": "^16.3.0",
154
154
  "@atlaskit/task-decision": "^17.11.0",
155
155
  "@atlaskit/textfield": "^6.7.0",
156
- "@atlaskit/tmp-editor-statsig": "^2.24.0",
156
+ "@atlaskit/tmp-editor-statsig": "^2.25.0",
157
157
  "@atlaskit/tokens": "^2.4.0",
158
- "@atlaskit/tooltip": "^18.9.0",
158
+ "@atlaskit/tooltip": "^19.0.0",
159
159
  "@atlaskit/width-detector": "^4.3.0",
160
160
  "@babel/runtime": "^7.0.0",
161
161
  "@emotion/react": "^11.7.1",