@atlaskit/editor-plugin-layout 23.0.9 → 24.0.0
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,22 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-layout
|
|
2
2
|
|
|
3
|
+
## 24.0.0
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 23.0.10
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`5655e3d4d88fc`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5655e3d4d88fc) -
|
|
14
|
+
Clean up experiment `platform_editor_reduce_event_listener_count`. The treatment behaviour is now
|
|
15
|
+
permanent: node views that render nothing no longer mount a React portal, breakout resize tooltips
|
|
16
|
+
mount on first hover, and layout column dividers are keyed by section ordinal and found via a
|
|
17
|
+
scoped document walk.
|
|
18
|
+
- Updated dependencies
|
|
19
|
+
|
|
3
20
|
## 23.0.9
|
|
4
21
|
|
|
5
22
|
### Patch Changes
|
|
@@ -11,7 +11,6 @@ var _analytics = require("@atlaskit/editor-common/analytics");
|
|
|
11
11
|
var _model = require("@atlaskit/editor-prosemirror/model");
|
|
12
12
|
var _state = require("@atlaskit/editor-prosemirror/state");
|
|
13
13
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
14
|
-
var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
|
|
15
14
|
var _consts = require("./consts");
|
|
16
15
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
17
16
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
@@ -255,22 +254,12 @@ var onDragCancel = function onDragCancel() {
|
|
|
255
254
|
/**
|
|
256
255
|
* Resolves the layout section a divider sits in and which pair of columns it separates.
|
|
257
256
|
*
|
|
258
|
-
*
|
|
259
|
-
*
|
|
260
|
-
*
|
|
261
|
-
*
|
|
262
|
-
* and rebuild all of them. Without `getPos` it falls back to the values captured when the widget
|
|
263
|
-
* was created.
|
|
257
|
+
* This is derived from the widget's own live position, which ProseMirror keeps up to date. That is
|
|
258
|
+
* what lets the decoration key omit the section position: the key previously embedded it, so
|
|
259
|
+
* inserting a single character above a layout changed the key of every divider below and forced
|
|
260
|
+
* ProseMirror to destroy and rebuild all of them.
|
|
264
261
|
*/
|
|
265
|
-
var resolveDividerTarget = function resolveDividerTarget(view,
|
|
266
|
-
if (!getPos) {
|
|
267
|
-
var sectionNode = view.state.doc.nodeAt(sectionPos);
|
|
268
|
-
return sectionNode ? {
|
|
269
|
-
sectionNode: sectionNode,
|
|
270
|
-
sectionPos: sectionPos,
|
|
271
|
-
leftColIndex: columnIndex - 1
|
|
272
|
-
} : null;
|
|
273
|
-
}
|
|
262
|
+
var resolveDividerTarget = function resolveDividerTarget(view, getPos) {
|
|
274
263
|
var pos = getPos();
|
|
275
264
|
if (pos === undefined) {
|
|
276
265
|
return null;
|
|
@@ -296,7 +285,7 @@ var resolveDividerTarget = function resolveDividerTarget(view, sectionPos, colum
|
|
|
296
285
|
* column DOM elements for zero-overhead visual feedback (no PM transactions).
|
|
297
286
|
* A single undoable PM transaction is dispatched on mouseup to commit the final widths.
|
|
298
287
|
*/
|
|
299
|
-
var createColumnDividerWidget = function createColumnDividerWidget(view,
|
|
288
|
+
var createColumnDividerWidget = function createColumnDividerWidget(view, getPos, editorAnalyticsAPI) {
|
|
300
289
|
var ownerDoc = view.dom.ownerDocument;
|
|
301
290
|
|
|
302
291
|
// Outer container: wide transparent hit area for easy grabbing, zero flex footprint
|
|
@@ -319,7 +308,7 @@ var createColumnDividerWidget = function createColumnDividerWidget(view, section
|
|
|
319
308
|
var _ownerDoc$defaultView;
|
|
320
309
|
e.preventDefault();
|
|
321
310
|
e.stopPropagation();
|
|
322
|
-
var resolved = resolveDividerTarget(view,
|
|
311
|
+
var resolved = resolveDividerTarget(view, getPos);
|
|
323
312
|
if (!resolved) {
|
|
324
313
|
return;
|
|
325
314
|
}
|
|
@@ -436,10 +425,6 @@ var getColumnDividerDecorations = exports.getColumnDividerDecorations = function
|
|
|
436
425
|
var _state$schema$nodes = state.schema.nodes,
|
|
437
426
|
layoutSection = _state$schema$nodes.layoutSection,
|
|
438
427
|
bodiedSyncBlock = _state$schema$nodes.bodiedSyncBlock;
|
|
439
|
-
|
|
440
|
-
// Read once per call: `isExperimentEnabled` fires an exposure event, so checking it per divider
|
|
441
|
-
// would emit one per divider per `decorations(state)` read.
|
|
442
|
-
var isScopedWalkEnabled = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_reduce_event_listener_count');
|
|
443
428
|
var sectionIndex = 0;
|
|
444
429
|
state.doc.descendants(function (node, pos) {
|
|
445
430
|
if (node.type === layoutSection) {
|
|
@@ -449,50 +434,37 @@ var getColumnDividerDecorations = exports.getColumnDividerDecorations = function
|
|
|
449
434
|
node.forEach(function (_, offset, index) {
|
|
450
435
|
// Add a divider widget BEFORE every column except the first
|
|
451
436
|
if (index > 0) {
|
|
452
|
-
var sectionPos = pos;
|
|
453
|
-
var colIndex = index;
|
|
454
437
|
var widgetPos = pos + offset + 1; // position at the start of this column
|
|
455
438
|
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
//
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
unbindMouseDown =
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
side: -1,
|
|
486
|
-
// place before the position
|
|
487
|
-
key: "layout-col-divider-".concat(sectionOrdinal, "-").concat(index),
|
|
488
|
-
ignoreSelection: true,
|
|
489
|
-
destroy: function destroy() {
|
|
490
|
-
var _unbindMouseDown;
|
|
491
|
-
(_unbindMouseDown = unbindMouseDown) === null || _unbindMouseDown === void 0 || _unbindMouseDown();
|
|
492
|
-
unbindMouseDown = undefined;
|
|
493
|
-
}
|
|
494
|
-
}));
|
|
495
|
-
}
|
|
439
|
+
// Keyed by the layout's ordinal rather than its position, so an edit elsewhere in
|
|
440
|
+
// the document doesn't invalidate it. A position-derived key changed on every
|
|
441
|
+
// keystroke above a layout, making the regenerated DecorationSet compare unequal
|
|
442
|
+
// and forcing ProseMirror to destroy and rebuild every divider below the edit. The
|
|
443
|
+
// widget resolves its own section from `getPos` (see `resolveDividerTarget`), so it
|
|
444
|
+
// stays correct wherever it ends up.
|
|
445
|
+
//
|
|
446
|
+
// `toDOM` must also stay lazy: most of the `Decoration`s returned here are matched
|
|
447
|
+
// by key against the previous set and discarded without ever being rendered.
|
|
448
|
+
// Building the widget eagerly would create three elements and bind a `mousedown`
|
|
449
|
+
// listener per divider per call, and the discarded ones never receive `destroy`.
|
|
450
|
+
var unbindMouseDown;
|
|
451
|
+
decorations.push(_view.Decoration.widget(widgetPos, function (widgetView, getPos) {
|
|
452
|
+
var _createColumnDividerW = createColumnDividerWidget(widgetView, getPos, editorAnalyticsAPI),
|
|
453
|
+
target = _createColumnDividerW.target,
|
|
454
|
+
destroy = _createColumnDividerW.destroy;
|
|
455
|
+
unbindMouseDown = destroy;
|
|
456
|
+
return target;
|
|
457
|
+
}, {
|
|
458
|
+
side: -1,
|
|
459
|
+
// place before the position
|
|
460
|
+
key: "layout-col-divider-".concat(sectionOrdinal, "-").concat(index),
|
|
461
|
+
ignoreSelection: true,
|
|
462
|
+
destroy: function destroy() {
|
|
463
|
+
var _unbindMouseDown;
|
|
464
|
+
(_unbindMouseDown = unbindMouseDown) === null || _unbindMouseDown === void 0 || _unbindMouseDown();
|
|
465
|
+
unbindMouseDown = undefined;
|
|
466
|
+
}
|
|
467
|
+
}));
|
|
496
468
|
}
|
|
497
469
|
});
|
|
498
470
|
return false; // don't descend into children
|
|
@@ -500,7 +472,7 @@ var getColumnDividerDecorations = exports.getColumnDividerDecorations = function
|
|
|
500
472
|
// A `layoutSection` is only valid as a direct child of `doc` or `bodiedSyncBlock`, so there
|
|
501
473
|
// is nothing to find anywhere else. The unrestricted walk visited every node in the
|
|
502
474
|
// document — every table cell, list item and text node — on every `decorations(state)` read.
|
|
503
|
-
return
|
|
475
|
+
return node.type === bodiedSyncBlock;
|
|
504
476
|
});
|
|
505
477
|
return decorations;
|
|
506
478
|
};
|
|
@@ -3,7 +3,6 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } f
|
|
|
3
3
|
import { Fragment } from '@atlaskit/editor-prosemirror/model';
|
|
4
4
|
import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
|
|
5
5
|
import { Decoration } from '@atlaskit/editor-prosemirror/view';
|
|
6
|
-
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
7
6
|
import { MIN_LAYOUT_COLUMN_WIDTH_PERCENT } from './consts';
|
|
8
7
|
|
|
9
8
|
/**
|
|
@@ -251,22 +250,12 @@ const onDragCancel = () => {
|
|
|
251
250
|
/**
|
|
252
251
|
* Resolves the layout section a divider sits in and which pair of columns it separates.
|
|
253
252
|
*
|
|
254
|
-
*
|
|
255
|
-
*
|
|
256
|
-
*
|
|
257
|
-
*
|
|
258
|
-
* and rebuild all of them. Without `getPos` it falls back to the values captured when the widget
|
|
259
|
-
* was created.
|
|
253
|
+
* This is derived from the widget's own live position, which ProseMirror keeps up to date. That is
|
|
254
|
+
* what lets the decoration key omit the section position: the key previously embedded it, so
|
|
255
|
+
* inserting a single character above a layout changed the key of every divider below and forced
|
|
256
|
+
* ProseMirror to destroy and rebuild all of them.
|
|
260
257
|
*/
|
|
261
|
-
const resolveDividerTarget = (view,
|
|
262
|
-
if (!getPos) {
|
|
263
|
-
const sectionNode = view.state.doc.nodeAt(sectionPos);
|
|
264
|
-
return sectionNode ? {
|
|
265
|
-
sectionNode,
|
|
266
|
-
sectionPos,
|
|
267
|
-
leftColIndex: columnIndex - 1
|
|
268
|
-
} : null;
|
|
269
|
-
}
|
|
258
|
+
const resolveDividerTarget = (view, getPos) => {
|
|
270
259
|
const pos = getPos();
|
|
271
260
|
if (pos === undefined) {
|
|
272
261
|
return null;
|
|
@@ -292,7 +281,7 @@ const resolveDividerTarget = (view, sectionPos, columnIndex, getPos) => {
|
|
|
292
281
|
* column DOM elements for zero-overhead visual feedback (no PM transactions).
|
|
293
282
|
* A single undoable PM transaction is dispatched on mouseup to commit the final widths.
|
|
294
283
|
*/
|
|
295
|
-
const createColumnDividerWidget = (view,
|
|
284
|
+
const createColumnDividerWidget = (view, getPos, editorAnalyticsAPI) => {
|
|
296
285
|
const ownerDoc = view.dom.ownerDocument;
|
|
297
286
|
|
|
298
287
|
// Outer container: wide transparent hit area for easy grabbing, zero flex footprint
|
|
@@ -315,7 +304,7 @@ const createColumnDividerWidget = (view, sectionPos, columnIndex, editorAnalytic
|
|
|
315
304
|
var _ownerDoc$defaultView;
|
|
316
305
|
e.preventDefault();
|
|
317
306
|
e.stopPropagation();
|
|
318
|
-
const resolved = resolveDividerTarget(view,
|
|
307
|
+
const resolved = resolveDividerTarget(view, getPos);
|
|
319
308
|
if (!resolved) {
|
|
320
309
|
return;
|
|
321
310
|
}
|
|
@@ -435,10 +424,6 @@ export const getColumnDividerDecorations = (state, view, editorAnalyticsAPI) =>
|
|
|
435
424
|
layoutSection,
|
|
436
425
|
bodiedSyncBlock
|
|
437
426
|
} = state.schema.nodes;
|
|
438
|
-
|
|
439
|
-
// Read once per call: `isExperimentEnabled` fires an exposure event, so checking it per divider
|
|
440
|
-
// would emit one per divider per `decorations(state)` read.
|
|
441
|
-
const isScopedWalkEnabled = isExperimentEnabled('platform_editor_reduce_event_listener_count');
|
|
442
427
|
let sectionIndex = 0;
|
|
443
428
|
state.doc.descendants((node, pos) => {
|
|
444
429
|
if (node.type === layoutSection) {
|
|
@@ -448,49 +433,38 @@ export const getColumnDividerDecorations = (state, view, editorAnalyticsAPI) =>
|
|
|
448
433
|
node.forEach((_, offset, index) => {
|
|
449
434
|
// Add a divider widget BEFORE every column except the first
|
|
450
435
|
if (index > 0) {
|
|
451
|
-
const sectionPos = pos;
|
|
452
|
-
const colIndex = index;
|
|
453
436
|
const widgetPos = pos + offset + 1; // position at the start of this column
|
|
454
437
|
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
key: `layout-col-divider-${sectionOrdinal}-${index}`,
|
|
486
|
-
ignoreSelection: true,
|
|
487
|
-
destroy: () => {
|
|
488
|
-
var _unbindMouseDown;
|
|
489
|
-
(_unbindMouseDown = unbindMouseDown) === null || _unbindMouseDown === void 0 ? void 0 : _unbindMouseDown();
|
|
490
|
-
unbindMouseDown = undefined;
|
|
491
|
-
}
|
|
492
|
-
}));
|
|
493
|
-
}
|
|
438
|
+
// Keyed by the layout's ordinal rather than its position, so an edit elsewhere in
|
|
439
|
+
// the document doesn't invalidate it. A position-derived key changed on every
|
|
440
|
+
// keystroke above a layout, making the regenerated DecorationSet compare unequal
|
|
441
|
+
// and forcing ProseMirror to destroy and rebuild every divider below the edit. The
|
|
442
|
+
// widget resolves its own section from `getPos` (see `resolveDividerTarget`), so it
|
|
443
|
+
// stays correct wherever it ends up.
|
|
444
|
+
//
|
|
445
|
+
// `toDOM` must also stay lazy: most of the `Decoration`s returned here are matched
|
|
446
|
+
// by key against the previous set and discarded without ever being rendered.
|
|
447
|
+
// Building the widget eagerly would create three elements and bind a `mousedown`
|
|
448
|
+
// listener per divider per call, and the discarded ones never receive `destroy`.
|
|
449
|
+
let unbindMouseDown;
|
|
450
|
+
decorations.push(Decoration.widget(widgetPos, (widgetView, getPos) => {
|
|
451
|
+
const {
|
|
452
|
+
target,
|
|
453
|
+
destroy
|
|
454
|
+
} = createColumnDividerWidget(widgetView, getPos, editorAnalyticsAPI);
|
|
455
|
+
unbindMouseDown = destroy;
|
|
456
|
+
return target;
|
|
457
|
+
}, {
|
|
458
|
+
side: -1,
|
|
459
|
+
// place before the position
|
|
460
|
+
key: `layout-col-divider-${sectionOrdinal}-${index}`,
|
|
461
|
+
ignoreSelection: true,
|
|
462
|
+
destroy: () => {
|
|
463
|
+
var _unbindMouseDown;
|
|
464
|
+
(_unbindMouseDown = unbindMouseDown) === null || _unbindMouseDown === void 0 ? void 0 : _unbindMouseDown();
|
|
465
|
+
unbindMouseDown = undefined;
|
|
466
|
+
}
|
|
467
|
+
}));
|
|
494
468
|
}
|
|
495
469
|
});
|
|
496
470
|
return false; // don't descend into children
|
|
@@ -498,7 +472,7 @@ export const getColumnDividerDecorations = (state, view, editorAnalyticsAPI) =>
|
|
|
498
472
|
// A `layoutSection` is only valid as a direct child of `doc` or `bodiedSyncBlock`, so there
|
|
499
473
|
// is nothing to find anywhere else. The unrestricted walk visited every node in the
|
|
500
474
|
// document — every table cell, list item and text node — on every `decorations(state)` read.
|
|
501
|
-
return
|
|
475
|
+
return node.type === bodiedSyncBlock;
|
|
502
476
|
});
|
|
503
477
|
return decorations;
|
|
504
478
|
};
|
|
@@ -6,7 +6,6 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } f
|
|
|
6
6
|
import { Fragment } from '@atlaskit/editor-prosemirror/model';
|
|
7
7
|
import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
|
|
8
8
|
import { Decoration } from '@atlaskit/editor-prosemirror/view';
|
|
9
|
-
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
10
9
|
import { MIN_LAYOUT_COLUMN_WIDTH_PERCENT } from './consts';
|
|
11
10
|
|
|
12
11
|
/**
|
|
@@ -249,22 +248,12 @@ var onDragCancel = function onDragCancel() {
|
|
|
249
248
|
/**
|
|
250
249
|
* Resolves the layout section a divider sits in and which pair of columns it separates.
|
|
251
250
|
*
|
|
252
|
-
*
|
|
253
|
-
*
|
|
254
|
-
*
|
|
255
|
-
*
|
|
256
|
-
* and rebuild all of them. Without `getPos` it falls back to the values captured when the widget
|
|
257
|
-
* was created.
|
|
251
|
+
* This is derived from the widget's own live position, which ProseMirror keeps up to date. That is
|
|
252
|
+
* what lets the decoration key omit the section position: the key previously embedded it, so
|
|
253
|
+
* inserting a single character above a layout changed the key of every divider below and forced
|
|
254
|
+
* ProseMirror to destroy and rebuild all of them.
|
|
258
255
|
*/
|
|
259
|
-
var resolveDividerTarget = function resolveDividerTarget(view,
|
|
260
|
-
if (!getPos) {
|
|
261
|
-
var sectionNode = view.state.doc.nodeAt(sectionPos);
|
|
262
|
-
return sectionNode ? {
|
|
263
|
-
sectionNode: sectionNode,
|
|
264
|
-
sectionPos: sectionPos,
|
|
265
|
-
leftColIndex: columnIndex - 1
|
|
266
|
-
} : null;
|
|
267
|
-
}
|
|
256
|
+
var resolveDividerTarget = function resolveDividerTarget(view, getPos) {
|
|
268
257
|
var pos = getPos();
|
|
269
258
|
if (pos === undefined) {
|
|
270
259
|
return null;
|
|
@@ -290,7 +279,7 @@ var resolveDividerTarget = function resolveDividerTarget(view, sectionPos, colum
|
|
|
290
279
|
* column DOM elements for zero-overhead visual feedback (no PM transactions).
|
|
291
280
|
* A single undoable PM transaction is dispatched on mouseup to commit the final widths.
|
|
292
281
|
*/
|
|
293
|
-
var createColumnDividerWidget = function createColumnDividerWidget(view,
|
|
282
|
+
var createColumnDividerWidget = function createColumnDividerWidget(view, getPos, editorAnalyticsAPI) {
|
|
294
283
|
var ownerDoc = view.dom.ownerDocument;
|
|
295
284
|
|
|
296
285
|
// Outer container: wide transparent hit area for easy grabbing, zero flex footprint
|
|
@@ -313,7 +302,7 @@ var createColumnDividerWidget = function createColumnDividerWidget(view, section
|
|
|
313
302
|
var _ownerDoc$defaultView;
|
|
314
303
|
e.preventDefault();
|
|
315
304
|
e.stopPropagation();
|
|
316
|
-
var resolved = resolveDividerTarget(view,
|
|
305
|
+
var resolved = resolveDividerTarget(view, getPos);
|
|
317
306
|
if (!resolved) {
|
|
318
307
|
return;
|
|
319
308
|
}
|
|
@@ -430,10 +419,6 @@ export var getColumnDividerDecorations = function getColumnDividerDecorations(st
|
|
|
430
419
|
var _state$schema$nodes = state.schema.nodes,
|
|
431
420
|
layoutSection = _state$schema$nodes.layoutSection,
|
|
432
421
|
bodiedSyncBlock = _state$schema$nodes.bodiedSyncBlock;
|
|
433
|
-
|
|
434
|
-
// Read once per call: `isExperimentEnabled` fires an exposure event, so checking it per divider
|
|
435
|
-
// would emit one per divider per `decorations(state)` read.
|
|
436
|
-
var isScopedWalkEnabled = isExperimentEnabled('platform_editor_reduce_event_listener_count');
|
|
437
422
|
var sectionIndex = 0;
|
|
438
423
|
state.doc.descendants(function (node, pos) {
|
|
439
424
|
if (node.type === layoutSection) {
|
|
@@ -443,50 +428,37 @@ export var getColumnDividerDecorations = function getColumnDividerDecorations(st
|
|
|
443
428
|
node.forEach(function (_, offset, index) {
|
|
444
429
|
// Add a divider widget BEFORE every column except the first
|
|
445
430
|
if (index > 0) {
|
|
446
|
-
var sectionPos = pos;
|
|
447
|
-
var colIndex = index;
|
|
448
431
|
var widgetPos = pos + offset + 1; // position at the start of this column
|
|
449
432
|
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
//
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
unbindMouseDown =
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
side: -1,
|
|
480
|
-
// place before the position
|
|
481
|
-
key: "layout-col-divider-".concat(sectionOrdinal, "-").concat(index),
|
|
482
|
-
ignoreSelection: true,
|
|
483
|
-
destroy: function destroy() {
|
|
484
|
-
var _unbindMouseDown;
|
|
485
|
-
(_unbindMouseDown = unbindMouseDown) === null || _unbindMouseDown === void 0 || _unbindMouseDown();
|
|
486
|
-
unbindMouseDown = undefined;
|
|
487
|
-
}
|
|
488
|
-
}));
|
|
489
|
-
}
|
|
433
|
+
// Keyed by the layout's ordinal rather than its position, so an edit elsewhere in
|
|
434
|
+
// the document doesn't invalidate it. A position-derived key changed on every
|
|
435
|
+
// keystroke above a layout, making the regenerated DecorationSet compare unequal
|
|
436
|
+
// and forcing ProseMirror to destroy and rebuild every divider below the edit. The
|
|
437
|
+
// widget resolves its own section from `getPos` (see `resolveDividerTarget`), so it
|
|
438
|
+
// stays correct wherever it ends up.
|
|
439
|
+
//
|
|
440
|
+
// `toDOM` must also stay lazy: most of the `Decoration`s returned here are matched
|
|
441
|
+
// by key against the previous set and discarded without ever being rendered.
|
|
442
|
+
// Building the widget eagerly would create three elements and bind a `mousedown`
|
|
443
|
+
// listener per divider per call, and the discarded ones never receive `destroy`.
|
|
444
|
+
var unbindMouseDown;
|
|
445
|
+
decorations.push(Decoration.widget(widgetPos, function (widgetView, getPos) {
|
|
446
|
+
var _createColumnDividerW = createColumnDividerWidget(widgetView, getPos, editorAnalyticsAPI),
|
|
447
|
+
target = _createColumnDividerW.target,
|
|
448
|
+
destroy = _createColumnDividerW.destroy;
|
|
449
|
+
unbindMouseDown = destroy;
|
|
450
|
+
return target;
|
|
451
|
+
}, {
|
|
452
|
+
side: -1,
|
|
453
|
+
// place before the position
|
|
454
|
+
key: "layout-col-divider-".concat(sectionOrdinal, "-").concat(index),
|
|
455
|
+
ignoreSelection: true,
|
|
456
|
+
destroy: function destroy() {
|
|
457
|
+
var _unbindMouseDown;
|
|
458
|
+
(_unbindMouseDown = unbindMouseDown) === null || _unbindMouseDown === void 0 || _unbindMouseDown();
|
|
459
|
+
unbindMouseDown = undefined;
|
|
460
|
+
}
|
|
461
|
+
}));
|
|
490
462
|
}
|
|
491
463
|
});
|
|
492
464
|
return false; // don't descend into children
|
|
@@ -494,7 +466,7 @@ export var getColumnDividerDecorations = function getColumnDividerDecorations(st
|
|
|
494
466
|
// A `layoutSection` is only valid as a direct child of `doc` or `bodiedSyncBlock`, so there
|
|
495
467
|
// is nothing to find anywhere else. The unrestricted walk visited every node in the
|
|
496
468
|
// document — every table cell, list item and text node — on every `decorations(state)` read.
|
|
497
|
-
return
|
|
469
|
+
return node.type === bodiedSyncBlock;
|
|
498
470
|
});
|
|
499
471
|
return decorations;
|
|
500
472
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-layout",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "24.0.0",
|
|
4
4
|
"description": "Layout plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -23,18 +23,18 @@
|
|
|
23
23
|
"dependencies": {
|
|
24
24
|
"@atlaskit/adf-schema": "^57.6.0",
|
|
25
25
|
"@atlaskit/css": "^1.1.0",
|
|
26
|
-
"@atlaskit/editor-plugin-analytics": "^
|
|
27
|
-
"@atlaskit/editor-plugin-block-controls": "^
|
|
28
|
-
"@atlaskit/editor-plugin-block-menu": "^
|
|
29
|
-
"@atlaskit/editor-plugin-decorations": "^
|
|
30
|
-
"@atlaskit/editor-plugin-editor-disabled": "^
|
|
31
|
-
"@atlaskit/editor-plugin-guideline": "^
|
|
32
|
-
"@atlaskit/editor-plugin-interaction": "^
|
|
33
|
-
"@atlaskit/editor-plugin-selection": "^
|
|
34
|
-
"@atlaskit/editor-plugin-toolbar": "^
|
|
35
|
-
"@atlaskit/editor-plugin-ui-control-registry": "^
|
|
36
|
-
"@atlaskit/editor-plugin-user-intent": "^
|
|
37
|
-
"@atlaskit/editor-plugin-width": "^
|
|
26
|
+
"@atlaskit/editor-plugin-analytics": "^23.0.0",
|
|
27
|
+
"@atlaskit/editor-plugin-block-controls": "^24.0.0",
|
|
28
|
+
"@atlaskit/editor-plugin-block-menu": "^22.0.0",
|
|
29
|
+
"@atlaskit/editor-plugin-decorations": "^23.0.0",
|
|
30
|
+
"@atlaskit/editor-plugin-editor-disabled": "^23.0.0",
|
|
31
|
+
"@atlaskit/editor-plugin-guideline": "^23.0.0",
|
|
32
|
+
"@atlaskit/editor-plugin-interaction": "^37.0.0",
|
|
33
|
+
"@atlaskit/editor-plugin-selection": "^23.0.0",
|
|
34
|
+
"@atlaskit/editor-plugin-toolbar": "^20.0.0",
|
|
35
|
+
"@atlaskit/editor-plugin-ui-control-registry": "^17.0.0",
|
|
36
|
+
"@atlaskit/editor-plugin-user-intent": "^21.0.0",
|
|
37
|
+
"@atlaskit/editor-plugin-width": "^24.0.0",
|
|
38
38
|
"@atlaskit/editor-prosemirror": "^9.0.0",
|
|
39
39
|
"@atlaskit/editor-shared-styles": "^4.3.0",
|
|
40
40
|
"@atlaskit/editor-toolbar": "^2.8.0",
|
|
@@ -43,14 +43,14 @@
|
|
|
43
43
|
"@atlaskit/icon-lab": "^7.11.0",
|
|
44
44
|
"@atlaskit/platform-feature-experiments": "^0.3.0",
|
|
45
45
|
"@atlaskit/platform-feature-flags": "^2.2.0",
|
|
46
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
46
|
+
"@atlaskit/tmp-editor-statsig": "^219.0.0",
|
|
47
47
|
"@atlaskit/tokens": "^20.1.0",
|
|
48
48
|
"@babel/runtime": "^7.0.0",
|
|
49
49
|
"@emotion/react": "^11.7.1",
|
|
50
50
|
"bind-event-listener": "^3.0.0"
|
|
51
51
|
},
|
|
52
52
|
"peerDependencies": {
|
|
53
|
-
"@atlaskit/editor-common": "^
|
|
53
|
+
"@atlaskit/editor-common": "^127.0.0",
|
|
54
54
|
"react": "^18.2.0 || ^19.2.0",
|
|
55
55
|
"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
|
|
56
56
|
},
|