@atlaskit/popup 4.22.1 → 4.23.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 +8 -0
- package/dist/cjs/compositional/popup-content.js +2 -0
- package/dist/cjs/popper-wrapper.js +2 -0
- package/dist/cjs/popup.js +2 -0
- package/dist/cjs/use-close-manager.js +5 -1
- package/dist/es2019/compositional/popup-content.js +2 -0
- package/dist/es2019/popper-wrapper.js +2 -0
- package/dist/es2019/popup.js +2 -0
- package/dist/es2019/use-close-manager.js +5 -1
- package/dist/esm/compositional/popup-content.js +2 -0
- package/dist/esm/popper-wrapper.js +2 -0
- package/dist/esm/popup.js +2 -0
- package/dist/esm/use-close-manager.js +5 -1
- package/dist/types/compositional/popup-content.d.ts +2 -2
- package/dist/types/popper-wrapper.d.ts +1 -1
- package/dist/types/types.d.ts +6 -1
- package/dist/types/use-close-manager.d.ts +1 -1
- package/dist/types-ts4.5/compositional/popup-content.d.ts +2 -2
- package/dist/types-ts4.5/popper-wrapper.d.ts +1 -1
- package/dist/types-ts4.5/types.d.ts +6 -1
- package/dist/types-ts4.5/use-close-manager.d.ts +1 -1
- package/package.json +6 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @atlaskit/popup
|
|
2
2
|
|
|
3
|
+
## 4.23.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`f6ef9f1fc7454`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f6ef9f1fc7454) -
|
|
8
|
+
Add an optional close-event ignore predicate to popup and dropdown menu so consumers can treat
|
|
9
|
+
external overlays as part of popup interactions.
|
|
10
|
+
|
|
3
11
|
## 4.22.1
|
|
4
12
|
|
|
5
13
|
### Patch Changes
|
|
@@ -57,6 +57,7 @@ var PopupContent = exports.PopupContent = function PopupContent(_ref) {
|
|
|
57
57
|
zIndex = _ref$zIndex === void 0 ? defaultLayer : _ref$zIndex,
|
|
58
58
|
_ref$shouldUseCapture = _ref.shouldUseCaptureOnOutsideClick,
|
|
59
59
|
shouldUseCaptureOnOutsideClick = _ref$shouldUseCapture === void 0 ? false : _ref$shouldUseCapture,
|
|
60
|
+
shouldIgnoreCloseEvent = _ref.shouldIgnoreCloseEvent,
|
|
60
61
|
inShouldRenderToParent = _ref.shouldRenderToParent,
|
|
61
62
|
_ref$shouldDisableFoc = _ref.shouldDisableFocusLock,
|
|
62
63
|
shouldDisableFocusLock = _ref$shouldDisableFoc === void 0 ? false : _ref$shouldDisableFoc,
|
|
@@ -147,6 +148,7 @@ var PopupContent = exports.PopupContent = function PopupContent(_ref) {
|
|
|
147
148
|
autoFocus: autoFocus,
|
|
148
149
|
shouldFitContainer: shouldFitContainer,
|
|
149
150
|
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
151
|
+
shouldIgnoreCloseEvent: shouldIgnoreCloseEvent,
|
|
150
152
|
shouldRenderToParent: shouldRenderToParent,
|
|
151
153
|
shouldDisableFocusLock: shouldDisableFocusLock,
|
|
152
154
|
triggerRef: triggerRef,
|
|
@@ -127,6 +127,7 @@ function PopperWrapper(_ref) {
|
|
|
127
127
|
autoFocus = _ref$autoFocus === void 0 ? true : _ref$autoFocus,
|
|
128
128
|
triggerRef = _ref.triggerRef,
|
|
129
129
|
shouldUseCaptureOnOutsideClick = _ref.shouldUseCaptureOnOutsideClick,
|
|
130
|
+
shouldIgnoreCloseEvent = _ref.shouldIgnoreCloseEvent,
|
|
130
131
|
shouldRenderToParent = _ref.shouldRenderToParent,
|
|
131
132
|
shouldFitContainer = _ref.shouldFitContainer,
|
|
132
133
|
shouldDisableFocusLock = _ref.shouldDisableFocusLock,
|
|
@@ -167,6 +168,7 @@ function PopperWrapper(_ref) {
|
|
|
167
168
|
popupRef: popupRef,
|
|
168
169
|
triggerRef: triggerRef,
|
|
169
170
|
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
171
|
+
shouldIgnoreCloseEvent: shouldIgnoreCloseEvent,
|
|
170
172
|
shouldCloseOnTab: shouldCloseOnTab,
|
|
171
173
|
autoFocus: autoFocus,
|
|
172
174
|
shouldDisableFocusTrap: shouldDisableFocusTrap,
|
package/dist/cjs/popup.js
CHANGED
|
@@ -57,6 +57,7 @@ var Popup = exports.Popup = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
|
57
57
|
zIndex = _props$zIndex === void 0 ? defaultLayer : _props$zIndex,
|
|
58
58
|
_props$shouldUseCaptu = props.shouldUseCaptureOnOutsideClick,
|
|
59
59
|
shouldUseCaptureOnOutsideClick = _props$shouldUseCaptu === void 0 ? false : _props$shouldUseCaptu,
|
|
60
|
+
shouldIgnoreCloseEvent = props.shouldIgnoreCloseEvent,
|
|
60
61
|
_props$shouldRenderTo = props.shouldRenderToParent,
|
|
61
62
|
inShouldRenderToParent = _props$shouldRenderTo === void 0 ? false : _props$shouldRenderTo,
|
|
62
63
|
_props$shouldFitConta = props.shouldFitContainer,
|
|
@@ -135,6 +136,7 @@ var Popup = exports.Popup = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
|
135
136
|
onClose: onClose,
|
|
136
137
|
autoFocus: autoFocus,
|
|
137
138
|
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
139
|
+
shouldIgnoreCloseEvent: shouldIgnoreCloseEvent,
|
|
138
140
|
shouldRenderToParent: shouldRenderToParent || shouldFitContainer,
|
|
139
141
|
shouldFitContainer: shouldFitContainer,
|
|
140
142
|
shouldDisableFocusLock: shouldDisableFocusLock,
|
|
@@ -22,6 +22,7 @@ var useCloseManager = exports.useCloseManager = function useCloseManager(_ref) {
|
|
|
22
22
|
autoFocus = _ref.autoFocus,
|
|
23
23
|
shouldDisableFocusTrap = _ref.shouldDisableFocusTrap,
|
|
24
24
|
capture = _ref.shouldUseCaptureOnOutsideClick,
|
|
25
|
+
shouldIgnoreCloseEvent = _ref.shouldIgnoreCloseEvent,
|
|
25
26
|
shouldCloseOnTab = _ref.shouldCloseOnTab,
|
|
26
27
|
shouldRenderToParent = _ref.shouldRenderToParent;
|
|
27
28
|
var _useLayering = (0, _layering.useLayering)(),
|
|
@@ -36,6 +37,9 @@ var useCloseManager = exports.useCloseManager = function useCloseManager(_ref) {
|
|
|
36
37
|
return _noop.default;
|
|
37
38
|
}
|
|
38
39
|
var closePopup = function closePopup(event) {
|
|
40
|
+
if (shouldIgnoreCloseEvent !== null && shouldIgnoreCloseEvent !== void 0 && shouldIgnoreCloseEvent(event) && (0, _platformFeatureFlags.fg)('cc_blocks_changeboarding')) {
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
39
43
|
if (onClose) {
|
|
40
44
|
var _currentLevel = null;
|
|
41
45
|
if (event.target instanceof HTMLElement) {
|
|
@@ -267,5 +271,5 @@ var useCloseManager = exports.useCloseManager = function useCloseManager(_ref) {
|
|
|
267
271
|
cancelAllFrames();
|
|
268
272
|
unbindBlur();
|
|
269
273
|
};
|
|
270
|
-
}, [isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, capture, isLayerDisabled, shouldCloseOnTab, currentLevel, shouldRenderToParent, requestFrame, cancelAllFrames]);
|
|
274
|
+
}, [isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, capture, shouldIgnoreCloseEvent, isLayerDisabled, shouldCloseOnTab, currentLevel, shouldRenderToParent, requestFrame, cancelAllFrames]);
|
|
271
275
|
};
|
|
@@ -41,6 +41,7 @@ export const PopupContent = ({
|
|
|
41
41
|
autoFocus = true,
|
|
42
42
|
zIndex = defaultLayer,
|
|
43
43
|
shouldUseCaptureOnOutsideClick = false,
|
|
44
|
+
shouldIgnoreCloseEvent,
|
|
44
45
|
shouldRenderToParent: inShouldRenderToParent,
|
|
45
46
|
shouldDisableFocusLock = false,
|
|
46
47
|
shouldFitContainer,
|
|
@@ -131,6 +132,7 @@ export const PopupContent = ({
|
|
|
131
132
|
autoFocus: autoFocus,
|
|
132
133
|
shouldFitContainer: shouldFitContainer,
|
|
133
134
|
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
135
|
+
shouldIgnoreCloseEvent: shouldIgnoreCloseEvent,
|
|
134
136
|
shouldRenderToParent: shouldRenderToParent,
|
|
135
137
|
shouldDisableFocusLock: shouldDisableFocusLock,
|
|
136
138
|
triggerRef: triggerRef,
|
|
@@ -111,6 +111,7 @@ function PopperWrapper({
|
|
|
111
111
|
autoFocus = true,
|
|
112
112
|
triggerRef,
|
|
113
113
|
shouldUseCaptureOnOutsideClick,
|
|
114
|
+
shouldIgnoreCloseEvent,
|
|
114
115
|
shouldRenderToParent,
|
|
115
116
|
shouldFitContainer,
|
|
116
117
|
shouldDisableFocusLock,
|
|
@@ -144,6 +145,7 @@ function PopperWrapper({
|
|
|
144
145
|
popupRef,
|
|
145
146
|
triggerRef,
|
|
146
147
|
shouldUseCaptureOnOutsideClick,
|
|
148
|
+
shouldIgnoreCloseEvent,
|
|
147
149
|
shouldCloseOnTab,
|
|
148
150
|
autoFocus,
|
|
149
151
|
shouldDisableFocusTrap,
|
package/dist/es2019/popup.js
CHANGED
|
@@ -41,6 +41,7 @@ export const Popup = /*#__PURE__*/memo(props => {
|
|
|
41
41
|
autoFocus = true,
|
|
42
42
|
zIndex = defaultLayer,
|
|
43
43
|
shouldUseCaptureOnOutsideClick = false,
|
|
44
|
+
shouldIgnoreCloseEvent,
|
|
44
45
|
shouldRenderToParent: inShouldRenderToParent = false,
|
|
45
46
|
shouldFitContainer = false,
|
|
46
47
|
shouldDisableFocusLock = false,
|
|
@@ -114,6 +115,7 @@ export const Popup = /*#__PURE__*/memo(props => {
|
|
|
114
115
|
onClose: onClose,
|
|
115
116
|
autoFocus: autoFocus,
|
|
116
117
|
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
118
|
+
shouldIgnoreCloseEvent: shouldIgnoreCloseEvent,
|
|
117
119
|
shouldRenderToParent: shouldRenderToParent || shouldFitContainer,
|
|
118
120
|
shouldFitContainer: shouldFitContainer,
|
|
119
121
|
shouldDisableFocusLock: shouldDisableFocusLock,
|
|
@@ -14,6 +14,7 @@ export const useCloseManager = ({
|
|
|
14
14
|
autoFocus,
|
|
15
15
|
shouldDisableFocusTrap,
|
|
16
16
|
shouldUseCaptureOnOutsideClick: capture,
|
|
17
|
+
shouldIgnoreCloseEvent,
|
|
17
18
|
shouldCloseOnTab,
|
|
18
19
|
shouldRenderToParent
|
|
19
20
|
}) => {
|
|
@@ -31,6 +32,9 @@ export const useCloseManager = ({
|
|
|
31
32
|
return noop;
|
|
32
33
|
}
|
|
33
34
|
const closePopup = event => {
|
|
35
|
+
if (shouldIgnoreCloseEvent !== null && shouldIgnoreCloseEvent !== void 0 && shouldIgnoreCloseEvent(event) && fg('cc_blocks_changeboarding')) {
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
34
38
|
if (onClose) {
|
|
35
39
|
let currentLevel = null;
|
|
36
40
|
if (event.target instanceof HTMLElement) {
|
|
@@ -266,5 +270,5 @@ export const useCloseManager = ({
|
|
|
266
270
|
cancelAllFrames();
|
|
267
271
|
unbindBlur();
|
|
268
272
|
};
|
|
269
|
-
}, [isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, capture, isLayerDisabled, shouldCloseOnTab, currentLevel, shouldRenderToParent, requestFrame, cancelAllFrames]);
|
|
273
|
+
}, [isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, capture, shouldIgnoreCloseEvent, isLayerDisabled, shouldCloseOnTab, currentLevel, shouldRenderToParent, requestFrame, cancelAllFrames]);
|
|
270
274
|
};
|
|
@@ -48,6 +48,7 @@ export var PopupContent = function PopupContent(_ref) {
|
|
|
48
48
|
zIndex = _ref$zIndex === void 0 ? defaultLayer : _ref$zIndex,
|
|
49
49
|
_ref$shouldUseCapture = _ref.shouldUseCaptureOnOutsideClick,
|
|
50
50
|
shouldUseCaptureOnOutsideClick = _ref$shouldUseCapture === void 0 ? false : _ref$shouldUseCapture,
|
|
51
|
+
shouldIgnoreCloseEvent = _ref.shouldIgnoreCloseEvent,
|
|
51
52
|
inShouldRenderToParent = _ref.shouldRenderToParent,
|
|
52
53
|
_ref$shouldDisableFoc = _ref.shouldDisableFocusLock,
|
|
53
54
|
shouldDisableFocusLock = _ref$shouldDisableFoc === void 0 ? false : _ref$shouldDisableFoc,
|
|
@@ -138,6 +139,7 @@ export var PopupContent = function PopupContent(_ref) {
|
|
|
138
139
|
autoFocus: autoFocus,
|
|
139
140
|
shouldFitContainer: shouldFitContainer,
|
|
140
141
|
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
142
|
+
shouldIgnoreCloseEvent: shouldIgnoreCloseEvent,
|
|
141
143
|
shouldRenderToParent: shouldRenderToParent,
|
|
142
144
|
shouldDisableFocusLock: shouldDisableFocusLock,
|
|
143
145
|
triggerRef: triggerRef,
|
|
@@ -118,6 +118,7 @@ function PopperWrapper(_ref) {
|
|
|
118
118
|
autoFocus = _ref$autoFocus === void 0 ? true : _ref$autoFocus,
|
|
119
119
|
triggerRef = _ref.triggerRef,
|
|
120
120
|
shouldUseCaptureOnOutsideClick = _ref.shouldUseCaptureOnOutsideClick,
|
|
121
|
+
shouldIgnoreCloseEvent = _ref.shouldIgnoreCloseEvent,
|
|
121
122
|
shouldRenderToParent = _ref.shouldRenderToParent,
|
|
122
123
|
shouldFitContainer = _ref.shouldFitContainer,
|
|
123
124
|
shouldDisableFocusLock = _ref.shouldDisableFocusLock,
|
|
@@ -158,6 +159,7 @@ function PopperWrapper(_ref) {
|
|
|
158
159
|
popupRef: popupRef,
|
|
159
160
|
triggerRef: triggerRef,
|
|
160
161
|
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
162
|
+
shouldIgnoreCloseEvent: shouldIgnoreCloseEvent,
|
|
161
163
|
shouldCloseOnTab: shouldCloseOnTab,
|
|
162
164
|
autoFocus: autoFocus,
|
|
163
165
|
shouldDisableFocusTrap: shouldDisableFocusTrap,
|
package/dist/esm/popup.js
CHANGED
|
@@ -49,6 +49,7 @@ export var Popup = /*#__PURE__*/memo(function (props) {
|
|
|
49
49
|
zIndex = _props$zIndex === void 0 ? defaultLayer : _props$zIndex,
|
|
50
50
|
_props$shouldUseCaptu = props.shouldUseCaptureOnOutsideClick,
|
|
51
51
|
shouldUseCaptureOnOutsideClick = _props$shouldUseCaptu === void 0 ? false : _props$shouldUseCaptu,
|
|
52
|
+
shouldIgnoreCloseEvent = props.shouldIgnoreCloseEvent,
|
|
52
53
|
_props$shouldRenderTo = props.shouldRenderToParent,
|
|
53
54
|
inShouldRenderToParent = _props$shouldRenderTo === void 0 ? false : _props$shouldRenderTo,
|
|
54
55
|
_props$shouldFitConta = props.shouldFitContainer,
|
|
@@ -127,6 +128,7 @@ export var Popup = /*#__PURE__*/memo(function (props) {
|
|
|
127
128
|
onClose: onClose,
|
|
128
129
|
autoFocus: autoFocus,
|
|
129
130
|
shouldUseCaptureOnOutsideClick: shouldUseCaptureOnOutsideClick,
|
|
131
|
+
shouldIgnoreCloseEvent: shouldIgnoreCloseEvent,
|
|
130
132
|
shouldRenderToParent: shouldRenderToParent || shouldFitContainer,
|
|
131
133
|
shouldFitContainer: shouldFitContainer,
|
|
132
134
|
shouldDisableFocusLock: shouldDisableFocusLock,
|
|
@@ -14,6 +14,7 @@ export var useCloseManager = function useCloseManager(_ref) {
|
|
|
14
14
|
autoFocus = _ref.autoFocus,
|
|
15
15
|
shouldDisableFocusTrap = _ref.shouldDisableFocusTrap,
|
|
16
16
|
capture = _ref.shouldUseCaptureOnOutsideClick,
|
|
17
|
+
shouldIgnoreCloseEvent = _ref.shouldIgnoreCloseEvent,
|
|
17
18
|
shouldCloseOnTab = _ref.shouldCloseOnTab,
|
|
18
19
|
shouldRenderToParent = _ref.shouldRenderToParent;
|
|
19
20
|
var _useLayering = useLayering(),
|
|
@@ -28,6 +29,9 @@ export var useCloseManager = function useCloseManager(_ref) {
|
|
|
28
29
|
return noop;
|
|
29
30
|
}
|
|
30
31
|
var closePopup = function closePopup(event) {
|
|
32
|
+
if (shouldIgnoreCloseEvent !== null && shouldIgnoreCloseEvent !== void 0 && shouldIgnoreCloseEvent(event) && fg('cc_blocks_changeboarding')) {
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
31
35
|
if (onClose) {
|
|
32
36
|
var _currentLevel = null;
|
|
33
37
|
if (event.target instanceof HTMLElement) {
|
|
@@ -259,5 +263,5 @@ export var useCloseManager = function useCloseManager(_ref) {
|
|
|
259
263
|
cancelAllFrames();
|
|
260
264
|
unbindBlur();
|
|
261
265
|
};
|
|
262
|
-
}, [isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, capture, isLayerDisabled, shouldCloseOnTab, currentLevel, shouldRenderToParent, requestFrame, cancelAllFrames]);
|
|
266
|
+
}, [isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, capture, shouldIgnoreCloseEvent, isLayerDisabled, shouldCloseOnTab, currentLevel, shouldRenderToParent, requestFrame, cancelAllFrames]);
|
|
263
267
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type ContentProps, type PopupProps as LegacyPopupProps } from '../types';
|
|
3
|
-
type CommonContentPopupProps = Pick<LegacyPopupProps, 'xcss' | 'appearance' | 'boundary' | 'offset' | 'onClose' | 'testId' | 'placement' | 'fallbackPlacements' | 'popupComponent' | 'shouldFlip' | 'rootBoundary' | 'autoFocus' | 'shouldRenderToParent' | 'shouldUseCaptureOnOutsideClick' | 'shouldDisableFocusLock' | 'strategy' | 'zIndex' | 'shouldFitViewport' | 'role' | 'label' | 'titleId'> & {
|
|
3
|
+
type CommonContentPopupProps = Pick<LegacyPopupProps, 'xcss' | 'appearance' | 'boundary' | 'offset' | 'onClose' | 'testId' | 'placement' | 'fallbackPlacements' | 'popupComponent' | 'shouldFlip' | 'rootBoundary' | 'autoFocus' | 'shouldRenderToParent' | 'shouldUseCaptureOnOutsideClick' | 'shouldIgnoreCloseEvent' | 'shouldDisableFocusLock' | 'strategy' | 'zIndex' | 'shouldFitViewport' | 'role' | 'label' | 'titleId'> & {
|
|
4
4
|
children: (props: ContentProps) => React.ReactNode;
|
|
5
5
|
/**
|
|
6
6
|
* ___Use with caution___
|
|
@@ -31,5 +31,5 @@ export type PopupContentProps = ShouldFitContainerContentPopupProps | StandardPo
|
|
|
31
31
|
*
|
|
32
32
|
* It must be a child of the Popup component.
|
|
33
33
|
*/
|
|
34
|
-
export declare const PopupContent: ({ xcss, appearance: inAppearance, children, boundary, offset, strategy, onClose, testId, rootBoundary, shouldFlip, placement, fallbackPlacements, popupComponent, autoFocus, zIndex, shouldUseCaptureOnOutsideClick, shouldRenderToParent: inShouldRenderToParent, shouldDisableFocusLock, shouldFitContainer, shouldFitViewport, shouldDisableGpuAcceleration, role, label, titleId, }: PopupContentProps) => React.JSX.Element | null;
|
|
34
|
+
export declare const PopupContent: ({ xcss, appearance: inAppearance, children, boundary, offset, strategy, onClose, testId, rootBoundary, shouldFlip, placement, fallbackPlacements, popupComponent, autoFocus, zIndex, shouldUseCaptureOnOutsideClick, shouldIgnoreCloseEvent, shouldRenderToParent: inShouldRenderToParent, shouldDisableFocusLock, shouldFitContainer, shouldFitViewport, shouldDisableGpuAcceleration, role, label, titleId, }: PopupContentProps) => React.JSX.Element | null;
|
|
35
35
|
export {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { type PopperWrapperProps } from './types';
|
|
2
|
-
declare function PopperWrapper({ xcss, isOpen, id, offset, testId, content, fallbackPlacements, onClose, boundary, rootBoundary, shouldFlip, placement, popupComponent: PopupContainer, autoFocus, triggerRef, shouldUseCaptureOnOutsideClick, shouldRenderToParent, shouldFitContainer, shouldDisableFocusLock, shouldReturnFocus, strategy, role, label, titleId, modifiers, shouldFitViewport, appearance, zIndex, }: PopperWrapperProps): JSX.Element;
|
|
2
|
+
declare function PopperWrapper({ xcss, isOpen, id, offset, testId, content, fallbackPlacements, onClose, boundary, rootBoundary, shouldFlip, placement, popupComponent: PopupContainer, autoFocus, triggerRef, shouldUseCaptureOnOutsideClick, shouldIgnoreCloseEvent, shouldRenderToParent, shouldFitContainer, shouldDisableFocusLock, shouldReturnFocus, strategy, role, label, titleId, modifiers, shouldFitViewport, appearance, zIndex, }: PopperWrapperProps): JSX.Element;
|
|
3
3
|
export default PopperWrapper;
|
package/dist/types/types.d.ts
CHANGED
|
@@ -227,6 +227,11 @@ interface BaseProps {
|
|
|
227
227
|
* `capture: true`.
|
|
228
228
|
*/
|
|
229
229
|
shouldUseCaptureOnOutsideClick?: boolean;
|
|
230
|
+
/**
|
|
231
|
+
* Allows consumers to ignore specific close events, for example when an external overlay
|
|
232
|
+
* should be treated as part of the popup interaction.
|
|
233
|
+
*/
|
|
234
|
+
shouldIgnoreCloseEvent?: (event: Event | React.MouseEvent | React.KeyboardEvent) => boolean;
|
|
230
235
|
/**
|
|
231
236
|
* The root element where the popup should be rendered.
|
|
232
237
|
* Defaults to `false`.
|
|
@@ -324,7 +329,7 @@ export interface PopperWrapperProps extends BaseProps {
|
|
|
324
329
|
zIndex?: number;
|
|
325
330
|
triggerRef: TriggerRef;
|
|
326
331
|
}
|
|
327
|
-
export type CloseManagerHook = Pick<PopupProps, 'isOpen' | 'onClose'> & {
|
|
332
|
+
export type CloseManagerHook = Pick<PopupProps, 'isOpen' | 'onClose' | 'shouldIgnoreCloseEvent'> & {
|
|
328
333
|
popupRef: PopupRef;
|
|
329
334
|
triggerRef: TriggerRef;
|
|
330
335
|
shouldUseCaptureOnOutsideClick?: boolean;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { type CloseManagerHook } from './types';
|
|
2
|
-
export declare const useCloseManager: ({ isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, shouldUseCaptureOnOutsideClick: capture, shouldCloseOnTab, shouldRenderToParent, }: CloseManagerHook) => void;
|
|
2
|
+
export declare const useCloseManager: ({ isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, shouldUseCaptureOnOutsideClick: capture, shouldIgnoreCloseEvent, shouldCloseOnTab, shouldRenderToParent, }: CloseManagerHook) => void;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type ContentProps, type PopupProps as LegacyPopupProps } from '../types';
|
|
3
|
-
type CommonContentPopupProps = Pick<LegacyPopupProps, 'xcss' | 'appearance' | 'boundary' | 'offset' | 'onClose' | 'testId' | 'placement' | 'fallbackPlacements' | 'popupComponent' | 'shouldFlip' | 'rootBoundary' | 'autoFocus' | 'shouldRenderToParent' | 'shouldUseCaptureOnOutsideClick' | 'shouldDisableFocusLock' | 'strategy' | 'zIndex' | 'shouldFitViewport' | 'role' | 'label' | 'titleId'> & {
|
|
3
|
+
type CommonContentPopupProps = Pick<LegacyPopupProps, 'xcss' | 'appearance' | 'boundary' | 'offset' | 'onClose' | 'testId' | 'placement' | 'fallbackPlacements' | 'popupComponent' | 'shouldFlip' | 'rootBoundary' | 'autoFocus' | 'shouldRenderToParent' | 'shouldUseCaptureOnOutsideClick' | 'shouldIgnoreCloseEvent' | 'shouldDisableFocusLock' | 'strategy' | 'zIndex' | 'shouldFitViewport' | 'role' | 'label' | 'titleId'> & {
|
|
4
4
|
children: (props: ContentProps) => React.ReactNode;
|
|
5
5
|
/**
|
|
6
6
|
* ___Use with caution___
|
|
@@ -31,5 +31,5 @@ export type PopupContentProps = ShouldFitContainerContentPopupProps | StandardPo
|
|
|
31
31
|
*
|
|
32
32
|
* It must be a child of the Popup component.
|
|
33
33
|
*/
|
|
34
|
-
export declare const PopupContent: ({ xcss, appearance: inAppearance, children, boundary, offset, strategy, onClose, testId, rootBoundary, shouldFlip, placement, fallbackPlacements, popupComponent, autoFocus, zIndex, shouldUseCaptureOnOutsideClick, shouldRenderToParent: inShouldRenderToParent, shouldDisableFocusLock, shouldFitContainer, shouldFitViewport, shouldDisableGpuAcceleration, role, label, titleId, }: PopupContentProps) => React.JSX.Element | null;
|
|
34
|
+
export declare const PopupContent: ({ xcss, appearance: inAppearance, children, boundary, offset, strategy, onClose, testId, rootBoundary, shouldFlip, placement, fallbackPlacements, popupComponent, autoFocus, zIndex, shouldUseCaptureOnOutsideClick, shouldIgnoreCloseEvent, shouldRenderToParent: inShouldRenderToParent, shouldDisableFocusLock, shouldFitContainer, shouldFitViewport, shouldDisableGpuAcceleration, role, label, titleId, }: PopupContentProps) => React.JSX.Element | null;
|
|
35
35
|
export {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { type PopperWrapperProps } from './types';
|
|
2
|
-
declare function PopperWrapper({ xcss, isOpen, id, offset, testId, content, fallbackPlacements, onClose, boundary, rootBoundary, shouldFlip, placement, popupComponent: PopupContainer, autoFocus, triggerRef, shouldUseCaptureOnOutsideClick, shouldRenderToParent, shouldFitContainer, shouldDisableFocusLock, shouldReturnFocus, strategy, role, label, titleId, modifiers, shouldFitViewport, appearance, zIndex, }: PopperWrapperProps): JSX.Element;
|
|
2
|
+
declare function PopperWrapper({ xcss, isOpen, id, offset, testId, content, fallbackPlacements, onClose, boundary, rootBoundary, shouldFlip, placement, popupComponent: PopupContainer, autoFocus, triggerRef, shouldUseCaptureOnOutsideClick, shouldIgnoreCloseEvent, shouldRenderToParent, shouldFitContainer, shouldDisableFocusLock, shouldReturnFocus, strategy, role, label, titleId, modifiers, shouldFitViewport, appearance, zIndex, }: PopperWrapperProps): JSX.Element;
|
|
3
3
|
export default PopperWrapper;
|
|
@@ -230,6 +230,11 @@ interface BaseProps {
|
|
|
230
230
|
* `capture: true`.
|
|
231
231
|
*/
|
|
232
232
|
shouldUseCaptureOnOutsideClick?: boolean;
|
|
233
|
+
/**
|
|
234
|
+
* Allows consumers to ignore specific close events, for example when an external overlay
|
|
235
|
+
* should be treated as part of the popup interaction.
|
|
236
|
+
*/
|
|
237
|
+
shouldIgnoreCloseEvent?: (event: Event | React.MouseEvent | React.KeyboardEvent) => boolean;
|
|
233
238
|
/**
|
|
234
239
|
* The root element where the popup should be rendered.
|
|
235
240
|
* Defaults to `false`.
|
|
@@ -327,7 +332,7 @@ export interface PopperWrapperProps extends BaseProps {
|
|
|
327
332
|
zIndex?: number;
|
|
328
333
|
triggerRef: TriggerRef;
|
|
329
334
|
}
|
|
330
|
-
export type CloseManagerHook = Pick<PopupProps, 'isOpen' | 'onClose'> & {
|
|
335
|
+
export type CloseManagerHook = Pick<PopupProps, 'isOpen' | 'onClose' | 'shouldIgnoreCloseEvent'> & {
|
|
331
336
|
popupRef: PopupRef;
|
|
332
337
|
triggerRef: TriggerRef;
|
|
333
338
|
shouldUseCaptureOnOutsideClick?: boolean;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { type CloseManagerHook } from './types';
|
|
2
|
-
export declare const useCloseManager: ({ isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, shouldUseCaptureOnOutsideClick: capture, shouldCloseOnTab, shouldRenderToParent, }: CloseManagerHook) => void;
|
|
2
|
+
export declare const useCloseManager: ({ isOpen, onClose, popupRef, triggerRef, autoFocus, shouldDisableFocusTrap, shouldUseCaptureOnOutsideClick: capture, shouldIgnoreCloseEvent, shouldCloseOnTab, shouldRenderToParent, }: CloseManagerHook) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/popup",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.23.0",
|
|
4
4
|
"description": "A popup displays brief content in an overlay.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
"@atlaskit/popper": "^7.2.0",
|
|
48
48
|
"@atlaskit/portal": "^5.5.0",
|
|
49
49
|
"@atlaskit/primitives": "^19.0.0",
|
|
50
|
-
"@atlaskit/tokens": "^13.
|
|
50
|
+
"@atlaskit/tokens": "^13.1.0",
|
|
51
51
|
"@atlaskit/top-layer": "^0.12.0",
|
|
52
52
|
"@babel/runtime": "^7.0.0",
|
|
53
53
|
"@compiled/react": "^0.20.0",
|
|
@@ -74,7 +74,7 @@
|
|
|
74
74
|
"@atlaskit/modal-dialog": "^15.2.0",
|
|
75
75
|
"@atlaskit/section-message": "^8.13.0",
|
|
76
76
|
"@atlaskit/textfield": "^8.3.0",
|
|
77
|
-
"@atlaskit/toggle": "^16.
|
|
77
|
+
"@atlaskit/toggle": "^16.1.0",
|
|
78
78
|
"@atlassian/feature-flags-test-utils": "^1.1.0",
|
|
79
79
|
"@atlassian/react-compiler-gating": "workspace:^",
|
|
80
80
|
"@atlassian/ssr-tests": "workspace:^",
|
|
@@ -114,6 +114,9 @@
|
|
|
114
114
|
}
|
|
115
115
|
},
|
|
116
116
|
"platform-feature-flags": {
|
|
117
|
+
"cc_blocks_changeboarding": {
|
|
118
|
+
"type": "boolean"
|
|
119
|
+
},
|
|
117
120
|
"jsmgrowth_popup_fix": {
|
|
118
121
|
"type": "boolean"
|
|
119
122
|
},
|