@atlaskit/editor-plugin-card 2.4.2 → 2.5.1
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 +34 -0
- package/dist/cjs/nodeviews/genericCard.js +15 -8
- package/dist/cjs/ui/ConfigureOverlay/index.js +15 -2
- package/dist/es2019/nodeviews/genericCard.js +15 -8
- package/dist/es2019/ui/ConfigureOverlay/index.js +15 -3
- package/dist/esm/nodeviews/genericCard.js +15 -8
- package/dist/esm/ui/ConfigureOverlay/index.js +16 -3
- package/package.json +7 -10
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,39 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-card
|
|
2
2
|
|
|
3
|
+
## 2.5.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#119163](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/119163)
|
|
8
|
+
[`45ae1b9a97c16`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/45ae1b9a97c16) -
|
|
9
|
+
[ux] Added onDropdownChange prop to overlay in editor-common. Used this prop to keep link
|
|
10
|
+
configure overlay open when dropdown is open, and hide overlay when dropdown is hidden.
|
|
11
|
+
- Updated dependencies
|
|
12
|
+
|
|
13
|
+
## 2.5.0
|
|
14
|
+
|
|
15
|
+
### Minor Changes
|
|
16
|
+
|
|
17
|
+
- [#119135](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/119135)
|
|
18
|
+
[`a4a41c5e54071`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a4a41c5e54071) -
|
|
19
|
+
Allow smart links to navigate in live pages edit view
|
|
20
|
+
|
|
21
|
+
### Patch Changes
|
|
22
|
+
|
|
23
|
+
- Updated dependencies
|
|
24
|
+
|
|
25
|
+
## 2.4.4
|
|
26
|
+
|
|
27
|
+
### Patch Changes
|
|
28
|
+
|
|
29
|
+
- Updated dependencies
|
|
30
|
+
|
|
31
|
+
## 2.4.3
|
|
32
|
+
|
|
33
|
+
### Patch Changes
|
|
34
|
+
|
|
35
|
+
- Updated dependencies
|
|
36
|
+
|
|
3
37
|
## 2.4.2
|
|
4
38
|
|
|
5
39
|
### Patch Changes
|
|
@@ -45,6 +45,19 @@ var WithClickHandler = function WithClickHandler(_ref) {
|
|
|
45
45
|
} catch (_unused) {}
|
|
46
46
|
}
|
|
47
47
|
}, [url, onClickCallback]);
|
|
48
|
+
if ((0, _platformFeatureFlags.fg)('platform.linking-platform.smart-links-in-live-pages')) {
|
|
49
|
+
/**
|
|
50
|
+
* @todo: Add a check to determine if we're currently in a live page once ED-23920 and plugin
|
|
51
|
+
* is complete. The logic for which should allow navigation if we're in a live page and no callback
|
|
52
|
+
* has been provided. E.g.
|
|
53
|
+
*
|
|
54
|
+
* const allowNavigation = isLivePage && !onClickCallback;
|
|
55
|
+
*/
|
|
56
|
+
var _allowNavigation = !onClickCallback;
|
|
57
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children({
|
|
58
|
+
onClick: _allowNavigation ? undefined : onClick
|
|
59
|
+
}));
|
|
60
|
+
}
|
|
48
61
|
|
|
49
62
|
// Setting `onClick` to `undefined` ensures clicks on smartcards navigate to the URL.
|
|
50
63
|
// If in view mode and not overriding with onClickCallback option, then allow smartlinks to navigate on click.
|
|
@@ -68,7 +81,6 @@ function Card(SmartCardComponent, UnsupportedComponent) {
|
|
|
68
81
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
|
|
69
82
|
isError: false
|
|
70
83
|
});
|
|
71
|
-
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onClick", function () {});
|
|
72
84
|
return _this;
|
|
73
85
|
}
|
|
74
86
|
(0, _createClass2.default)(_class, [{
|
|
@@ -107,7 +119,7 @@ function Card(SmartCardComponent, UnsupportedComponent) {
|
|
|
107
119
|
// Below is added for the future implementation of Linking Platform namespaced analytics context
|
|
108
120
|
location: analyticsEditorAppearance
|
|
109
121
|
}
|
|
110
|
-
},
|
|
122
|
+
}, /*#__PURE__*/_react.default.createElement(WithClickHandler, {
|
|
111
123
|
pluginInjectionApi: pluginInjectionApi,
|
|
112
124
|
onClickCallback: onClickCallback,
|
|
113
125
|
url: url
|
|
@@ -119,12 +131,7 @@ function Card(SmartCardComponent, UnsupportedComponent) {
|
|
|
119
131
|
}, _this2.props, {
|
|
120
132
|
onClick: onClick
|
|
121
133
|
}));
|
|
122
|
-
})
|
|
123
|
-
key: url,
|
|
124
|
-
cardContext: cardContext
|
|
125
|
-
}, this.props, {
|
|
126
|
-
onClick: this.onClick
|
|
127
|
-
})));
|
|
134
|
+
}));
|
|
128
135
|
}
|
|
129
136
|
}, {
|
|
130
137
|
key: "componentDidCatch",
|
|
@@ -26,19 +26,32 @@ var OverlayWrapper = function OverlayWrapper(_ref) {
|
|
|
26
26
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
27
27
|
showConfigureButton = _useState2[0],
|
|
28
28
|
setShowConfigureButton = _useState2[1];
|
|
29
|
+
var _useState3 = (0, _react.useState)(false),
|
|
30
|
+
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
31
|
+
dropdownOpen = _useState4[0],
|
|
32
|
+
setDropdownOpen = _useState4[1];
|
|
33
|
+
var onDropdownChange = (0, _react.useCallback)(function (isOpen) {
|
|
34
|
+
setDropdownOpen(isOpen);
|
|
35
|
+
if (!isOpen) {
|
|
36
|
+
setShowConfigureButton(false);
|
|
37
|
+
}
|
|
38
|
+
}, []);
|
|
29
39
|
return (0, _react2.jsx)("span", {
|
|
30
40
|
onMouseEnter: function onMouseEnter() {
|
|
31
41
|
return setShowConfigureButton(true);
|
|
32
42
|
},
|
|
33
43
|
onMouseLeave: function onMouseLeave() {
|
|
34
|
-
|
|
44
|
+
if (!dropdownOpen) {
|
|
45
|
+
setShowConfigureButton(false);
|
|
46
|
+
}
|
|
35
47
|
},
|
|
36
48
|
"data-testid": "inline-card-overlay-wrapper"
|
|
37
49
|
}, (0, _react2.jsx)("span", {
|
|
38
50
|
css: ConfigureOverlayWrapperStyles
|
|
39
51
|
}, showConfigureButton && (0, _react2.jsx)(_link.OverlayButton, {
|
|
40
52
|
editorView: view,
|
|
41
|
-
targetElementPos: targetElementPos
|
|
53
|
+
targetElementPos: targetElementPos,
|
|
54
|
+
onDropdownChange: onDropdownChange
|
|
42
55
|
})), children);
|
|
43
56
|
};
|
|
44
57
|
var _default = exports.default = OverlayWrapper;
|
|
@@ -29,6 +29,19 @@ const WithClickHandler = ({
|
|
|
29
29
|
} catch {}
|
|
30
30
|
}
|
|
31
31
|
}, [url, onClickCallback]);
|
|
32
|
+
if (fg('platform.linking-platform.smart-links-in-live-pages')) {
|
|
33
|
+
/**
|
|
34
|
+
* @todo: Add a check to determine if we're currently in a live page once ED-23920 and plugin
|
|
35
|
+
* is complete. The logic for which should allow navigation if we're in a live page and no callback
|
|
36
|
+
* has been provided. E.g.
|
|
37
|
+
*
|
|
38
|
+
* const allowNavigation = isLivePage && !onClickCallback;
|
|
39
|
+
*/
|
|
40
|
+
const allowNavigation = !onClickCallback;
|
|
41
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, children({
|
|
42
|
+
onClick: allowNavigation ? undefined : onClick
|
|
43
|
+
}));
|
|
44
|
+
}
|
|
32
45
|
|
|
33
46
|
// Setting `onClick` to `undefined` ensures clicks on smartcards navigate to the URL.
|
|
34
47
|
// If in view mode and not overriding with onClickCallback option, then allow smartlinks to navigate on click.
|
|
@@ -45,7 +58,6 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
|
|
|
45
58
|
_defineProperty(this, "state", {
|
|
46
59
|
isError: false
|
|
47
60
|
});
|
|
48
|
-
_defineProperty(this, "onClick", () => {});
|
|
49
61
|
}
|
|
50
62
|
render() {
|
|
51
63
|
var _getPluginState;
|
|
@@ -82,7 +94,7 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
|
|
|
82
94
|
// Below is added for the future implementation of Linking Platform namespaced analytics context
|
|
83
95
|
location: analyticsEditorAppearance
|
|
84
96
|
}
|
|
85
|
-
},
|
|
97
|
+
}, /*#__PURE__*/React.createElement(WithClickHandler, {
|
|
86
98
|
pluginInjectionApi: pluginInjectionApi,
|
|
87
99
|
onClickCallback: onClickCallback,
|
|
88
100
|
url: url
|
|
@@ -93,12 +105,7 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
|
|
|
93
105
|
cardContext: cardContext
|
|
94
106
|
}, this.props, {
|
|
95
107
|
onClick: onClick
|
|
96
|
-
})))
|
|
97
|
-
key: url,
|
|
98
|
-
cardContext: cardContext
|
|
99
|
-
}, this.props, {
|
|
100
|
-
onClick: this.onClick
|
|
101
|
-
})));
|
|
108
|
+
}))));
|
|
102
109
|
}
|
|
103
110
|
componentDidCatch(error) {
|
|
104
111
|
const maybeAPIError = error;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
|
-
import { useState } from 'react';
|
|
2
|
+
import { useCallback, useState } from 'react';
|
|
3
3
|
|
|
4
4
|
// not permitted to migrate atlaskit packages to compiled yet, see https://hello.atlassian.net/wiki/spaces/UAF/pages/3006969423/Migrating+AFM+platform+components+to+Compiled+a+guide
|
|
5
5
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
@@ -15,15 +15,27 @@ const OverlayWrapper = ({
|
|
|
15
15
|
children
|
|
16
16
|
}) => {
|
|
17
17
|
const [showConfigureButton, setShowConfigureButton] = useState(false);
|
|
18
|
+
const [dropdownOpen, setDropdownOpen] = useState(false);
|
|
19
|
+
const onDropdownChange = useCallback(isOpen => {
|
|
20
|
+
setDropdownOpen(isOpen);
|
|
21
|
+
if (!isOpen) {
|
|
22
|
+
setShowConfigureButton(false);
|
|
23
|
+
}
|
|
24
|
+
}, []);
|
|
18
25
|
return jsx("span", {
|
|
19
26
|
onMouseEnter: () => setShowConfigureButton(true),
|
|
20
|
-
onMouseLeave: () =>
|
|
27
|
+
onMouseLeave: () => {
|
|
28
|
+
if (!dropdownOpen) {
|
|
29
|
+
setShowConfigureButton(false);
|
|
30
|
+
}
|
|
31
|
+
},
|
|
21
32
|
"data-testid": "inline-card-overlay-wrapper"
|
|
22
33
|
}, jsx("span", {
|
|
23
34
|
css: ConfigureOverlayWrapperStyles
|
|
24
35
|
}, showConfigureButton && jsx(OverlayButton, {
|
|
25
36
|
editorView: view,
|
|
26
|
-
targetElementPos: targetElementPos
|
|
37
|
+
targetElementPos: targetElementPos,
|
|
38
|
+
onDropdownChange: onDropdownChange
|
|
27
39
|
})), children);
|
|
28
40
|
};
|
|
29
41
|
export default OverlayWrapper;
|
|
@@ -35,6 +35,19 @@ var WithClickHandler = function WithClickHandler(_ref) {
|
|
|
35
35
|
} catch (_unused) {}
|
|
36
36
|
}
|
|
37
37
|
}, [url, onClickCallback]);
|
|
38
|
+
if (fg('platform.linking-platform.smart-links-in-live-pages')) {
|
|
39
|
+
/**
|
|
40
|
+
* @todo: Add a check to determine if we're currently in a live page once ED-23920 and plugin
|
|
41
|
+
* is complete. The logic for which should allow navigation if we're in a live page and no callback
|
|
42
|
+
* has been provided. E.g.
|
|
43
|
+
*
|
|
44
|
+
* const allowNavigation = isLivePage && !onClickCallback;
|
|
45
|
+
*/
|
|
46
|
+
var _allowNavigation = !onClickCallback;
|
|
47
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, children({
|
|
48
|
+
onClick: _allowNavigation ? undefined : onClick
|
|
49
|
+
}));
|
|
50
|
+
}
|
|
38
51
|
|
|
39
52
|
// Setting `onClick` to `undefined` ensures clicks on smartcards navigate to the URL.
|
|
40
53
|
// If in view mode and not overriding with onClickCallback option, then allow smartlinks to navigate on click.
|
|
@@ -58,7 +71,6 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
|
|
|
58
71
|
_defineProperty(_assertThisInitialized(_this), "state", {
|
|
59
72
|
isError: false
|
|
60
73
|
});
|
|
61
|
-
_defineProperty(_assertThisInitialized(_this), "onClick", function () {});
|
|
62
74
|
return _this;
|
|
63
75
|
}
|
|
64
76
|
_createClass(_class, [{
|
|
@@ -97,7 +109,7 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
|
|
|
97
109
|
// Below is added for the future implementation of Linking Platform namespaced analytics context
|
|
98
110
|
location: analyticsEditorAppearance
|
|
99
111
|
}
|
|
100
|
-
},
|
|
112
|
+
}, /*#__PURE__*/React.createElement(WithClickHandler, {
|
|
101
113
|
pluginInjectionApi: pluginInjectionApi,
|
|
102
114
|
onClickCallback: onClickCallback,
|
|
103
115
|
url: url
|
|
@@ -109,12 +121,7 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
|
|
|
109
121
|
}, _this2.props, {
|
|
110
122
|
onClick: onClick
|
|
111
123
|
}));
|
|
112
|
-
})
|
|
113
|
-
key: url,
|
|
114
|
-
cardContext: cardContext
|
|
115
|
-
}, this.props, {
|
|
116
|
-
onClick: this.onClick
|
|
117
|
-
})));
|
|
124
|
+
}));
|
|
118
125
|
}
|
|
119
126
|
}, {
|
|
120
127
|
key: "componentDidCatch",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
2
|
/** @jsx jsx */
|
|
3
|
-
import { useState } from 'react';
|
|
3
|
+
import { useCallback, useState } from 'react';
|
|
4
4
|
|
|
5
5
|
// not permitted to migrate atlaskit packages to compiled yet, see https://hello.atlassian.net/wiki/spaces/UAF/pages/3006969423/Migrating+AFM+platform+components+to+Compiled+a+guide
|
|
6
6
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
|
|
@@ -18,19 +18,32 @@ var OverlayWrapper = function OverlayWrapper(_ref) {
|
|
|
18
18
|
_useState2 = _slicedToArray(_useState, 2),
|
|
19
19
|
showConfigureButton = _useState2[0],
|
|
20
20
|
setShowConfigureButton = _useState2[1];
|
|
21
|
+
var _useState3 = useState(false),
|
|
22
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
23
|
+
dropdownOpen = _useState4[0],
|
|
24
|
+
setDropdownOpen = _useState4[1];
|
|
25
|
+
var onDropdownChange = useCallback(function (isOpen) {
|
|
26
|
+
setDropdownOpen(isOpen);
|
|
27
|
+
if (!isOpen) {
|
|
28
|
+
setShowConfigureButton(false);
|
|
29
|
+
}
|
|
30
|
+
}, []);
|
|
21
31
|
return jsx("span", {
|
|
22
32
|
onMouseEnter: function onMouseEnter() {
|
|
23
33
|
return setShowConfigureButton(true);
|
|
24
34
|
},
|
|
25
35
|
onMouseLeave: function onMouseLeave() {
|
|
26
|
-
|
|
36
|
+
if (!dropdownOpen) {
|
|
37
|
+
setShowConfigureButton(false);
|
|
38
|
+
}
|
|
27
39
|
},
|
|
28
40
|
"data-testid": "inline-card-overlay-wrapper"
|
|
29
41
|
}, jsx("span", {
|
|
30
42
|
css: ConfigureOverlayWrapperStyles
|
|
31
43
|
}, showConfigureButton && jsx(OverlayButton, {
|
|
32
44
|
editorView: view,
|
|
33
|
-
targetElementPos: targetElementPos
|
|
45
|
+
targetElementPos: targetElementPos,
|
|
46
|
+
onDropdownChange: onDropdownChange
|
|
34
47
|
})), children);
|
|
35
48
|
};
|
|
36
49
|
export default OverlayWrapper;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-card",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.5.1",
|
|
4
4
|
"description": "Card plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -34,10 +34,10 @@
|
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@atlaskit/adf-schema": "^39.0.3",
|
|
36
36
|
"@atlaskit/analytics-next": "^9.3.0",
|
|
37
|
-
"@atlaskit/button": "^18.
|
|
37
|
+
"@atlaskit/button": "^18.3.0",
|
|
38
38
|
"@atlaskit/custom-steps": "^0.4.0",
|
|
39
39
|
"@atlaskit/dropdown-menu": "^12.14.0",
|
|
40
|
-
"@atlaskit/editor-common": "^84.
|
|
40
|
+
"@atlaskit/editor-common": "^84.5.0",
|
|
41
41
|
"@atlaskit/editor-plugin-analytics": "^1.4.0",
|
|
42
42
|
"@atlaskit/editor-plugin-decorations": "^1.1.0",
|
|
43
43
|
"@atlaskit/editor-plugin-editor-disabled": "^1.1.0",
|
|
@@ -47,17 +47,17 @@
|
|
|
47
47
|
"@atlaskit/editor-plugin-grid": "^1.1.0",
|
|
48
48
|
"@atlaskit/editor-plugin-width": "^1.1.0",
|
|
49
49
|
"@atlaskit/editor-prosemirror": "4.0.1",
|
|
50
|
-
"@atlaskit/editor-shared-styles": "^2.
|
|
50
|
+
"@atlaskit/editor-shared-styles": "^2.13.0",
|
|
51
51
|
"@atlaskit/frontend-utilities": "^2.7.0",
|
|
52
52
|
"@atlaskit/icon": "^22.6.0",
|
|
53
53
|
"@atlaskit/link-analytics": "^8.3.0",
|
|
54
54
|
"@atlaskit/link-client-extension": "^1.9.0",
|
|
55
55
|
"@atlaskit/link-datasource": "^2.5.0",
|
|
56
56
|
"@atlaskit/linking-common": "^5.7.0",
|
|
57
|
-
"@atlaskit/linking-types": "^8.
|
|
58
|
-
"@atlaskit/menu": "2.7.
|
|
57
|
+
"@atlaskit/linking-types": "^8.10.0",
|
|
58
|
+
"@atlaskit/menu": "2.7.4",
|
|
59
59
|
"@atlaskit/platform-feature-flags": "^0.3.0",
|
|
60
|
-
"@atlaskit/primitives": "^
|
|
60
|
+
"@atlaskit/primitives": "^11.0.0",
|
|
61
61
|
"@atlaskit/smart-card": "^27.9.0",
|
|
62
62
|
"@atlaskit/theme": "^12.11.0",
|
|
63
63
|
"@atlaskit/tokens": "^1.53.0",
|
|
@@ -131,9 +131,6 @@
|
|
|
131
131
|
"platform.editor.card.inject-settings-button": {
|
|
132
132
|
"type": "boolean"
|
|
133
133
|
},
|
|
134
|
-
"platform.linking-platform.smart-card.on-click-callback": {
|
|
135
|
-
"type": "boolean"
|
|
136
|
-
},
|
|
137
134
|
"platform.linking-platform.editor-datasource-typeguards": {
|
|
138
135
|
"type": "boolean"
|
|
139
136
|
},
|