@atlaskit/top-layer 5.1.0 → 6.1.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 +32 -0
- package/dist/cjs/internal/use-animated-visibility.js +24 -3
- package/dist/cjs/testing/flush-popover-exit.js +94 -0
- package/dist/es2019/internal/use-animated-visibility.js +25 -3
- package/dist/es2019/testing/flush-popover-exit.js +57 -0
- package/dist/esm/internal/use-animated-visibility.js +24 -3
- package/dist/esm/testing/flush-popover-exit.js +87 -0
- package/dist/types/internal/use-animated-visibility.d.ts +1 -0
- package/dist/types/testing/flush-popover-exit.d.ts +22 -0
- package/package.json +7 -7
- package/testing/flush-popover-exit/package.json +10 -0
- package/dist/cjs/entry-points/focus.js +0 -26
- package/dist/cjs/entry-points/open-layer-observer.js +0 -33
- package/dist/es2019/entry-points/focus.js +0 -17
- package/dist/es2019/entry-points/open-layer-observer.js +0 -21
- package/dist/esm/entry-points/focus.js +0 -17
- package/dist/esm/entry-points/open-layer-observer.js +0 -21
- package/dist/types/entry-points/focus.d.ts +0 -16
- package/dist/types/entry-points/open-layer-observer.d.ts +0 -20
- package/focus/package.json +0 -10
- package/open-layer-observer/package.json +0 -10
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,37 @@
|
|
|
1
1
|
# @atlaskit/top-layer
|
|
2
2
|
|
|
3
|
+
## 6.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`457c77d8f6992`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/457c77d8f6992) -
|
|
8
|
+
Adds a `@atlaskit/top-layer/testing/flush-popover-exit` entrypoint exporting `flushPopoverExit()`,
|
|
9
|
+
a Jest helper for jsdom. Top-layer settles a `Popover` exit in a native promise microtask after
|
|
10
|
+
the closed `toggle`, which Jest fake timers do not drain, so a synchronous
|
|
11
|
+
`act(() => jest.runOnlyPendingTimers())` returns before `onExitFinish` fires and the host
|
|
12
|
+
unmounts. `await flushPopoverExit()` runs the pending fake timers and yields once inside an async
|
|
13
|
+
`act` (or waits one real task when fake timers are off) so tests can assert the closed state.
|
|
14
|
+
Requires React 18.3 or newer. Browser behaviour is unchanged.
|
|
15
|
+
|
|
16
|
+
### Patch Changes
|
|
17
|
+
|
|
18
|
+
- [`457c77d8f6992`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/457c77d8f6992) -
|
|
19
|
+
`Popover` and `Dialog` no longer keep their exit styles when they reopen straight after a browser
|
|
20
|
+
dismiss, or when React StrictMode runs effects twice.
|
|
21
|
+
- Updated dependencies
|
|
22
|
+
|
|
23
|
+
## 6.0.0
|
|
24
|
+
|
|
25
|
+
### Major Changes
|
|
26
|
+
|
|
27
|
+
- [`0c7c7be927bde`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0c7c7be927bde) -
|
|
28
|
+
Remove deprecated Volt re-export shims from public package entry points. Consumers should import
|
|
29
|
+
from the replacement subpaths or implementation entry points instead.
|
|
30
|
+
|
|
31
|
+
### Patch Changes
|
|
32
|
+
|
|
33
|
+
- Updated dependencies
|
|
34
|
+
|
|
3
35
|
## 5.1.0
|
|
4
36
|
|
|
5
37
|
### Minor Changes
|
|
@@ -71,6 +71,7 @@ function runOnAnimationsSettled(_ref2) {
|
|
|
71
71
|
* interrupts: entering → exiting (close mid-entry)
|
|
72
72
|
* exiting → entering (reopen mid-exit, animated)
|
|
73
73
|
* exiting → open (reopen mid-handshake, non-animated)
|
|
74
|
+
* exiting → open (native reopen while controlled intent is open)
|
|
74
75
|
* ```
|
|
75
76
|
*/
|
|
76
77
|
|
|
@@ -134,6 +135,19 @@ function getNextVisibilityState(state, action) {
|
|
|
134
135
|
phase: 'exiting'
|
|
135
136
|
});
|
|
136
137
|
}
|
|
138
|
+
|
|
139
|
+
// A browser dismiss started the exit, and something showed the element
|
|
140
|
+
// again before the exit settled, while controlled intent stayed open. For
|
|
141
|
+
// example, `@atlaskit/tooltip` re-shows after a light dismiss in the same
|
|
142
|
+
// task. The element never painted closed, so go back to `open`.
|
|
143
|
+
if (action.type === 'native-open-started') {
|
|
144
|
+
if (state.phase !== 'exiting' || state.controlledIntent !== 'open') {
|
|
145
|
+
return state;
|
|
146
|
+
}
|
|
147
|
+
return _objectSpread(_objectSpread({}, state), {}, {
|
|
148
|
+
phase: 'open'
|
|
149
|
+
});
|
|
150
|
+
}
|
|
137
151
|
if (action.type === 'entry-settled') {
|
|
138
152
|
if (state.phase !== 'entering') {
|
|
139
153
|
return state;
|
|
@@ -251,9 +265,16 @@ function useAnimatedVisibility(_ref4) {
|
|
|
251
265
|
cancelExitSettlementRef.current();
|
|
252
266
|
// Snapshot currentTarget because the DOM clears it after event dispatch.
|
|
253
267
|
var element = event.currentTarget;
|
|
254
|
-
if (event.newState === 'open'
|
|
255
|
-
element
|
|
256
|
-
|
|
268
|
+
if (event.newState === 'open') {
|
|
269
|
+
if (element instanceof HTMLElement) {
|
|
270
|
+
element.removeAttribute('inert');
|
|
271
|
+
element.removeAttribute('aria-hidden');
|
|
272
|
+
}
|
|
273
|
+
// Dispatched on every native open. The reducer only acts when a browser
|
|
274
|
+
// dismiss left the host `exiting` while `isOpen` stayed `true`.
|
|
275
|
+
dispatch({
|
|
276
|
+
type: 'native-open-started'
|
|
277
|
+
});
|
|
257
278
|
}
|
|
258
279
|
if (event.newState === 'closed') {
|
|
259
280
|
if (element instanceof HTMLElement) {
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.flushPopoverExit = flushPopoverExit;
|
|
8
|
+
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
9
|
+
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
10
|
+
var _react = require("react");
|
|
11
|
+
/**
|
|
12
|
+
* Flushes a `Popover` exit in jsdom so that `onExitFinish` has fired and the
|
|
13
|
+
* host element has unmounted before the caller asserts.
|
|
14
|
+
*
|
|
15
|
+
* Requires React 18.3 or newer (`act` is imported from `react`).
|
|
16
|
+
*
|
|
17
|
+
* Hiding is two steps: the testing polyfill fires the closed `toggle` as a task,
|
|
18
|
+
* then top-layer settles the exit in a native promise microtask. Jest fake
|
|
19
|
+
* timers drain the task but not that microtask, so a synchronous
|
|
20
|
+
* `act(() => jest.runOnlyPendingTimers())` returns too early. Real browsers are
|
|
21
|
+
* unaffected. See `notes/architecture/animations.md` ("settles in a microtask").
|
|
22
|
+
*
|
|
23
|
+
* Flush any delay before `hidePopover()` first (for example the `delay` prop on
|
|
24
|
+
* `@atlaskit/tooltip`). Only `Popover` is covered - `Dialog` chains a second
|
|
25
|
+
* timer for its `close` event, which this helper does not wait for.
|
|
26
|
+
*
|
|
27
|
+
* @example
|
|
28
|
+
* rerender(<Popover isOpen={false} shouldAnimate onExitFinish={onExitFinish} />);
|
|
29
|
+
* await flushPopoverExit();
|
|
30
|
+
* expect(onExitFinish).toHaveBeenCalledTimes(1);
|
|
31
|
+
*/
|
|
32
|
+
|
|
33
|
+
// `react` is a peer dependency, so this entrypoint adds no testing-library dependency.
|
|
34
|
+
|
|
35
|
+
// Mirrors `jestFakeTimersAreEnabled` in `@testing-library/dom`.
|
|
36
|
+
function areJestFakeTimersEnabled() {
|
|
37
|
+
if (typeof jest === 'undefined') {
|
|
38
|
+
return false;
|
|
39
|
+
}
|
|
40
|
+
var timer = setTimeout;
|
|
41
|
+
// Legacy fake timers mark the function. Modern (sinon) fake timers attach a `clock`.
|
|
42
|
+
return timer._isMockFunction === true || Object.prototype.hasOwnProperty.call(setTimeout, 'clock');
|
|
43
|
+
}
|
|
44
|
+
function waitForOneRealTask() {
|
|
45
|
+
return new Promise(function (resolve) {
|
|
46
|
+
setTimeout(resolve, 0);
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
function flushPopoverExit() {
|
|
50
|
+
return _flushPopoverExit.apply(this, arguments);
|
|
51
|
+
}
|
|
52
|
+
function _flushPopoverExit() {
|
|
53
|
+
_flushPopoverExit = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
|
|
54
|
+
return _regenerator.default.wrap(function (_context2) {
|
|
55
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
56
|
+
case 0:
|
|
57
|
+
if (!(typeof _react.act !== 'function')) {
|
|
58
|
+
_context2.next = 1;
|
|
59
|
+
break;
|
|
60
|
+
}
|
|
61
|
+
throw new Error('flushPopoverExit() requires React 18.3 or newer: `act` is not exported by this version of `react`');
|
|
62
|
+
case 1:
|
|
63
|
+
_context2.next = 2;
|
|
64
|
+
return (0, _react.act)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
|
|
65
|
+
return _regenerator.default.wrap(function (_context) {
|
|
66
|
+
while (1) switch (_context.prev = _context.next) {
|
|
67
|
+
case 0:
|
|
68
|
+
if (!areJestFakeTimersEnabled()) {
|
|
69
|
+
_context.next = 2;
|
|
70
|
+
break;
|
|
71
|
+
}
|
|
72
|
+
jest.runOnlyPendingTimers();
|
|
73
|
+
// Yield once so the settlement job runs before `act` commits.
|
|
74
|
+
_context.next = 1;
|
|
75
|
+
return Promise.resolve();
|
|
76
|
+
case 1:
|
|
77
|
+
return _context.abrupt("return");
|
|
78
|
+
case 2:
|
|
79
|
+
_context.next = 3;
|
|
80
|
+
return waitForOneRealTask();
|
|
81
|
+
case 3:
|
|
82
|
+
case "end":
|
|
83
|
+
return _context.stop();
|
|
84
|
+
}
|
|
85
|
+
}, _callee);
|
|
86
|
+
})));
|
|
87
|
+
case 2:
|
|
88
|
+
case "end":
|
|
89
|
+
return _context2.stop();
|
|
90
|
+
}
|
|
91
|
+
}, _callee2);
|
|
92
|
+
}));
|
|
93
|
+
return _flushPopoverExit.apply(this, arguments);
|
|
94
|
+
}
|
|
@@ -60,6 +60,7 @@ function runOnAnimationsSettled({
|
|
|
60
60
|
* interrupts: entering → exiting (close mid-entry)
|
|
61
61
|
* exiting → entering (reopen mid-exit, animated)
|
|
62
62
|
* exiting → open (reopen mid-handshake, non-animated)
|
|
63
|
+
* exiting → open (native reopen while controlled intent is open)
|
|
63
64
|
* ```
|
|
64
65
|
*/
|
|
65
66
|
|
|
@@ -127,6 +128,20 @@ function getNextVisibilityState(state, action) {
|
|
|
127
128
|
phase: 'exiting'
|
|
128
129
|
};
|
|
129
130
|
}
|
|
131
|
+
|
|
132
|
+
// A browser dismiss started the exit, and something showed the element
|
|
133
|
+
// again before the exit settled, while controlled intent stayed open. For
|
|
134
|
+
// example, `@atlaskit/tooltip` re-shows after a light dismiss in the same
|
|
135
|
+
// task. The element never painted closed, so go back to `open`.
|
|
136
|
+
if (action.type === 'native-open-started') {
|
|
137
|
+
if (state.phase !== 'exiting' || state.controlledIntent !== 'open') {
|
|
138
|
+
return state;
|
|
139
|
+
}
|
|
140
|
+
return {
|
|
141
|
+
...state,
|
|
142
|
+
phase: 'open'
|
|
143
|
+
};
|
|
144
|
+
}
|
|
130
145
|
if (action.type === 'entry-settled') {
|
|
131
146
|
if (state.phase !== 'entering') {
|
|
132
147
|
return state;
|
|
@@ -246,9 +261,16 @@ export function useAnimatedVisibility({
|
|
|
246
261
|
cancelExitSettlementRef.current();
|
|
247
262
|
// Snapshot currentTarget because the DOM clears it after event dispatch.
|
|
248
263
|
const element = event.currentTarget;
|
|
249
|
-
if (event.newState === 'open'
|
|
250
|
-
element
|
|
251
|
-
|
|
264
|
+
if (event.newState === 'open') {
|
|
265
|
+
if (element instanceof HTMLElement) {
|
|
266
|
+
element.removeAttribute('inert');
|
|
267
|
+
element.removeAttribute('aria-hidden');
|
|
268
|
+
}
|
|
269
|
+
// Dispatched on every native open. The reducer only acts when a browser
|
|
270
|
+
// dismiss left the host `exiting` while `isOpen` stayed `true`.
|
|
271
|
+
dispatch({
|
|
272
|
+
type: 'native-open-started'
|
|
273
|
+
});
|
|
252
274
|
}
|
|
253
275
|
if (event.newState === 'closed') {
|
|
254
276
|
if (element instanceof HTMLElement) {
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flushes a `Popover` exit in jsdom so that `onExitFinish` has fired and the
|
|
3
|
+
* host element has unmounted before the caller asserts.
|
|
4
|
+
*
|
|
5
|
+
* Requires React 18.3 or newer (`act` is imported from `react`).
|
|
6
|
+
*
|
|
7
|
+
* Hiding is two steps: the testing polyfill fires the closed `toggle` as a task,
|
|
8
|
+
* then top-layer settles the exit in a native promise microtask. Jest fake
|
|
9
|
+
* timers drain the task but not that microtask, so a synchronous
|
|
10
|
+
* `act(() => jest.runOnlyPendingTimers())` returns too early. Real browsers are
|
|
11
|
+
* unaffected. See `notes/architecture/animations.md` ("settles in a microtask").
|
|
12
|
+
*
|
|
13
|
+
* Flush any delay before `hidePopover()` first (for example the `delay` prop on
|
|
14
|
+
* `@atlaskit/tooltip`). Only `Popover` is covered - `Dialog` chains a second
|
|
15
|
+
* timer for its `close` event, which this helper does not wait for.
|
|
16
|
+
*
|
|
17
|
+
* @example
|
|
18
|
+
* rerender(<Popover isOpen={false} shouldAnimate onExitFinish={onExitFinish} />);
|
|
19
|
+
* await flushPopoverExit();
|
|
20
|
+
* expect(onExitFinish).toHaveBeenCalledTimes(1);
|
|
21
|
+
*/
|
|
22
|
+
|
|
23
|
+
// `react` is a peer dependency, so this entrypoint adds no testing-library dependency.
|
|
24
|
+
import { act } from 'react';
|
|
25
|
+
|
|
26
|
+
// Mirrors `jestFakeTimersAreEnabled` in `@testing-library/dom`.
|
|
27
|
+
function areJestFakeTimersEnabled() {
|
|
28
|
+
if (typeof jest === 'undefined') {
|
|
29
|
+
return false;
|
|
30
|
+
}
|
|
31
|
+
const timer = setTimeout;
|
|
32
|
+
// Legacy fake timers mark the function. Modern (sinon) fake timers attach a `clock`.
|
|
33
|
+
return timer._isMockFunction === true || Object.prototype.hasOwnProperty.call(setTimeout, 'clock');
|
|
34
|
+
}
|
|
35
|
+
function waitForOneRealTask() {
|
|
36
|
+
return new Promise(resolve => {
|
|
37
|
+
setTimeout(resolve, 0);
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
export async function flushPopoverExit() {
|
|
41
|
+
// The peer range allows React 18.2, which does not export `act`. A plain throw rather than
|
|
42
|
+
// `tiny-invariant`, which is only a devDependency here.
|
|
43
|
+
if (typeof act !== 'function') {
|
|
44
|
+
throw new Error('flushPopoverExit() requires React 18.3 or newer: `act` is not exported by this version of `react`');
|
|
45
|
+
}
|
|
46
|
+
await act(async () => {
|
|
47
|
+
if (areJestFakeTimersEnabled()) {
|
|
48
|
+
jest.runOnlyPendingTimers();
|
|
49
|
+
// Yield once so the settlement job runs before `act` commits.
|
|
50
|
+
await Promise.resolve();
|
|
51
|
+
return;
|
|
52
|
+
}
|
|
53
|
+
// The polyfill's `toggle` task was queued first, so it and its settlement microtask both
|
|
54
|
+
// run before this timer resolves.
|
|
55
|
+
await waitForOneRealTask();
|
|
56
|
+
});
|
|
57
|
+
}
|
|
@@ -64,6 +64,7 @@ function runOnAnimationsSettled(_ref2) {
|
|
|
64
64
|
* interrupts: entering → exiting (close mid-entry)
|
|
65
65
|
* exiting → entering (reopen mid-exit, animated)
|
|
66
66
|
* exiting → open (reopen mid-handshake, non-animated)
|
|
67
|
+
* exiting → open (native reopen while controlled intent is open)
|
|
67
68
|
* ```
|
|
68
69
|
*/
|
|
69
70
|
|
|
@@ -127,6 +128,19 @@ function getNextVisibilityState(state, action) {
|
|
|
127
128
|
phase: 'exiting'
|
|
128
129
|
});
|
|
129
130
|
}
|
|
131
|
+
|
|
132
|
+
// A browser dismiss started the exit, and something showed the element
|
|
133
|
+
// again before the exit settled, while controlled intent stayed open. For
|
|
134
|
+
// example, `@atlaskit/tooltip` re-shows after a light dismiss in the same
|
|
135
|
+
// task. The element never painted closed, so go back to `open`.
|
|
136
|
+
if (action.type === 'native-open-started') {
|
|
137
|
+
if (state.phase !== 'exiting' || state.controlledIntent !== 'open') {
|
|
138
|
+
return state;
|
|
139
|
+
}
|
|
140
|
+
return _objectSpread(_objectSpread({}, state), {}, {
|
|
141
|
+
phase: 'open'
|
|
142
|
+
});
|
|
143
|
+
}
|
|
130
144
|
if (action.type === 'entry-settled') {
|
|
131
145
|
if (state.phase !== 'entering') {
|
|
132
146
|
return state;
|
|
@@ -244,9 +258,16 @@ export function useAnimatedVisibility(_ref4) {
|
|
|
244
258
|
cancelExitSettlementRef.current();
|
|
245
259
|
// Snapshot currentTarget because the DOM clears it after event dispatch.
|
|
246
260
|
var element = event.currentTarget;
|
|
247
|
-
if (event.newState === 'open'
|
|
248
|
-
element
|
|
249
|
-
|
|
261
|
+
if (event.newState === 'open') {
|
|
262
|
+
if (element instanceof HTMLElement) {
|
|
263
|
+
element.removeAttribute('inert');
|
|
264
|
+
element.removeAttribute('aria-hidden');
|
|
265
|
+
}
|
|
266
|
+
// Dispatched on every native open. The reducer only acts when a browser
|
|
267
|
+
// dismiss left the host `exiting` while `isOpen` stayed `true`.
|
|
268
|
+
dispatch({
|
|
269
|
+
type: 'native-open-started'
|
|
270
|
+
});
|
|
250
271
|
}
|
|
251
272
|
if (event.newState === 'closed') {
|
|
252
273
|
if (element instanceof HTMLElement) {
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
|
2
|
+
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
3
|
+
/**
|
|
4
|
+
* Flushes a `Popover` exit in jsdom so that `onExitFinish` has fired and the
|
|
5
|
+
* host element has unmounted before the caller asserts.
|
|
6
|
+
*
|
|
7
|
+
* Requires React 18.3 or newer (`act` is imported from `react`).
|
|
8
|
+
*
|
|
9
|
+
* Hiding is two steps: the testing polyfill fires the closed `toggle` as a task,
|
|
10
|
+
* then top-layer settles the exit in a native promise microtask. Jest fake
|
|
11
|
+
* timers drain the task but not that microtask, so a synchronous
|
|
12
|
+
* `act(() => jest.runOnlyPendingTimers())` returns too early. Real browsers are
|
|
13
|
+
* unaffected. See `notes/architecture/animations.md` ("settles in a microtask").
|
|
14
|
+
*
|
|
15
|
+
* Flush any delay before `hidePopover()` first (for example the `delay` prop on
|
|
16
|
+
* `@atlaskit/tooltip`). Only `Popover` is covered - `Dialog` chains a second
|
|
17
|
+
* timer for its `close` event, which this helper does not wait for.
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* rerender(<Popover isOpen={false} shouldAnimate onExitFinish={onExitFinish} />);
|
|
21
|
+
* await flushPopoverExit();
|
|
22
|
+
* expect(onExitFinish).toHaveBeenCalledTimes(1);
|
|
23
|
+
*/
|
|
24
|
+
|
|
25
|
+
// `react` is a peer dependency, so this entrypoint adds no testing-library dependency.
|
|
26
|
+
import { act } from 'react';
|
|
27
|
+
|
|
28
|
+
// Mirrors `jestFakeTimersAreEnabled` in `@testing-library/dom`.
|
|
29
|
+
function areJestFakeTimersEnabled() {
|
|
30
|
+
if (typeof jest === 'undefined') {
|
|
31
|
+
return false;
|
|
32
|
+
}
|
|
33
|
+
var timer = setTimeout;
|
|
34
|
+
// Legacy fake timers mark the function. Modern (sinon) fake timers attach a `clock`.
|
|
35
|
+
return timer._isMockFunction === true || Object.prototype.hasOwnProperty.call(setTimeout, 'clock');
|
|
36
|
+
}
|
|
37
|
+
function waitForOneRealTask() {
|
|
38
|
+
return new Promise(function (resolve) {
|
|
39
|
+
setTimeout(resolve, 0);
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
export function flushPopoverExit() {
|
|
43
|
+
return _flushPopoverExit.apply(this, arguments);
|
|
44
|
+
}
|
|
45
|
+
function _flushPopoverExit() {
|
|
46
|
+
_flushPopoverExit = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
47
|
+
return _regeneratorRuntime.wrap(function (_context2) {
|
|
48
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
49
|
+
case 0:
|
|
50
|
+
if (!(typeof act !== 'function')) {
|
|
51
|
+
_context2.next = 1;
|
|
52
|
+
break;
|
|
53
|
+
}
|
|
54
|
+
throw new Error('flushPopoverExit() requires React 18.3 or newer: `act` is not exported by this version of `react`');
|
|
55
|
+
case 1:
|
|
56
|
+
_context2.next = 2;
|
|
57
|
+
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
|
58
|
+
return _regeneratorRuntime.wrap(function (_context) {
|
|
59
|
+
while (1) switch (_context.prev = _context.next) {
|
|
60
|
+
case 0:
|
|
61
|
+
if (!areJestFakeTimersEnabled()) {
|
|
62
|
+
_context.next = 2;
|
|
63
|
+
break;
|
|
64
|
+
}
|
|
65
|
+
jest.runOnlyPendingTimers();
|
|
66
|
+
// Yield once so the settlement job runs before `act` commits.
|
|
67
|
+
_context.next = 1;
|
|
68
|
+
return Promise.resolve();
|
|
69
|
+
case 1:
|
|
70
|
+
return _context.abrupt("return");
|
|
71
|
+
case 2:
|
|
72
|
+
_context.next = 3;
|
|
73
|
+
return waitForOneRealTask();
|
|
74
|
+
case 3:
|
|
75
|
+
case "end":
|
|
76
|
+
return _context.stop();
|
|
77
|
+
}
|
|
78
|
+
}, _callee);
|
|
79
|
+
})));
|
|
80
|
+
case 2:
|
|
81
|
+
case "end":
|
|
82
|
+
return _context2.stop();
|
|
83
|
+
}
|
|
84
|
+
}, _callee2);
|
|
85
|
+
}));
|
|
86
|
+
return _flushPopoverExit.apply(this, arguments);
|
|
87
|
+
}
|
|
@@ -70,6 +70,7 @@ type TUseAnimatedVisibilityResult = {
|
|
|
70
70
|
* interrupts: entering → exiting (close mid-entry)
|
|
71
71
|
* exiting → entering (reopen mid-exit, animated)
|
|
72
72
|
* exiting → open (reopen mid-handshake, non-animated)
|
|
73
|
+
* exiting → open (native reopen while controlled intent is open)
|
|
73
74
|
* ```
|
|
74
75
|
*/
|
|
75
76
|
export type TPhase = 'closed' | 'entering' | 'open' | 'exiting';
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flushes a `Popover` exit in jsdom so that `onExitFinish` has fired and the
|
|
3
|
+
* host element has unmounted before the caller asserts.
|
|
4
|
+
*
|
|
5
|
+
* Requires React 18.3 or newer (`act` is imported from `react`).
|
|
6
|
+
*
|
|
7
|
+
* Hiding is two steps: the testing polyfill fires the closed `toggle` as a task,
|
|
8
|
+
* then top-layer settles the exit in a native promise microtask. Jest fake
|
|
9
|
+
* timers drain the task but not that microtask, so a synchronous
|
|
10
|
+
* `act(() => jest.runOnlyPendingTimers())` returns too early. Real browsers are
|
|
11
|
+
* unaffected. See `notes/architecture/animations.md` ("settles in a microtask").
|
|
12
|
+
*
|
|
13
|
+
* Flush any delay before `hidePopover()` first (for example the `delay` prop on
|
|
14
|
+
* `@atlaskit/tooltip`). Only `Popover` is covered - `Dialog` chains a second
|
|
15
|
+
* timer for its `close` event, which this helper does not wait for.
|
|
16
|
+
*
|
|
17
|
+
* @example
|
|
18
|
+
* rerender(<Popover isOpen={false} shouldAnimate onExitFinish={onExitFinish} />);
|
|
19
|
+
* await flushPopoverExit();
|
|
20
|
+
* expect(onExitFinish).toHaveBeenCalledTimes(1);
|
|
21
|
+
*/
|
|
22
|
+
export declare function flushPopoverExit(): Promise<void>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/top-layer",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "6.1.0",
|
|
4
4
|
"description": "Low-level layering primitives based on popover and dialog",
|
|
5
5
|
"homepage": "https://atlassian.design/components/top-layer",
|
|
6
6
|
"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
|
|
@@ -38,9 +38,9 @@
|
|
|
38
38
|
"@atlaskit/browser-apis": "^1.2.0",
|
|
39
39
|
"@atlaskit/css": "^1.1.0",
|
|
40
40
|
"@atlaskit/ds-lib": "^8.0.0",
|
|
41
|
-
"@atlaskit/layering": "^
|
|
41
|
+
"@atlaskit/layering": "^6.0.0",
|
|
42
42
|
"@atlaskit/react-compiler-gating": "^0.2.0",
|
|
43
|
-
"@atlaskit/tokens": "^
|
|
43
|
+
"@atlaskit/tokens": "^20.1.0",
|
|
44
44
|
"@babel/runtime": "^7.0.0",
|
|
45
45
|
"@compiled/react": "^1.0.2",
|
|
46
46
|
"bind-event-listener": "^3.0.0",
|
|
@@ -55,11 +55,11 @@
|
|
|
55
55
|
"@af/visual-regression": "workspace:^",
|
|
56
56
|
"@atlaskit/button": "^25.4.0",
|
|
57
57
|
"@atlaskit/checkbox": "^19.2.0",
|
|
58
|
-
"@atlaskit/heading": "^
|
|
59
|
-
"@atlaskit/lozenge": "^
|
|
60
|
-
"@atlaskit/pragmatic-drag-and-drop": "^
|
|
58
|
+
"@atlaskit/heading": "^8.0.0",
|
|
59
|
+
"@atlaskit/lozenge": "^17.0.0",
|
|
60
|
+
"@atlaskit/pragmatic-drag-and-drop": "^4.0.0",
|
|
61
61
|
"@atlaskit/primitives": "^22.5.0",
|
|
62
|
-
"@atlaskit/select": "^
|
|
62
|
+
"@atlaskit/select": "^23.1.0",
|
|
63
63
|
"@atlaskit/ssr": "workspace:^",
|
|
64
64
|
"@atlaskit/textfield": "^10.2.0",
|
|
65
65
|
"@atlaskit/toggle": "^17.3.0",
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@atlaskit/top-layer/testing/flush-popover-exit",
|
|
3
|
+
"main": "../../dist/cjs/testing/flush-popover-exit.js",
|
|
4
|
+
"module": "../../dist/esm/testing/flush-popover-exit.js",
|
|
5
|
+
"module:es2019": "../../dist/es2019/testing/flush-popover-exit.js",
|
|
6
|
+
"sideEffects": [
|
|
7
|
+
"*.compiled.css"
|
|
8
|
+
],
|
|
9
|
+
"types": "../../dist/types/testing/flush-popover-exit.d.ts"
|
|
10
|
+
}
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
Object.defineProperty(exports, "getFirstFocusable", {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: function get() {
|
|
9
|
-
return _getFirstFocusable.getFirstFocusable;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
Object.defineProperty(exports, "getLastFocusable", {
|
|
13
|
-
enumerable: true,
|
|
14
|
-
get: function get() {
|
|
15
|
-
return _getLastFocusable.getLastFocusable;
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
|
-
Object.defineProperty(exports, "getNextFocusable", {
|
|
19
|
-
enumerable: true,
|
|
20
|
-
get: function get() {
|
|
21
|
-
return _getNextFocusable.getNextFocusable;
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
var _getFirstFocusable = require("../focus/get-first-focusable");
|
|
25
|
-
var _getLastFocusable = require("../focus/get-last-focusable");
|
|
26
|
-
var _getNextFocusable = require("../focus/get-next-focusable");
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
Object.defineProperty(exports, "OpenLayerObserver", {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: function get() {
|
|
9
|
-
return _openLayerObserver.OpenLayerObserver;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
Object.defineProperty(exports, "OpenLayerObserverNamespaceProvider", {
|
|
13
|
-
enumerable: true,
|
|
14
|
-
get: function get() {
|
|
15
|
-
return _openLayerObserverNamespaceProvider.OpenLayerObserverNamespaceProvider;
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
|
-
Object.defineProperty(exports, "useNotifyOpenLayerObserver", {
|
|
19
|
-
enumerable: true,
|
|
20
|
-
get: function get() {
|
|
21
|
-
return _useNotifyOpenLayerObserver.useNotifyOpenLayerObserver;
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
Object.defineProperty(exports, "useOpenLayerObserver", {
|
|
25
|
-
enumerable: true,
|
|
26
|
-
get: function get() {
|
|
27
|
-
return _useOpenLayerObserver.useOpenLayerObserver;
|
|
28
|
-
}
|
|
29
|
-
});
|
|
30
|
-
var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer/open-layer-observer");
|
|
31
|
-
var _useNotifyOpenLayerObserver = require("@atlaskit/layering/experimental/use-notify-open-layer-observer");
|
|
32
|
-
var _useOpenLayerObserver = require("@atlaskit/layering/experimental/use-open-layer-observer");
|
|
33
|
-
var _openLayerObserverNamespaceProvider = require("@atlaskit/layering/experimental/open-layer-observer-namespace-provider");
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required -- VOLTC-139 tracks removal of these deprecated re-export shims. */
|
|
2
|
-
/**
|
|
3
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
8
|
-
*/
|
|
9
|
-
export { getFirstFocusable } from '../focus/get-first-focusable';
|
|
10
|
-
/**
|
|
11
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
12
|
-
*/
|
|
13
|
-
export { getLastFocusable } from '../focus/get-last-focusable';
|
|
14
|
-
/**
|
|
15
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
16
|
-
*/
|
|
17
|
-
export { getNextFocusable } from '../focus/get-next-focusable';
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required -- VOLTC-139 tracks removal of these deprecated re-export shims. */
|
|
2
|
-
/**
|
|
3
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
export { OpenLayerObserver } from '@atlaskit/layering/experimental/open-layer-observer/open-layer-observer';
|
|
7
|
-
/**
|
|
8
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
9
|
-
*/
|
|
10
|
-
export { useNotifyOpenLayerObserver } from '@atlaskit/layering/experimental/use-notify-open-layer-observer';
|
|
11
|
-
/**
|
|
12
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
13
|
-
*/
|
|
14
|
-
export { useOpenLayerObserver } from '@atlaskit/layering/experimental/use-open-layer-observer';
|
|
15
|
-
/**
|
|
16
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
17
|
-
*/
|
|
18
|
-
export { OpenLayerObserverNamespaceProvider } from '@atlaskit/layering/experimental/open-layer-observer-namespace-provider';
|
|
19
|
-
/**
|
|
20
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
21
|
-
*/
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required -- VOLTC-139 tracks removal of these deprecated re-export shims. */
|
|
2
|
-
/**
|
|
3
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
8
|
-
*/
|
|
9
|
-
export { getFirstFocusable } from '../focus/get-first-focusable';
|
|
10
|
-
/**
|
|
11
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
12
|
-
*/
|
|
13
|
-
export { getLastFocusable } from '../focus/get-last-focusable';
|
|
14
|
-
/**
|
|
15
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
16
|
-
*/
|
|
17
|
-
export { getNextFocusable } from '../focus/get-next-focusable';
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required -- VOLTC-139 tracks removal of these deprecated re-export shims. */
|
|
2
|
-
/**
|
|
3
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
export { OpenLayerObserver } from '@atlaskit/layering/experimental/open-layer-observer/open-layer-observer';
|
|
7
|
-
/**
|
|
8
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
9
|
-
*/
|
|
10
|
-
export { useNotifyOpenLayerObserver } from '@atlaskit/layering/experimental/use-notify-open-layer-observer';
|
|
11
|
-
/**
|
|
12
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
13
|
-
*/
|
|
14
|
-
export { useOpenLayerObserver } from '@atlaskit/layering/experimental/use-open-layer-observer';
|
|
15
|
-
/**
|
|
16
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
17
|
-
*/
|
|
18
|
-
export { OpenLayerObserverNamespaceProvider } from '@atlaskit/layering/experimental/open-layer-observer-namespace-provider';
|
|
19
|
-
/**
|
|
20
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
21
|
-
*/
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
3
|
-
*/
|
|
4
|
-
export type { TFocusableFilter } from '../focus/types';
|
|
5
|
-
/**
|
|
6
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
7
|
-
*/
|
|
8
|
-
export { getFirstFocusable } from '../focus/get-first-focusable';
|
|
9
|
-
/**
|
|
10
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
11
|
-
*/
|
|
12
|
-
export { getLastFocusable } from '../focus/get-last-focusable';
|
|
13
|
-
/**
|
|
14
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
15
|
-
*/
|
|
16
|
-
export { getNextFocusable } from '../focus/get-next-focusable';
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
3
|
-
*/
|
|
4
|
-
export { OpenLayerObserver } from '@atlaskit/layering/experimental/open-layer-observer/open-layer-observer';
|
|
5
|
-
/**
|
|
6
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
7
|
-
*/
|
|
8
|
-
export { useNotifyOpenLayerObserver } from '@atlaskit/layering/experimental/use-notify-open-layer-observer';
|
|
9
|
-
/**
|
|
10
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
11
|
-
*/
|
|
12
|
-
export { useOpenLayerObserver } from '@atlaskit/layering/experimental/use-open-layer-observer';
|
|
13
|
-
/**
|
|
14
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
15
|
-
*/
|
|
16
|
-
export { OpenLayerObserverNamespaceProvider } from '@atlaskit/layering/experimental/open-layer-observer-namespace-provider';
|
|
17
|
-
/**
|
|
18
|
-
* @deprecated Import from the generated per-export subpath instead.
|
|
19
|
-
*/
|
|
20
|
-
export type { LayerType } from '@atlaskit/layering/experimental/types';
|
package/focus/package.json
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@atlaskit/top-layer/focus",
|
|
3
|
-
"main": "../dist/cjs/entry-points/focus.js",
|
|
4
|
-
"module": "../dist/esm/entry-points/focus.js",
|
|
5
|
-
"module:es2019": "../dist/es2019/entry-points/focus.js",
|
|
6
|
-
"sideEffects": [
|
|
7
|
-
"*.compiled.css"
|
|
8
|
-
],
|
|
9
|
-
"types": "../dist/types/entry-points/focus.d.ts"
|
|
10
|
-
}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@atlaskit/top-layer/open-layer-observer",
|
|
3
|
-
"main": "../dist/cjs/entry-points/open-layer-observer.js",
|
|
4
|
-
"module": "../dist/esm/entry-points/open-layer-observer.js",
|
|
5
|
-
"module:es2019": "../dist/es2019/entry-points/open-layer-observer.js",
|
|
6
|
-
"sideEffects": [
|
|
7
|
-
"*.compiled.css"
|
|
8
|
-
],
|
|
9
|
-
"types": "../dist/types/entry-points/open-layer-observer.d.ts"
|
|
10
|
-
}
|