@atlaskit/editor-plugin-block-controls 1.3.8 → 1.3.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.
- package/CHANGELOG.md +16 -0
- package/dist/cjs/pm-plugins/main.js +1 -1
- package/dist/cjs/ui/consts.js +2 -2
- package/dist/cjs/ui/drop-target.js +5 -4
- package/dist/es2019/pm-plugins/main.js +1 -1
- package/dist/es2019/ui/consts.js +2 -2
- package/dist/es2019/ui/drop-target.js +5 -4
- package/dist/esm/pm-plugins/main.js +1 -1
- package/dist/esm/ui/consts.js +2 -2
- package/dist/esm/ui/drop-target.js +5 -4
- package/dist/types/ui/consts.d.ts +2 -2
- package/dist/types-ts4.5/ui/consts.d.ts +2 -2
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-block-controls
|
|
2
2
|
|
|
3
|
+
## 1.3.10
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#100964](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100964)
|
|
8
|
+
[`d58e7d6f08e4`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d58e7d6f08e4) -
|
|
9
|
+
[ux] Tweak CSS styles for drop targets
|
|
10
|
+
|
|
11
|
+
## 1.3.9
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [#100922](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100922)
|
|
16
|
+
[`d69797fc32b6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d69797fc32b6) -
|
|
17
|
+
ED-22939 Fix drag handle not appearing for first node of document
|
|
18
|
+
|
|
3
19
|
## 1.3.8
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
@@ -93,7 +93,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
|
|
|
93
93
|
left: event.clientX,
|
|
94
94
|
top: event.clientY
|
|
95
95
|
});
|
|
96
|
-
if (pos
|
|
96
|
+
if ((pos === null || pos === void 0 ? void 0 : pos.inside) !== undefined && pos.inside >= 0) {
|
|
97
97
|
var _api$core;
|
|
98
98
|
var node = view.state.doc.nodeAt(pos.inside);
|
|
99
99
|
if (!node) {
|
package/dist/cjs/ui/consts.js
CHANGED
|
@@ -7,6 +7,6 @@ exports.DROP_TARGET_LINE_WIDTH = exports.DROP_TARGET_CIRCLE_DIAMETER = exports.D
|
|
|
7
7
|
var DRAG_HANDLE_HEIGHT = exports.DRAG_HANDLE_HEIGHT = 24;
|
|
8
8
|
var DRAG_HANDLE_WIDTH = exports.DRAG_HANDLE_WIDTH = 12;
|
|
9
9
|
var DRAG_HANDLE_BORDER_RADIUS = exports.DRAG_HANDLE_BORDER_RADIUS = 4;
|
|
10
|
+
var DRAG_HANDLE_NODE_GAP = exports.DRAG_HANDLE_NODE_GAP = 12;
|
|
10
11
|
var DROP_TARGET_LINE_WIDTH = exports.DROP_TARGET_LINE_WIDTH = 2;
|
|
11
|
-
var DROP_TARGET_CIRCLE_DIAMETER = exports.DROP_TARGET_CIRCLE_DIAMETER =
|
|
12
|
-
var DRAG_HANDLE_NODE_GAP = exports.DRAG_HANDLE_NODE_GAP = 12;
|
|
12
|
+
var DROP_TARGET_CIRCLE_DIAMETER = exports.DROP_TARGET_CIRCLE_DIAMETER = 8;
|
|
@@ -17,21 +17,22 @@ var styleHighlighted = (0, _react2.css)({
|
|
|
17
17
|
height: "var(--ds-space-100, 8px)",
|
|
18
18
|
marginTop: "calc(".concat("var(--ds-space-negative-100, -8px)", " - ", _consts.DROP_TARGET_LINE_WIDTH, "px)"),
|
|
19
19
|
marginLeft: "var(--ds-space-negative-100, -8px)",
|
|
20
|
-
top: "calc(".concat("var(--ds-space-100, 8px)", " / 2 -
|
|
21
|
-
//
|
|
20
|
+
top: "calc(".concat("var(--ds-space-100, 8px)", " / 2 - 1px)"),
|
|
21
|
+
//1px to help clear expand node margin
|
|
22
22
|
position: 'relative',
|
|
23
23
|
borderBottom: "solid ".concat("var(--ds-border-selected, ".concat(_colors.B300, ")"), " ", _consts.DROP_TARGET_LINE_WIDTH, "px"),
|
|
24
24
|
"&:before": {
|
|
25
25
|
content: '""',
|
|
26
26
|
width: "".concat(_consts.DROP_TARGET_CIRCLE_DIAMETER, "px"),
|
|
27
27
|
height: "".concat(_consts.DROP_TARGET_CIRCLE_DIAMETER, "px"),
|
|
28
|
-
marginTop: "
|
|
28
|
+
marginTop: "".concat(_consts.DROP_TARGET_CIRCLE_DIAMETER, "px"),
|
|
29
29
|
borderRadius: '50%',
|
|
30
30
|
border: "solid ".concat("var(--ds-border-selected, ".concat(_colors.B300, ")"), " ", _consts.DROP_TARGET_LINE_WIDTH, "px"),
|
|
31
31
|
backgroundColor: "var(--ds-background-input, white)",
|
|
32
32
|
display: 'block',
|
|
33
33
|
position: 'absolute',
|
|
34
|
-
bottom:
|
|
34
|
+
bottom: "".concat(-(_consts.DROP_TARGET_CIRCLE_DIAMETER + _consts.DROP_TARGET_LINE_WIDTH) / 2, "px"),
|
|
35
|
+
boxSizing: 'border-box'
|
|
35
36
|
}
|
|
36
37
|
});
|
|
37
38
|
var styleDisabled = (0, _react2.css)({
|
|
@@ -91,7 +91,7 @@ export const createPlugin = api => {
|
|
|
91
91
|
left: event.clientX,
|
|
92
92
|
top: event.clientY
|
|
93
93
|
});
|
|
94
|
-
if (pos
|
|
94
|
+
if ((pos === null || pos === void 0 ? void 0 : pos.inside) !== undefined && pos.inside >= 0) {
|
|
95
95
|
var _api$core;
|
|
96
96
|
const node = view.state.doc.nodeAt(pos.inside);
|
|
97
97
|
if (!node) {
|
package/dist/es2019/ui/consts.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export const DRAG_HANDLE_HEIGHT = 24;
|
|
2
2
|
export const DRAG_HANDLE_WIDTH = 12;
|
|
3
3
|
export const DRAG_HANDLE_BORDER_RADIUS = 4;
|
|
4
|
+
export const DRAG_HANDLE_NODE_GAP = 12;
|
|
4
5
|
export const DROP_TARGET_LINE_WIDTH = 2;
|
|
5
|
-
export const DROP_TARGET_CIRCLE_DIAMETER =
|
|
6
|
-
export const DRAG_HANDLE_NODE_GAP = 12;
|
|
6
|
+
export const DROP_TARGET_CIRCLE_DIAMETER = 8;
|
|
@@ -8,21 +8,22 @@ const styleHighlighted = css({
|
|
|
8
8
|
height: "var(--ds-space-100, 8px)",
|
|
9
9
|
marginTop: `calc(${"var(--ds-space-negative-100, -8px)"} - ${DROP_TARGET_LINE_WIDTH}px)`,
|
|
10
10
|
marginLeft: "var(--ds-space-negative-100, -8px)",
|
|
11
|
-
top: `calc(${"var(--ds-space-100, 8px)"} / 2 -
|
|
12
|
-
//
|
|
11
|
+
top: `calc(${"var(--ds-space-100, 8px)"} / 2 - 1px)`,
|
|
12
|
+
//1px to help clear expand node margin
|
|
13
13
|
position: 'relative',
|
|
14
14
|
borderBottom: `solid ${`var(--ds-border-selected, ${B300})`} ${DROP_TARGET_LINE_WIDTH}px`,
|
|
15
15
|
"&:before": {
|
|
16
16
|
content: '""',
|
|
17
17
|
width: `${DROP_TARGET_CIRCLE_DIAMETER}px`,
|
|
18
18
|
height: `${DROP_TARGET_CIRCLE_DIAMETER}px`,
|
|
19
|
-
marginTop:
|
|
19
|
+
marginTop: `${DROP_TARGET_CIRCLE_DIAMETER}px`,
|
|
20
20
|
borderRadius: '50%',
|
|
21
21
|
border: `solid ${`var(--ds-border-selected, ${B300})`} ${DROP_TARGET_LINE_WIDTH}px`,
|
|
22
22
|
backgroundColor: "var(--ds-background-input, white)",
|
|
23
23
|
display: 'block',
|
|
24
24
|
position: 'absolute',
|
|
25
|
-
bottom:
|
|
25
|
+
bottom: `${-(DROP_TARGET_CIRCLE_DIAMETER + DROP_TARGET_LINE_WIDTH) / 2}px`,
|
|
26
|
+
boxSizing: 'border-box'
|
|
26
27
|
}
|
|
27
28
|
});
|
|
28
29
|
const styleDisabled = css({
|
|
@@ -87,7 +87,7 @@ export var createPlugin = function createPlugin(api) {
|
|
|
87
87
|
left: event.clientX,
|
|
88
88
|
top: event.clientY
|
|
89
89
|
});
|
|
90
|
-
if (pos
|
|
90
|
+
if ((pos === null || pos === void 0 ? void 0 : pos.inside) !== undefined && pos.inside >= 0) {
|
|
91
91
|
var _api$core;
|
|
92
92
|
var node = view.state.doc.nodeAt(pos.inside);
|
|
93
93
|
if (!node) {
|
package/dist/esm/ui/consts.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export var DRAG_HANDLE_HEIGHT = 24;
|
|
2
2
|
export var DRAG_HANDLE_WIDTH = 12;
|
|
3
3
|
export var DRAG_HANDLE_BORDER_RADIUS = 4;
|
|
4
|
+
export var DRAG_HANDLE_NODE_GAP = 12;
|
|
4
5
|
export var DROP_TARGET_LINE_WIDTH = 2;
|
|
5
|
-
export var DROP_TARGET_CIRCLE_DIAMETER =
|
|
6
|
-
export var DRAG_HANDLE_NODE_GAP = 12;
|
|
6
|
+
export var DROP_TARGET_CIRCLE_DIAMETER = 8;
|
|
@@ -9,21 +9,22 @@ var styleHighlighted = css({
|
|
|
9
9
|
height: "var(--ds-space-100, 8px)",
|
|
10
10
|
marginTop: "calc(".concat("var(--ds-space-negative-100, -8px)", " - ", DROP_TARGET_LINE_WIDTH, "px)"),
|
|
11
11
|
marginLeft: "var(--ds-space-negative-100, -8px)",
|
|
12
|
-
top: "calc(".concat("var(--ds-space-100, 8px)", " / 2 -
|
|
13
|
-
//
|
|
12
|
+
top: "calc(".concat("var(--ds-space-100, 8px)", " / 2 - 1px)"),
|
|
13
|
+
//1px to help clear expand node margin
|
|
14
14
|
position: 'relative',
|
|
15
15
|
borderBottom: "solid ".concat("var(--ds-border-selected, ".concat(B300, ")"), " ", DROP_TARGET_LINE_WIDTH, "px"),
|
|
16
16
|
"&:before": {
|
|
17
17
|
content: '""',
|
|
18
18
|
width: "".concat(DROP_TARGET_CIRCLE_DIAMETER, "px"),
|
|
19
19
|
height: "".concat(DROP_TARGET_CIRCLE_DIAMETER, "px"),
|
|
20
|
-
marginTop: "
|
|
20
|
+
marginTop: "".concat(DROP_TARGET_CIRCLE_DIAMETER, "px"),
|
|
21
21
|
borderRadius: '50%',
|
|
22
22
|
border: "solid ".concat("var(--ds-border-selected, ".concat(B300, ")"), " ", DROP_TARGET_LINE_WIDTH, "px"),
|
|
23
23
|
backgroundColor: "var(--ds-background-input, white)",
|
|
24
24
|
display: 'block',
|
|
25
25
|
position: 'absolute',
|
|
26
|
-
bottom:
|
|
26
|
+
bottom: "".concat(-(DROP_TARGET_CIRCLE_DIAMETER + DROP_TARGET_LINE_WIDTH) / 2, "px"),
|
|
27
|
+
boxSizing: 'border-box'
|
|
27
28
|
}
|
|
28
29
|
});
|
|
29
30
|
var styleDisabled = css({
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export declare const DRAG_HANDLE_HEIGHT = 24;
|
|
2
2
|
export declare const DRAG_HANDLE_WIDTH = 12;
|
|
3
3
|
export declare const DRAG_HANDLE_BORDER_RADIUS = 4;
|
|
4
|
-
export declare const DROP_TARGET_LINE_WIDTH = 2;
|
|
5
|
-
export declare const DROP_TARGET_CIRCLE_DIAMETER = 4;
|
|
6
4
|
export declare const DRAG_HANDLE_NODE_GAP = 12;
|
|
5
|
+
export declare const DROP_TARGET_LINE_WIDTH = 2;
|
|
6
|
+
export declare const DROP_TARGET_CIRCLE_DIAMETER = 8;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export declare const DRAG_HANDLE_HEIGHT = 24;
|
|
2
2
|
export declare const DRAG_HANDLE_WIDTH = 12;
|
|
3
3
|
export declare const DRAG_HANDLE_BORDER_RADIUS = 4;
|
|
4
|
-
export declare const DROP_TARGET_LINE_WIDTH = 2;
|
|
5
|
-
export declare const DROP_TARGET_CIRCLE_DIAMETER = 4;
|
|
6
4
|
export declare const DRAG_HANDLE_NODE_GAP = 12;
|
|
5
|
+
export declare const DROP_TARGET_LINE_WIDTH = 2;
|
|
6
|
+
export declare const DROP_TARGET_CIRCLE_DIAMETER = 8;
|