@atlaskit/editor-common 106.1.8 → 106.1.10

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 (25) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/dist/cjs/analytics/types/enums.js +1 -0
  3. package/dist/cjs/extensibility/extensionNodeView.js +17 -0
  4. package/dist/cjs/monitoring/error.js +1 -1
  5. package/dist/cjs/styles/shared/resizer.js +44 -19
  6. package/dist/cjs/ui/DropList/index.js +1 -1
  7. package/dist/es2019/analytics/types/enums.js +1 -0
  8. package/dist/es2019/extensibility/extensionNodeView.js +15 -0
  9. package/dist/es2019/monitoring/error.js +1 -1
  10. package/dist/es2019/styles/shared/resizer.js +44 -19
  11. package/dist/es2019/ui/DropList/index.js +1 -1
  12. package/dist/esm/analytics/types/enums.js +1 -0
  13. package/dist/esm/extensibility/extensionNodeView.js +17 -0
  14. package/dist/esm/monitoring/error.js +1 -1
  15. package/dist/esm/styles/shared/resizer.js +44 -19
  16. package/dist/esm/ui/DropList/index.js +1 -1
  17. package/dist/types/analytics/linking-utils.d.ts +1 -1
  18. package/dist/types/analytics/types/enums.d.ts +1 -0
  19. package/dist/types/analytics/types/node-events.d.ts +1 -1
  20. package/dist/types/extensibility/extensionNodeView.d.ts +11 -0
  21. package/dist/types-ts4.5/analytics/linking-utils.d.ts +1 -1
  22. package/dist/types-ts4.5/analytics/types/enums.d.ts +1 -0
  23. package/dist/types-ts4.5/analytics/types/node-events.d.ts +1 -1
  24. package/dist/types-ts4.5/extensibility/extensionNodeView.d.ts +11 -0
  25. package/package.json +7 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,28 @@
1
1
  # @atlaskit/editor-common
2
2
 
3
+ ## 106.1.10
4
+
5
+ ### Patch Changes
6
+
7
+ - [#165189](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/165189)
8
+ [`648000359d216`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/648000359d216) -
9
+ [ux] PGXT-8152 Add update to test fix for interactions with input elements inside of
10
+ extensions/macros in editor not working because the editor handles the events instead getting in
11
+ the way of the input elements interactions.
12
+
13
+ ## 106.1.9
14
+
15
+ ### Patch Changes
16
+
17
+ - [#164129](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/164129)
18
+ [`ef34428363521`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ef34428363521) -
19
+ [ux] ED-28058 fix left drag handle experience for new resizing under
20
+ platform_editor_breakout_resizing
21
+ - [#163546](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/163546)
22
+ [`d3faab1b963ad`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d3faab1b963ad) -
23
+ [ux] ED-28147 smart link support for cmd/ctrl click to open in new tab
24
+ - Updated dependencies
25
+
3
26
  ## 106.1.8
4
27
 
5
28
  ### Patch Changes
package/dist/cjs/analytics/types/enums.js CHANGED
@@ -227,6 +227,7 @@ var INPUT_METHOD = exports.INPUT_METHOD = /*#__PURE__*/function (INPUT_METHOD) {
227
227
  INPUT_METHOD["MOUSE"] = "mouse";
228
228
  INPUT_METHOD["BROWSER"] = "browser";
229
229
  INPUT_METHOD["DOUBLE_CLICK"] = "doubleClick";
230
+ INPUT_METHOD["META_CLICK"] = "metaClick";
230
231
  INPUT_METHOD["INLINE_SUGGESTION_FLOATING_TB"] = "inlineSuggestionFloatingToolbar";
231
232
  return INPUT_METHOD;
232
233
  }({});
package/dist/cjs/extensibility/extensionNodeView.js CHANGED
@@ -12,6 +12,7 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
12
12
  var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
13
13
  var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
14
14
  var _react = _interopRequireDefault(require("react"));
15
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
15
16
  var _reactNodeView = _interopRequireDefault(require("../react-node-view"));
16
17
  var _Extension = require("./Extension");
17
18
  var _ExtensionNodeWrapper = require("./ExtensionNodeWrapper");
@@ -37,6 +38,22 @@ var ExtensionNode = exports.ExtensionNode = /*#__PURE__*/function (_ReactNodeVie
37
38
  // children a chance to recalc
38
39
  return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
39
40
  }
41
+
42
+ /**
43
+ * When interacting with input elements inside an extension's body, the events
44
+ * bubble up to the editor and get handled by it. This almost always gets in the way
45
+ * of being able to actually interact with said input in the extension, i.e.
46
+ * typing inside a text field (in an extension body) will print the text in the editor
47
+ * content area instead. This change prevents the editor view from trying to handle these events,
48
+ * when the target of the event is an input element, so the extension can.
49
+ *
50
+ * TODO: PGXT-8180 - write tests https://product-fabric.atlassian.net/browse/PGXT-8180
51
+ */
52
+ }, {
53
+ key: "stopEvent",
54
+ value: function stopEvent(event) {
55
+ return event.target instanceof HTMLInputElement && (0, _platformFeatureFlags.fg)('interactable_in_editor_inputs');
56
+ }
40
57
  }, {
41
58
  key: "getContentDOM",
42
59
  value: function getContentDOM() {
package/dist/cjs/monitoring/error.js CHANGED
@@ -16,7 +16,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
16
16
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
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 = "106.1.8";
19
+ var packageVersion = "106.1.10";
20
20
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
21
21
  // Remove URL as it has UGC
22
22
  // Ignored via go/ees007
package/dist/cjs/styles/shared/resizer.js CHANGED
@@ -42,40 +42,40 @@ var pragmaticResizerStyles = exports.pragmaticResizerStyles = function pragmatic
42
42
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
43
43
  '&:has([data-prosemirror-node-name="codeBlock"])': {
44
44
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
45
- '> .pm-breakout-resize-handle-left': {
45
+ '> .pm-breakout-resize-handle-container--left': {
46
46
  left: '-12px'
47
47
  },
48
48
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
49
- '> .pm-breakout-resize-handle-right': {
49
+ '> .pm-breakout-resize-handle-container--right': {
50
50
  right: '-12px'
51
51
  },
52
52
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
53
- '> .pm-breakout-resize-handle': {
53
+ '> .pm-breakout-resize-handle-container': {
54
54
  height: 'calc(100% - 12px)'
55
55
  }
56
56
  },
57
57
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
58
58
  '&:has([data-prosemirror-node-name="expand"]), &:has([data-prosemirror-node-name="layoutSection"])': {
59
59
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
60
- '> .pm-breakout-resize-handle-left': {
60
+ '> .pm-breakout-resize-handle-container--left': {
61
61
  left: '-32px'
62
62
  },
63
63
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
64
- '> .pm-breakout-resize-handle-right': {
64
+ '> .pm-breakout-resize-handle-container--right': {
65
65
  right: '-32px'
66
66
  }
67
67
  },
68
68
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
69
69
  '&:has([data-prosemirror-node-name="expand"])': {
70
70
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
71
- '> .pm-breakout-resize-handle': {
71
+ '> .pm-breakout-resize-handle-container': {
72
72
  height: 'calc(100% - 4px)'
73
73
  }
74
74
  },
75
75
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
76
76
  '&:has([data-prosemirror-node-name="layoutSection"])': {
77
77
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
78
- '> .pm-breakout-resize-handle': {
78
+ '> .pm-breakout-resize-handle-container': {
79
79
  height: 'calc(100% - 8px)'
80
80
  }
81
81
  },
@@ -83,43 +83,68 @@ var pragmaticResizerStyles = exports.pragmaticResizerStyles = function pragmatic
83
83
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
84
84
  '&:has(.first-node-in-document)': {
85
85
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
86
- '> .pm-breakout-resize-handle': {
86
+ '> .pm-breakout-resize-handle-container': {
87
87
  height: '100%'
88
88
  }
89
89
  }
90
90
  },
91
91
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
92
- '.pm-breakout-resize-handle': {
92
+ '.pm-breakout-resize-handle-container': {
93
+ position: 'relative',
94
+ alignSelf: 'end',
95
+ gridRow: 1,
96
+ gridColumn: 1,
97
+ height: '100%',
98
+ width: 7
99
+ },
100
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
101
+ '.pm-breakout-resize-handle-container--left': {
102
+ justifySelf: 'start'
103
+ },
104
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
105
+ '.pm-breakout-resize-handle-container--right': {
106
+ justifySelf: 'end'
107
+ },
108
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
109
+ '.pm-breakout-resize-handle-rail': {
93
110
  position: 'relative',
94
111
  display: 'flex',
95
112
  alignItems: 'center',
96
113
  justifyContent: 'center',
97
114
  height: '100%',
98
- width: 7,
99
- alignSelf: 'end',
100
- gridRow: 1,
101
- gridColumn: 1,
102
115
  cursor: 'col-resize',
103
116
  borderRadius: 4,
104
117
  transition: 'background-color 0.2s, visibility 0.2s, opacity 0.2s',
118
+ zIndex: 2,
119
+ opacity: 0,
105
120
  '&:hover': {
106
121
  background: "var(--ds-background-selected, #E9F2FF)",
107
122
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
108
- '.pm-breakout-resize-handle-inner': {
123
+ '.pm-breakout-resize-handle-thumb': {
109
124
  background: "var(--ds-border-focused, #388BFF)"
110
125
  }
111
126
  }
112
127
  },
128
+ // same as 'hover' styles above
113
129
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
114
- '.pm-breakout-resize-handle-left': {
115
- justifySelf: 'start'
130
+ '.pm-breakout-resize-handle-container--active': {
131
+ background: "var(--ds-background-selected, #E9F2FF)",
132
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
133
+ '.pm-breakout-resize-handle-thumb': {
134
+ background: "var(--ds-border-focused, #388BFF)"
135
+ }
116
136
  },
117
137
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
118
- '.pm-breakout-resize-handle-right': {
119
- justifySelf: 'end'
138
+ '.pm-breakout-resize-handle-hit-box': {
139
+ position: 'absolute',
140
+ top: 0,
141
+ bottom: 0,
142
+ left: -20,
143
+ right: -20,
144
+ zIndex: 0
120
145
  },
121
146
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
122
- '.pm-breakout-resize-handle-inner': {
147
+ '.pm-breakout-resize-handle-thumb': {
123
148
  minWidth: resizerHandleThumbWidth,
124
149
  // copied from resizeStyles.clamped
125
150
  height: 'clamp(27px, calc(100% - 32px), 96px)',
package/dist/cjs/ui/DropList/index.js CHANGED
@@ -23,7 +23,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
23
23
  * @jsx jsx
24
24
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
25
25
  var packageName = "@atlaskit/editor-common";
26
- var packageVersion = "106.1.8";
26
+ var packageVersion = "106.1.10";
27
27
  var halfFocusRing = 1;
28
28
  var dropOffset = '0, 8';
29
29
  // Ignored via go/ees005
package/dist/es2019/analytics/types/enums.js CHANGED
@@ -221,6 +221,7 @@ export let INPUT_METHOD = /*#__PURE__*/function (INPUT_METHOD) {
221
221
  INPUT_METHOD["MOUSE"] = "mouse";
222
222
  INPUT_METHOD["BROWSER"] = "browser";
223
223
  INPUT_METHOD["DOUBLE_CLICK"] = "doubleClick";
224
+ INPUT_METHOD["META_CLICK"] = "metaClick";
224
225
  INPUT_METHOD["INLINE_SUGGESTION_FLOATING_TB"] = "inlineSuggestionFloatingToolbar";
225
226
  return INPUT_METHOD;
226
227
  }({});
package/dist/es2019/extensibility/extensionNodeView.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import React from 'react';
2
+ import { fg } from '@atlaskit/platform-feature-flags';
2
3
  import ReactNodeView from '../react-node-view';
3
4
  import { Extension } from './Extension';
4
5
  import { ExtensionNodeWrapper } from './ExtensionNodeWrapper';
@@ -15,6 +16,20 @@ export class ExtensionNode extends ReactNodeView {
15
16
  // children a chance to recalc
16
17
  return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
17
18
  }
19
+
20
+ /**
21
+ * When interacting with input elements inside an extension's body, the events
22
+ * bubble up to the editor and get handled by it. This almost always gets in the way
23
+ * of being able to actually interact with said input in the extension, i.e.
24
+ * typing inside a text field (in an extension body) will print the text in the editor
25
+ * content area instead. This change prevents the editor view from trying to handle these events,
26
+ * when the target of the event is an input element, so the extension can.
27
+ *
28
+ * TODO: PGXT-8180 - write tests https://product-fabric.atlassian.net/browse/PGXT-8180
29
+ */
30
+ stopEvent(event) {
31
+ return event.target instanceof HTMLInputElement && fg('interactable_in_editor_inputs');
32
+ }
18
33
  getContentDOM() {
19
34
  if (this.node.isInline) {
20
35
  return;
package/dist/es2019/monitoring/error.js CHANGED
@@ -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 = "106.1.8";
4
+ const packageVersion = "106.1.10";
5
5
  const sanitiseSentryEvents = (data, _hint) => {
6
6
  // Remove URL as it has UGC
7
7
  // Ignored via go/ees007
package/dist/es2019/styles/shared/resizer.js CHANGED
@@ -237,40 +237,40 @@ export const pragmaticResizerStyles = () => {
237
237
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
238
238
  '&:has([data-prosemirror-node-name="codeBlock"])': {
239
239
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
240
- '> .pm-breakout-resize-handle-left': {
240
+ '> .pm-breakout-resize-handle-container--left': {
241
241
  left: '-12px'
242
242
  },
243
243
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
244
- '> .pm-breakout-resize-handle-right': {
244
+ '> .pm-breakout-resize-handle-container--right': {
245
245
  right: '-12px'
246
246
  },
247
247
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
248
- '> .pm-breakout-resize-handle': {
248
+ '> .pm-breakout-resize-handle-container': {
249
249
  height: 'calc(100% - 12px)'
250
250
  }
251
251
  },
252
252
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
253
253
  '&:has([data-prosemirror-node-name="expand"]), &:has([data-prosemirror-node-name="layoutSection"])': {
254
254
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
255
- '> .pm-breakout-resize-handle-left': {
255
+ '> .pm-breakout-resize-handle-container--left': {
256
256
  left: '-32px'
257
257
  },
258
258
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
259
- '> .pm-breakout-resize-handle-right': {
259
+ '> .pm-breakout-resize-handle-container--right': {
260
260
  right: '-32px'
261
261
  }
262
262
  },
263
263
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
264
264
  '&:has([data-prosemirror-node-name="expand"])': {
265
265
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
266
- '> .pm-breakout-resize-handle': {
266
+ '> .pm-breakout-resize-handle-container': {
267
267
  height: 'calc(100% - 4px)'
268
268
  }
269
269
  },
270
270
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
271
271
  '&:has([data-prosemirror-node-name="layoutSection"])': {
272
272
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
273
- '> .pm-breakout-resize-handle': {
273
+ '> .pm-breakout-resize-handle-container': {
274
274
  height: 'calc(100% - 8px)'
275
275
  }
276
276
  },
@@ -278,43 +278,68 @@ export const pragmaticResizerStyles = () => {
278
278
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
279
279
  '&:has(.first-node-in-document)': {
280
280
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
281
- '> .pm-breakout-resize-handle': {
281
+ '> .pm-breakout-resize-handle-container': {
282
282
  height: '100%'
283
283
  }
284
284
  }
285
285
  },
286
286
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
287
- '.pm-breakout-resize-handle': {
287
+ '.pm-breakout-resize-handle-container': {
288
+ position: 'relative',
289
+ alignSelf: 'end',
290
+ gridRow: 1,
291
+ gridColumn: 1,
292
+ height: '100%',
293
+ width: 7
294
+ },
295
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
296
+ '.pm-breakout-resize-handle-container--left': {
297
+ justifySelf: 'start'
298
+ },
299
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
300
+ '.pm-breakout-resize-handle-container--right': {
301
+ justifySelf: 'end'
302
+ },
303
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
304
+ '.pm-breakout-resize-handle-rail': {
288
305
  position: 'relative',
289
306
  display: 'flex',
290
307
  alignItems: 'center',
291
308
  justifyContent: 'center',
292
309
  height: '100%',
293
- width: 7,
294
- alignSelf: 'end',
295
- gridRow: 1,
296
- gridColumn: 1,
297
310
  cursor: 'col-resize',
298
311
  borderRadius: 4,
299
312
  transition: 'background-color 0.2s, visibility 0.2s, opacity 0.2s',
313
+ zIndex: 2,
314
+ opacity: 0,
300
315
  '&:hover': {
301
316
  background: "var(--ds-background-selected, #E9F2FF)",
302
317
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
303
- '.pm-breakout-resize-handle-inner': {
318
+ '.pm-breakout-resize-handle-thumb': {
304
319
  background: "var(--ds-border-focused, #388BFF)"
305
320
  }
306
321
  }
307
322
  },
323
+ // same as 'hover' styles above
308
324
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
309
- '.pm-breakout-resize-handle-left': {
310
- justifySelf: 'start'
325
+ '.pm-breakout-resize-handle-container--active': {
326
+ background: "var(--ds-background-selected, #E9F2FF)",
327
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
328
+ '.pm-breakout-resize-handle-thumb': {
329
+ background: "var(--ds-border-focused, #388BFF)"
330
+ }
311
331
  },
312
332
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
313
- '.pm-breakout-resize-handle-right': {
314
- justifySelf: 'end'
333
+ '.pm-breakout-resize-handle-hit-box': {
334
+ position: 'absolute',
335
+ top: 0,
336
+ bottom: 0,
337
+ left: -20,
338
+ right: -20,
339
+ zIndex: 0
315
340
  },
316
341
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
317
- '.pm-breakout-resize-handle-inner': {
342
+ '.pm-breakout-resize-handle-thumb': {
318
343
  minWidth: resizerHandleThumbWidth,
319
344
  // copied from resizeStyles.clamped
320
345
  height: 'clamp(27px, calc(100% - 32px), 96px)',
package/dist/es2019/ui/DropList/index.js CHANGED
@@ -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 = "106.1.8";
16
+ const packageVersion = "106.1.10";
17
17
  const halfFocusRing = 1;
18
18
  const dropOffset = '0, 8';
19
19
  // Ignored via go/ees005
package/dist/esm/analytics/types/enums.js CHANGED
@@ -221,6 +221,7 @@ export var INPUT_METHOD = /*#__PURE__*/function (INPUT_METHOD) {
221
221
  INPUT_METHOD["MOUSE"] = "mouse";
222
222
  INPUT_METHOD["BROWSER"] = "browser";
223
223
  INPUT_METHOD["DOUBLE_CLICK"] = "doubleClick";
224
+ INPUT_METHOD["META_CLICK"] = "metaClick";
224
225
  INPUT_METHOD["INLINE_SUGGESTION_FLOATING_TB"] = "inlineSuggestionFloatingToolbar";
225
226
  return INPUT_METHOD;
226
227
  }({});
package/dist/esm/extensibility/extensionNodeView.js CHANGED
@@ -6,6 +6,7 @@ import _inherits from "@babel/runtime/helpers/inherits";
6
6
  function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
7
7
  function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
8
8
  import React from 'react';
9
+ import { fg } from '@atlaskit/platform-feature-flags';
9
10
  import ReactNodeView from '../react-node-view';
10
11
  import { Extension } from './Extension';
11
12
  import { ExtensionNodeWrapper } from './ExtensionNodeWrapper';
@@ -29,6 +30,22 @@ export var ExtensionNode = /*#__PURE__*/function (_ReactNodeView) {
29
30
  // children a chance to recalc
30
31
  return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
31
32
  }
33
+
34
+ /**
35
+ * When interacting with input elements inside an extension's body, the events
36
+ * bubble up to the editor and get handled by it. This almost always gets in the way
37
+ * of being able to actually interact with said input in the extension, i.e.
38
+ * typing inside a text field (in an extension body) will print the text in the editor
39
+ * content area instead. This change prevents the editor view from trying to handle these events,
40
+ * when the target of the event is an input element, so the extension can.
41
+ *
42
+ * TODO: PGXT-8180 - write tests https://product-fabric.atlassian.net/browse/PGXT-8180
43
+ */
44
+ }, {
45
+ key: "stopEvent",
46
+ value: function stopEvent(event) {
47
+ return event.target instanceof HTMLInputElement && fg('interactable_in_editor_inputs');
48
+ }
32
49
  }, {
33
50
  key: "getContentDOM",
34
51
  value: function getContentDOM() {
package/dist/esm/monitoring/error.js CHANGED
@@ -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 = "106.1.8";
10
+ var packageVersion = "106.1.10";
11
11
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
12
12
  // Remove URL as it has UGC
13
13
  // Ignored via go/ees007
package/dist/esm/styles/shared/resizer.js CHANGED
@@ -36,40 +36,40 @@ export var pragmaticResizerStyles = function pragmaticResizerStyles() {
36
36
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
37
37
  '&:has([data-prosemirror-node-name="codeBlock"])': {
38
38
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
39
- '> .pm-breakout-resize-handle-left': {
39
+ '> .pm-breakout-resize-handle-container--left': {
40
40
  left: '-12px'
41
41
  },
42
42
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
43
- '> .pm-breakout-resize-handle-right': {
43
+ '> .pm-breakout-resize-handle-container--right': {
44
44
  right: '-12px'
45
45
  },
46
46
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
47
- '> .pm-breakout-resize-handle': {
47
+ '> .pm-breakout-resize-handle-container': {
48
48
  height: 'calc(100% - 12px)'
49
49
  }
50
50
  },
51
51
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
52
52
  '&:has([data-prosemirror-node-name="expand"]), &:has([data-prosemirror-node-name="layoutSection"])': {
53
53
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
54
- '> .pm-breakout-resize-handle-left': {
54
+ '> .pm-breakout-resize-handle-container--left': {
55
55
  left: '-32px'
56
56
  },
57
57
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
58
- '> .pm-breakout-resize-handle-right': {
58
+ '> .pm-breakout-resize-handle-container--right': {
59
59
  right: '-32px'
60
60
  }
61
61
  },
62
62
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
63
63
  '&:has([data-prosemirror-node-name="expand"])': {
64
64
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
65
- '> .pm-breakout-resize-handle': {
65
+ '> .pm-breakout-resize-handle-container': {
66
66
  height: 'calc(100% - 4px)'
67
67
  }
68
68
  },
69
69
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
70
70
  '&:has([data-prosemirror-node-name="layoutSection"])': {
71
71
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
72
- '> .pm-breakout-resize-handle': {
72
+ '> .pm-breakout-resize-handle-container': {
73
73
  height: 'calc(100% - 8px)'
74
74
  }
75
75
  },
@@ -77,43 +77,68 @@ export var pragmaticResizerStyles = function pragmaticResizerStyles() {
77
77
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
78
78
  '&:has(.first-node-in-document)': {
79
79
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
80
- '> .pm-breakout-resize-handle': {
80
+ '> .pm-breakout-resize-handle-container': {
81
81
  height: '100%'
82
82
  }
83
83
  }
84
84
  },
85
85
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
86
- '.pm-breakout-resize-handle': {
86
+ '.pm-breakout-resize-handle-container': {
87
+ position: 'relative',
88
+ alignSelf: 'end',
89
+ gridRow: 1,
90
+ gridColumn: 1,
91
+ height: '100%',
92
+ width: 7
93
+ },
94
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
95
+ '.pm-breakout-resize-handle-container--left': {
96
+ justifySelf: 'start'
97
+ },
98
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
99
+ '.pm-breakout-resize-handle-container--right': {
100
+ justifySelf: 'end'
101
+ },
102
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
103
+ '.pm-breakout-resize-handle-rail': {
87
104
  position: 'relative',
88
105
  display: 'flex',
89
106
  alignItems: 'center',
90
107
  justifyContent: 'center',
91
108
  height: '100%',
92
- width: 7,
93
- alignSelf: 'end',
94
- gridRow: 1,
95
- gridColumn: 1,
96
109
  cursor: 'col-resize',
97
110
  borderRadius: 4,
98
111
  transition: 'background-color 0.2s, visibility 0.2s, opacity 0.2s',
112
+ zIndex: 2,
113
+ opacity: 0,
99
114
  '&:hover': {
100
115
  background: "var(--ds-background-selected, #E9F2FF)",
101
116
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
102
- '.pm-breakout-resize-handle-inner': {
117
+ '.pm-breakout-resize-handle-thumb': {
103
118
  background: "var(--ds-border-focused, #388BFF)"
104
119
  }
105
120
  }
106
121
  },
122
+ // same as 'hover' styles above
107
123
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
108
- '.pm-breakout-resize-handle-left': {
109
- justifySelf: 'start'
124
+ '.pm-breakout-resize-handle-container--active': {
125
+ background: "var(--ds-background-selected, #E9F2FF)",
126
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
127
+ '.pm-breakout-resize-handle-thumb': {
128
+ background: "var(--ds-border-focused, #388BFF)"
129
+ }
110
130
  },
111
131
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
112
- '.pm-breakout-resize-handle-right': {
113
- justifySelf: 'end'
132
+ '.pm-breakout-resize-handle-hit-box': {
133
+ position: 'absolute',
134
+ top: 0,
135
+ bottom: 0,
136
+ left: -20,
137
+ right: -20,
138
+ zIndex: 0
114
139
  },
115
140
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
116
- '.pm-breakout-resize-handle-inner': {
141
+ '.pm-breakout-resize-handle-thumb': {
117
142
  minWidth: resizerHandleThumbWidth,
118
143
  // copied from resizeStyles.clamped
119
144
  height: 'clamp(27px, calc(100% - 32px), 96px)',
package/dist/esm/ui/DropList/index.js CHANGED
@@ -20,7 +20,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
20
20
  import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
21
21
  import Layer from '../Layer';
22
22
  var packageName = "@atlaskit/editor-common";
23
- var packageVersion = "106.1.8";
23
+ var packageVersion = "106.1.10";
24
24
  var halfFocusRing = 1;
25
25
  var dropOffset = '0, 8';
26
26
  // Ignored via go/ees005
package/dist/types/analytics/linking-utils.d.ts CHANGED
@@ -3,7 +3,7 @@ import type { AnalyticsEventPayload } from './types/events';
3
3
  export declare const buildEditLinkPayload: (type: LinkType) => AnalyticsEventPayload;
4
4
  export type LinkType = ACTION_SUBJECT_ID.CARD_INLINE | ACTION_SUBJECT_ID.CARD_BLOCK | ACTION_SUBJECT_ID.EMBEDS | ACTION_SUBJECT_ID.HYPERLINK;
5
5
  export declare const buildVisitedLinkPayload: (type: LinkType) => AnalyticsEventPayload;
6
- export declare const buildVisitedNonHyperLinkPayload: (type: LinkType, inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK | INPUT_METHOD.FLOATING_TB) => AnalyticsEventPayload;
6
+ export declare const buildVisitedNonHyperLinkPayload: (type: LinkType, inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK | INPUT_METHOD.FLOATING_TB | INPUT_METHOD.META_CLICK) => AnalyticsEventPayload;
7
7
  export declare const buildOpenedSettingsPayload: (type: LinkType) => AnalyticsEventPayload;
8
8
  export declare const unlinkPayload: (type: LinkType) => {
9
9
  action: ACTION;
package/dist/types/analytics/types/enums.d.ts CHANGED
@@ -219,6 +219,7 @@ export declare enum INPUT_METHOD {
219
219
  MOUSE = "mouse",
220
220
  BROWSER = "browser",
221
221
  DOUBLE_CLICK = "doubleClick",
222
+ META_CLICK = "metaClick",
222
223
  INLINE_SUGGESTION_FLOATING_TB = "inlineSuggestionFloatingToolbar"
223
224
  }
224
225
  export declare enum INSERT_MEDIA_VIA {
package/dist/types/analytics/types/node-events.d.ts CHANGED
@@ -28,7 +28,7 @@ type ChangeSmartLinkAEP = ChangeTypeAEP<ACTION_SUBJECT.SMART_LINK, undefined, {
28
28
  previousType: SMART_LINK_TYPE;
29
29
  }, undefined>;
30
30
  type VisitedSmartLink = TrackAEP<ACTION.VISITED, ACTION_SUBJECT.SMART_LINK, ACTION_SUBJECT_ID.CARD_BLOCK | ACTION_SUBJECT_ID.CARD_INLINE, {
31
- inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.FLOATING_TB | INPUT_METHOD.BUTTON | INPUT_METHOD.CARD | INPUT_METHOD.DOUBLE_CLICK;
31
+ inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.FLOATING_TB | INPUT_METHOD.BUTTON | INPUT_METHOD.CARD | INPUT_METHOD.DOUBLE_CLICK | INPUT_METHOD.META_CLICK;
32
32
  }, undefined>;
33
33
  type VisitedHyperlink = TrackAEP<ACTION.VISITED, ACTION_SUBJECT.HYPERLINK, undefined, {
34
34
  inputMethod: INPUT_METHOD.TOOLBAR;
package/dist/types/extensibility/extensionNodeView.d.ts CHANGED
@@ -19,6 +19,17 @@ export declare class ExtensionNode extends ReactNodeView {
19
19
  type: 'selection';
20
20
  target: Node;
21
21
  }): boolean;
22
+ /**
23
+ * When interacting with input elements inside an extension's body, the events
24
+ * bubble up to the editor and get handled by it. This almost always gets in the way
25
+ * of being able to actually interact with said input in the extension, i.e.
26
+ * typing inside a text field (in an extension body) will print the text in the editor
27
+ * content area instead. This change prevents the editor view from trying to handle these events,
28
+ * when the target of the event is an input element, so the extension can.
29
+ *
30
+ * TODO: PGXT-8180 - write tests https://product-fabric.atlassian.net/browse/PGXT-8180
31
+ */
32
+ stopEvent(event: Event): boolean;
22
33
  getContentDOM(): {
23
34
  dom: HTMLDivElement;
24
35
  } | undefined;
package/dist/types-ts4.5/analytics/linking-utils.d.ts CHANGED
@@ -3,7 +3,7 @@ import type { AnalyticsEventPayload } from './types/events';
3
3
  export declare const buildEditLinkPayload: (type: LinkType) => AnalyticsEventPayload;
4
4
  export type LinkType = ACTION_SUBJECT_ID.CARD_INLINE | ACTION_SUBJECT_ID.CARD_BLOCK | ACTION_SUBJECT_ID.EMBEDS | ACTION_SUBJECT_ID.HYPERLINK;
5
5
  export declare const buildVisitedLinkPayload: (type: LinkType) => AnalyticsEventPayload;
6
- export declare const buildVisitedNonHyperLinkPayload: (type: LinkType, inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK | INPUT_METHOD.FLOATING_TB) => AnalyticsEventPayload;
6
+ export declare const buildVisitedNonHyperLinkPayload: (type: LinkType, inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.BUTTON | INPUT_METHOD.DOUBLE_CLICK | INPUT_METHOD.FLOATING_TB | INPUT_METHOD.META_CLICK) => AnalyticsEventPayload;
7
7
  export declare const buildOpenedSettingsPayload: (type: LinkType) => AnalyticsEventPayload;
8
8
  export declare const unlinkPayload: (type: LinkType) => {
9
9
  action: ACTION;
package/dist/types-ts4.5/analytics/types/enums.d.ts CHANGED
@@ -219,6 +219,7 @@ export declare enum INPUT_METHOD {
219
219
  MOUSE = "mouse",
220
220
  BROWSER = "browser",
221
221
  DOUBLE_CLICK = "doubleClick",
222
+ META_CLICK = "metaClick",
222
223
  INLINE_SUGGESTION_FLOATING_TB = "inlineSuggestionFloatingToolbar"
223
224
  }
224
225
  export declare enum INSERT_MEDIA_VIA {
package/dist/types-ts4.5/analytics/types/node-events.d.ts CHANGED
@@ -28,7 +28,7 @@ type ChangeSmartLinkAEP = ChangeTypeAEP<ACTION_SUBJECT.SMART_LINK, undefined, {
28
28
  previousType: SMART_LINK_TYPE;
29
29
  }, undefined>;
30
30
  type VisitedSmartLink = TrackAEP<ACTION.VISITED, ACTION_SUBJECT.SMART_LINK, ACTION_SUBJECT_ID.CARD_BLOCK | ACTION_SUBJECT_ID.CARD_INLINE, {
31
- inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.FLOATING_TB | INPUT_METHOD.BUTTON | INPUT_METHOD.CARD | INPUT_METHOD.DOUBLE_CLICK;
31
+ inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.FLOATING_TB | INPUT_METHOD.BUTTON | INPUT_METHOD.CARD | INPUT_METHOD.DOUBLE_CLICK | INPUT_METHOD.META_CLICK;
32
32
  }, undefined>;
33
33
  type VisitedHyperlink = TrackAEP<ACTION.VISITED, ACTION_SUBJECT.HYPERLINK, undefined, {
34
34
  inputMethod: INPUT_METHOD.TOOLBAR;
package/dist/types-ts4.5/extensibility/extensionNodeView.d.ts CHANGED
@@ -19,6 +19,17 @@ export declare class ExtensionNode extends ReactNodeView {
19
19
  type: 'selection';
20
20
  target: Node;
21
21
  }): boolean;
22
+ /**
23
+ * When interacting with input elements inside an extension's body, the events
24
+ * bubble up to the editor and get handled by it. This almost always gets in the way
25
+ * of being able to actually interact with said input in the extension, i.e.
26
+ * typing inside a text field (in an extension body) will print the text in the editor
27
+ * content area instead. This change prevents the editor view from trying to handle these events,
28
+ * when the target of the event is an input element, so the extension can.
29
+ *
30
+ * TODO: PGXT-8180 - write tests https://product-fabric.atlassian.net/browse/PGXT-8180
31
+ */
32
+ stopEvent(event: Event): boolean;
22
33
  getContentDOM(): {
23
34
  dom: HTMLDivElement;
24
35
  } | undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-common",
3
- "version": "106.1.8",
3
+ "version": "106.1.10",
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/"
@@ -163,15 +163,15 @@
163
163
  "@atlaskit/profilecard": "^23.16.0",
164
164
  "@atlaskit/react-ufo": "^3.13.0",
165
165
  "@atlaskit/section-message": "^8.2.0",
166
- "@atlaskit/smart-card": "^38.5.0",
166
+ "@atlaskit/smart-card": "^38.6.0",
167
167
  "@atlaskit/smart-user-picker": "^8.0.0",
168
168
  "@atlaskit/spinner": "^18.0.0",
169
169
  "@atlaskit/task-decision": "^19.2.0",
170
170
  "@atlaskit/textfield": "^8.0.0",
171
171
  "@atlaskit/theme": "^18.0.0",
172
- "@atlaskit/tmp-editor-statsig": "^5.8.0",
172
+ "@atlaskit/tmp-editor-statsig": "^5.11.0",
173
173
  "@atlaskit/tokens": "^5.0.0",
174
- "@atlaskit/tooltip": "^20.2.0",
174
+ "@atlaskit/tooltip": "^20.3.0",
175
175
  "@atlaskit/width-detector": "^5.0.0",
176
176
  "@babel/runtime": "^7.0.0",
177
177
  "@compiled/react": "^0.18.3",
@@ -393,6 +393,9 @@
393
393
  },
394
394
  "confluence_preload_forge_viewport_heights_editor": {
395
395
  "type": "boolean"
396
+ },
397
+ "interactable_in_editor_inputs": {
398
+ "type": "boolean"
396
399
  }
397
400
  }
398
401
  }