@atlaskit/popup 1.9.1 → 1.9.2
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 +6 -0
- package/dist/cjs/popper-wrapper.js +3 -1
- package/dist/cjs/popup.js +20 -22
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/popper-wrapper.js +3 -1
- package/dist/es2019/popup.js +4 -4
- package/dist/es2019/version.json +1 -1
- package/dist/esm/popper-wrapper.js +3 -1
- package/dist/esm/popup.js +20 -22
- package/dist/esm/version.json +1 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# @atlaskit/popup
|
|
2
2
|
|
|
3
|
+
## 1.9.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`065da872439`](https://bitbucket.org/atlassian/atlassian-frontend/commits/065da872439) - Css changes for testing the feature flag `platform.design-system-team.render-popup-in-parent_f73ij`.
|
|
8
|
+
|
|
3
9
|
## 1.9.1
|
|
4
10
|
|
|
5
11
|
### Patch Changes
|
|
@@ -9,6 +9,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
9
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
10
|
var _react = require("react");
|
|
11
11
|
var _react2 = require("@emotion/react");
|
|
12
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
12
13
|
var _popper = require("@atlaskit/popper");
|
|
13
14
|
var _colors = require("@atlaskit/theme/colors");
|
|
14
15
|
var _constants = require("@atlaskit/theme/constants");
|
|
@@ -25,10 +26,11 @@ var popupStyles = (0, _react2.css)({
|
|
|
25
26
|
backgroundColor: "var(--ds-surface-overlay, ".concat(_colors.N0, ")"),
|
|
26
27
|
borderRadius: "var(--ds-border-radius, 3px)",
|
|
27
28
|
boxShadow: "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N50A, ", 0 0 1px ").concat(_colors.N60A), ")"),
|
|
28
|
-
overflow: 'auto',
|
|
29
29
|
':focus': {
|
|
30
30
|
outline: 'none'
|
|
31
31
|
}
|
|
32
|
+
}, !(0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.render-popup-in-parent_f73ij') && {
|
|
33
|
+
overflow: 'auto'
|
|
32
34
|
});
|
|
33
35
|
var DefaultPopupComponent = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
34
36
|
return (0, _react2.jsx)("div", (0, _extends2.default)({
|
package/dist/cjs/popup.js
CHANGED
|
@@ -46,25 +46,23 @@ var Popup = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
46
46
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
47
47
|
triggerRef = _useState2[0],
|
|
48
48
|
setTriggerRef = _useState2[1];
|
|
49
|
-
var renderPopperWrapper =
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
});
|
|
67
|
-
};
|
|
49
|
+
var renderPopperWrapper = (0, _react2.jsx)(_popperWrapper.default, {
|
|
50
|
+
content: content,
|
|
51
|
+
isOpen: isOpen,
|
|
52
|
+
placement: placement,
|
|
53
|
+
fallbackPlacements: fallbackPlacements,
|
|
54
|
+
boundary: boundary,
|
|
55
|
+
rootBoundary: rootBoundary,
|
|
56
|
+
shouldFlip: shouldFlip,
|
|
57
|
+
offset: offset,
|
|
58
|
+
popupComponent: PopupContainer,
|
|
59
|
+
id: id,
|
|
60
|
+
testId: testId,
|
|
61
|
+
onClose: onClose,
|
|
62
|
+
autoFocus: autoFocus,
|
|
63
|
+
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
64
|
+
triggerRef: triggerRef
|
|
65
|
+
});
|
|
68
66
|
return (0, _react2.jsx)(_popper.Manager, null, (0, _react2.jsx)(_popper.Reference, null, function (_ref2) {
|
|
69
67
|
var _ref3 = _ref2.ref;
|
|
70
68
|
return trigger({
|
|
@@ -82,11 +80,11 @@ var Popup = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
82
80
|
'aria-expanded': isOpen,
|
|
83
81
|
'aria-haspopup': true
|
|
84
82
|
});
|
|
85
|
-
}), isOpen && ((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.render-popup-in-parent_f73ij') ? shouldRenderToParent ? renderPopperWrapper
|
|
83
|
+
}), isOpen && ((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.render-popup-in-parent_f73ij') ? shouldRenderToParent ? renderPopperWrapper : (0, _react2.jsx)(_portal.default, {
|
|
86
84
|
zIndex: zIndex
|
|
87
|
-
}, renderPopperWrapper
|
|
85
|
+
}, renderPopperWrapper) : (0, _react2.jsx)(_portal.default, {
|
|
88
86
|
zIndex: zIndex
|
|
89
|
-
}, renderPopperWrapper
|
|
87
|
+
}, renderPopperWrapper)));
|
|
90
88
|
});
|
|
91
89
|
exports.Popup = Popup;
|
|
92
90
|
var _default = Popup;
|
package/dist/cjs/version.json
CHANGED
|
@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
2
2
|
/** @jsx jsx */
|
|
3
3
|
import { forwardRef, useMemo, useState } from 'react';
|
|
4
4
|
import { css, jsx } from '@emotion/react';
|
|
5
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
5
6
|
import { Popper } from '@atlaskit/popper';
|
|
6
7
|
import { N0, N50A, N60A } from '@atlaskit/theme/colors';
|
|
7
8
|
import { layers } from '@atlaskit/theme/constants';
|
|
@@ -16,10 +17,11 @@ const popupStyles = css({
|
|
|
16
17
|
backgroundColor: `var(--ds-surface-overlay, ${N0})`,
|
|
17
18
|
borderRadius: "var(--ds-border-radius, 3px)",
|
|
18
19
|
boxShadow: `var(--ds-shadow-overlay, ${`0 4px 8px -2px ${N50A}, 0 0 1px ${N60A}`})`,
|
|
19
|
-
overflow: 'auto',
|
|
20
20
|
':focus': {
|
|
21
21
|
outline: 'none'
|
|
22
22
|
}
|
|
23
|
+
}, !getBooleanFF('platform.design-system-team.render-popup-in-parent_f73ij') && {
|
|
24
|
+
overflow: 'auto'
|
|
23
25
|
});
|
|
24
26
|
const DefaultPopupComponent = /*#__PURE__*/forwardRef((props, ref) => jsx("div", _extends({
|
|
25
27
|
css: popupStyles
|
package/dist/es2019/popup.js
CHANGED
|
@@ -28,7 +28,7 @@ export const Popup = /*#__PURE__*/memo(({
|
|
|
28
28
|
shouldRenderToParent = false
|
|
29
29
|
}) => {
|
|
30
30
|
const [triggerRef, setTriggerRef] = useState(null);
|
|
31
|
-
const renderPopperWrapper =
|
|
31
|
+
const renderPopperWrapper = jsx(PopperWrapper, {
|
|
32
32
|
content: content,
|
|
33
33
|
isOpen: isOpen,
|
|
34
34
|
placement: placement,
|
|
@@ -63,10 +63,10 @@ export const Popup = /*#__PURE__*/memo(({
|
|
|
63
63
|
'aria-expanded': isOpen,
|
|
64
64
|
'aria-haspopup': true
|
|
65
65
|
});
|
|
66
|
-
}), isOpen && (getBooleanFF('platform.design-system-team.render-popup-in-parent_f73ij') ? shouldRenderToParent ? renderPopperWrapper
|
|
66
|
+
}), isOpen && (getBooleanFF('platform.design-system-team.render-popup-in-parent_f73ij') ? shouldRenderToParent ? renderPopperWrapper : jsx(Portal, {
|
|
67
67
|
zIndex: zIndex
|
|
68
|
-
}, renderPopperWrapper
|
|
68
|
+
}, renderPopperWrapper) : jsx(Portal, {
|
|
69
69
|
zIndex: zIndex
|
|
70
|
-
}, renderPopperWrapper
|
|
70
|
+
}, renderPopperWrapper)));
|
|
71
71
|
});
|
|
72
72
|
export default Popup;
|
package/dist/es2019/version.json
CHANGED
|
@@ -3,6 +3,7 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
3
3
|
/** @jsx jsx */
|
|
4
4
|
import { forwardRef, useMemo, useState } from 'react';
|
|
5
5
|
import { css, jsx } from '@emotion/react';
|
|
6
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
6
7
|
import { Popper } from '@atlaskit/popper';
|
|
7
8
|
import { N0, N50A, N60A } from '@atlaskit/theme/colors';
|
|
8
9
|
import { layers } from '@atlaskit/theme/constants';
|
|
@@ -17,10 +18,11 @@ var popupStyles = css({
|
|
|
17
18
|
backgroundColor: "var(--ds-surface-overlay, ".concat(N0, ")"),
|
|
18
19
|
borderRadius: "var(--ds-border-radius, 3px)",
|
|
19
20
|
boxShadow: "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N50A, ", 0 0 1px ").concat(N60A), ")"),
|
|
20
|
-
overflow: 'auto',
|
|
21
21
|
':focus': {
|
|
22
22
|
outline: 'none'
|
|
23
23
|
}
|
|
24
|
+
}, !getBooleanFF('platform.design-system-team.render-popup-in-parent_f73ij') && {
|
|
25
|
+
overflow: 'auto'
|
|
24
26
|
});
|
|
25
27
|
var DefaultPopupComponent = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
26
28
|
return jsx("div", _extends({
|
package/dist/esm/popup.js
CHANGED
|
@@ -38,25 +38,23 @@ export var Popup = /*#__PURE__*/memo(function (_ref) {
|
|
|
38
38
|
_useState2 = _slicedToArray(_useState, 2),
|
|
39
39
|
triggerRef = _useState2[0],
|
|
40
40
|
setTriggerRef = _useState2[1];
|
|
41
|
-
var renderPopperWrapper =
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
});
|
|
59
|
-
};
|
|
41
|
+
var renderPopperWrapper = jsx(PopperWrapper, {
|
|
42
|
+
content: content,
|
|
43
|
+
isOpen: isOpen,
|
|
44
|
+
placement: placement,
|
|
45
|
+
fallbackPlacements: fallbackPlacements,
|
|
46
|
+
boundary: boundary,
|
|
47
|
+
rootBoundary: rootBoundary,
|
|
48
|
+
shouldFlip: shouldFlip,
|
|
49
|
+
offset: offset,
|
|
50
|
+
popupComponent: PopupContainer,
|
|
51
|
+
id: id,
|
|
52
|
+
testId: testId,
|
|
53
|
+
onClose: onClose,
|
|
54
|
+
autoFocus: autoFocus,
|
|
55
|
+
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
56
|
+
triggerRef: triggerRef
|
|
57
|
+
});
|
|
60
58
|
return jsx(Manager, null, jsx(Reference, null, function (_ref2) {
|
|
61
59
|
var _ref3 = _ref2.ref;
|
|
62
60
|
return trigger({
|
|
@@ -74,10 +72,10 @@ export var Popup = /*#__PURE__*/memo(function (_ref) {
|
|
|
74
72
|
'aria-expanded': isOpen,
|
|
75
73
|
'aria-haspopup': true
|
|
76
74
|
});
|
|
77
|
-
}), isOpen && (getBooleanFF('platform.design-system-team.render-popup-in-parent_f73ij') ? shouldRenderToParent ? renderPopperWrapper
|
|
75
|
+
}), isOpen && (getBooleanFF('platform.design-system-team.render-popup-in-parent_f73ij') ? shouldRenderToParent ? renderPopperWrapper : jsx(Portal, {
|
|
78
76
|
zIndex: zIndex
|
|
79
|
-
}, renderPopperWrapper
|
|
77
|
+
}, renderPopperWrapper) : jsx(Portal, {
|
|
80
78
|
zIndex: zIndex
|
|
81
|
-
}, renderPopperWrapper
|
|
79
|
+
}, renderPopperWrapper)));
|
|
82
80
|
});
|
|
83
81
|
export default Popup;
|
package/dist/esm/version.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/popup",
|
|
3
|
-
"version": "1.9.
|
|
3
|
+
"version": "1.9.2",
|
|
4
4
|
"description": "A popup displays brief content in an overlay.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"@atlaskit/popper": "^5.5.0",
|
|
41
41
|
"@atlaskit/portal": "^4.3.0",
|
|
42
42
|
"@atlaskit/theme": "^12.5.0",
|
|
43
|
-
"@atlaskit/tokens": "^1.
|
|
43
|
+
"@atlaskit/tokens": "^1.14.0",
|
|
44
44
|
"@babel/runtime": "^7.0.0",
|
|
45
45
|
"@emotion/react": "^11.7.1",
|
|
46
46
|
"bind-event-listener": "^2.1.1",
|