@atlaskit/popup 4.23.2 → 4.23.4

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 CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/popup
2
2
 
3
+ ## 4.23.4
4
+
5
+ ### Patch Changes
6
+
7
+ - [`6d0485dce81c4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6d0485dce81c4) -
8
+ Internal: updated to the new `@atlaskit/top-layer` `Popover`/`Dialog` behaviour where the host
9
+ element unmounts after the exit animation completes. No consumer action required.
10
+ - Updated dependencies
11
+
12
+ ## 4.23.3
13
+
14
+ ### Patch Changes
15
+
16
+ - [`e5b4070f51a93`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e5b4070f51a93) -
17
+ Remove Top Layer compatibility aliases and expose close-event helpers from the `dialog` and
18
+ `popover` entry points.
19
+ - Updated dependencies
20
+
3
21
  ## 4.23.2
4
22
 
5
23
  ### Patch Changes
@@ -15,7 +15,6 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
15
15
  var _runtime = require("@compiled/react/runtime");
16
16
  var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
17
17
  var _animations = require("@atlaskit/top-layer/animations");
18
- var _createCloseEvent = require("@atlaskit/top-layer/create-close-event");
19
18
  var _placementMap = require("@atlaskit/top-layer/placement-map");
20
19
  var _popover = require("@atlaskit/top-layer/popover");
21
20
  var _popoverSurface = require("@atlaskit/top-layer/popover-surface");
@@ -87,7 +86,7 @@ function PopupContentTopLayer(_ref) {
87
86
  if (!onClose) {
88
87
  return;
89
88
  }
90
- onClose((0, _createCloseEvent.createPopoverCloseEvent)({
89
+ onClose((0, _popover.createPopoverCloseEvent)({
91
90
  reason: reason
92
91
  }));
93
92
  }, [onClose]);
@@ -110,15 +109,20 @@ function PopupContentTopLayer(_ref) {
110
109
  });
111
110
  var popoverRef = (0, _react.useRef)(null);
112
111
  var anchorRef = (0, _react.useContext)(_triggerRefObjectContext.TriggerRefObjectContext);
112
+
113
+ // `isOpen` is included so the anchor positioning effect re-runs when
114
+ // the Popover host element is unmounted/remounted across open cycles.
113
115
  (0, _useAnchorPosition.useAnchorPosition)({
114
116
  anchorRef: anchorRef,
115
117
  popoverRef: popoverRef,
116
- placement: topLayerPlacement
118
+ placement: topLayerPlacement,
119
+ isOpen: isOpen
117
120
  });
118
121
  (0, _useWidthFromAnchor.useWidthFromAnchor)({
119
122
  mode: shouldFitContainer ? 'match-anchor' : 'none',
120
123
  popoverRef: popoverRef,
121
- anchorRef: anchorRef
124
+ anchorRef: anchorRef,
125
+ isOpen: isOpen
122
126
  });
123
127
 
124
128
  // Narrow to ForwardRefExoticComponent so JSX accepts the ref prop.
@@ -15,7 +15,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
15
15
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
16
16
  var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
17
17
  var _animations = require("@atlaskit/top-layer/animations");
18
- var _createCloseEvent = require("@atlaskit/top-layer/create-close-event");
19
18
  var _getAriaForTrigger = require("@atlaskit/top-layer/get-aria-for-trigger");
20
19
  var _placementMap = require("@atlaskit/top-layer/placement-map");
21
20
  var _popover = require("@atlaskit/top-layer/popover");
@@ -98,12 +97,14 @@ var PopupTopLayer = exports.PopupTopLayer = /*#__PURE__*/(0, _react.memo)(functi
98
97
  (0, _useAnchorPosition.useAnchorPosition)({
99
98
  anchorRef: triggerRef,
100
99
  popoverRef: popoverRef,
101
- placement: topLayerPlacement
100
+ placement: topLayerPlacement,
101
+ isOpen: isOpen
102
102
  });
103
103
  (0, _useWidthFromAnchor.useWidthFromAnchor)({
104
104
  mode: shouldFitContainer ? 'match-anchor' : 'none',
105
105
  popoverRef: popoverRef,
106
- anchorRef: triggerRef
106
+ anchorRef: triggerRef,
107
+ isOpen: isOpen
107
108
  });
108
109
 
109
110
  // onClose bridge.
@@ -119,7 +120,7 @@ var PopupTopLayer = exports.PopupTopLayer = /*#__PURE__*/(0, _react.memo)(functi
119
120
  if (!onClose) {
120
121
  return;
121
122
  }
122
- onClose((0, _createCloseEvent.createPopoverCloseEvent)({
123
+ onClose((0, _popover.createPopoverCloseEvent)({
123
124
  reason: reason
124
125
  }));
125
126
  }, [onClose]);
@@ -6,9 +6,8 @@ import { useCallback, useContext, useMemo, useRef, useState } from 'react';
6
6
  import { ax, ix } from '@compiled/react/runtime';
7
7
  import noop from '@atlaskit/ds-lib/noop';
8
8
  import { slideAndFade } from '@atlaskit/top-layer/animations';
9
- import { createPopoverCloseEvent } from '@atlaskit/top-layer/create-close-event';
10
9
  import { fromLegacyPlacement } from '@atlaskit/top-layer/placement-map';
11
- import { Popover } from '@atlaskit/top-layer/popover';
10
+ import { createPopoverCloseEvent, Popover } from '@atlaskit/top-layer/popover';
12
11
  import { PopoverSurface } from '@atlaskit/top-layer/popover-surface';
13
12
  import { useAnchorPosition } from '@atlaskit/top-layer/use-anchor-position';
14
13
  import { useWidthFromAnchor } from '@atlaskit/top-layer/use-width-from-anchor';
@@ -115,15 +114,20 @@ export function PopupContentTopLayer({
115
114
  });
116
115
  const popoverRef = useRef(null);
117
116
  const anchorRef = useContext(TriggerRefObjectContext);
117
+
118
+ // `isOpen` is included so the anchor positioning effect re-runs when
119
+ // the Popover host element is unmounted/remounted across open cycles.
118
120
  useAnchorPosition({
119
121
  anchorRef,
120
122
  popoverRef,
121
- placement: topLayerPlacement
123
+ placement: topLayerPlacement,
124
+ isOpen
122
125
  });
123
126
  useWidthFromAnchor({
124
127
  mode: shouldFitContainer ? 'match-anchor' : 'none',
125
128
  popoverRef,
126
- anchorRef
129
+ anchorRef,
130
+ isOpen
127
131
  });
128
132
 
129
133
  // Narrow to ForwardRefExoticComponent so JSX accepts the ref prop.
@@ -6,10 +6,9 @@ import { ax, ix } from "@compiled/react/runtime";
6
6
  import { Fragment, memo, useCallback, useMemo, useRef, useState } from 'react';
7
7
  import noop from '@atlaskit/ds-lib/noop';
8
8
  import { slideAndFade } from '@atlaskit/top-layer/animations';
9
- import { createPopoverCloseEvent } from '@atlaskit/top-layer/create-close-event';
10
9
  import { getAriaForTrigger } from '@atlaskit/top-layer/get-aria-for-trigger';
11
10
  import { fromLegacyPlacement } from '@atlaskit/top-layer/placement-map';
12
- import { Popover } from '@atlaskit/top-layer/popover';
11
+ import { createPopoverCloseEvent, Popover } from '@atlaskit/top-layer/popover';
13
12
  import { PopoverSurface } from '@atlaskit/top-layer/popover-surface';
14
13
  import { useAnchorPosition } from '@atlaskit/top-layer/use-anchor-position';
15
14
  import { usePopoverId } from '@atlaskit/top-layer/use-popover-id';
@@ -106,12 +105,14 @@ export const PopupTopLayer = /*#__PURE__*/memo(function PopupTopLayer({
106
105
  useAnchorPosition({
107
106
  anchorRef: triggerRef,
108
107
  popoverRef,
109
- placement: topLayerPlacement
108
+ placement: topLayerPlacement,
109
+ isOpen
110
110
  });
111
111
  useWidthFromAnchor({
112
112
  mode: shouldFitContainer ? 'match-anchor' : 'none',
113
113
  popoverRef,
114
- anchorRef: triggerRef
114
+ anchorRef: triggerRef,
115
+ isOpen
115
116
  });
116
117
 
117
118
  // onClose bridge.
@@ -7,9 +7,8 @@ import { useCallback, useContext, useMemo, useRef, useState } from 'react';
7
7
  import { ax, ix } from '@compiled/react/runtime';
8
8
  import noop from '@atlaskit/ds-lib/noop';
9
9
  import { slideAndFade } from '@atlaskit/top-layer/animations';
10
- import { createPopoverCloseEvent } from '@atlaskit/top-layer/create-close-event';
11
10
  import { fromLegacyPlacement } from '@atlaskit/top-layer/placement-map';
12
- import { Popover } from '@atlaskit/top-layer/popover';
11
+ import { createPopoverCloseEvent, Popover } from '@atlaskit/top-layer/popover';
13
12
  import { PopoverSurface } from '@atlaskit/top-layer/popover-surface';
14
13
  import { useAnchorPosition } from '@atlaskit/top-layer/use-anchor-position';
15
14
  import { useWidthFromAnchor } from '@atlaskit/top-layer/use-width-from-anchor';
@@ -101,15 +100,20 @@ export function PopupContentTopLayer(_ref) {
101
100
  });
102
101
  var popoverRef = useRef(null);
103
102
  var anchorRef = useContext(TriggerRefObjectContext);
103
+
104
+ // `isOpen` is included so the anchor positioning effect re-runs when
105
+ // the Popover host element is unmounted/remounted across open cycles.
104
106
  useAnchorPosition({
105
107
  anchorRef: anchorRef,
106
108
  popoverRef: popoverRef,
107
- placement: topLayerPlacement
109
+ placement: topLayerPlacement,
110
+ isOpen: isOpen
108
111
  });
109
112
  useWidthFromAnchor({
110
113
  mode: shouldFitContainer ? 'match-anchor' : 'none',
111
114
  popoverRef: popoverRef,
112
- anchorRef: anchorRef
115
+ anchorRef: anchorRef,
116
+ isOpen: isOpen
113
117
  });
114
118
 
115
119
  // Narrow to ForwardRefExoticComponent so JSX accepts the ref prop.
@@ -7,10 +7,9 @@ import { ax, ix } from "@compiled/react/runtime";
7
7
  import { Fragment, memo, useCallback, useMemo, useRef, useState } from 'react';
8
8
  import noop from '@atlaskit/ds-lib/noop';
9
9
  import { slideAndFade } from '@atlaskit/top-layer/animations';
10
- import { createPopoverCloseEvent } from '@atlaskit/top-layer/create-close-event';
11
10
  import { getAriaForTrigger } from '@atlaskit/top-layer/get-aria-for-trigger';
12
11
  import { fromLegacyPlacement } from '@atlaskit/top-layer/placement-map';
13
- import { Popover } from '@atlaskit/top-layer/popover';
12
+ import { createPopoverCloseEvent, Popover } from '@atlaskit/top-layer/popover';
14
13
  import { PopoverSurface } from '@atlaskit/top-layer/popover-surface';
15
14
  import { useAnchorPosition } from '@atlaskit/top-layer/use-anchor-position';
16
15
  import { usePopoverId } from '@atlaskit/top-layer/use-popover-id';
@@ -89,12 +88,14 @@ export var PopupTopLayer = /*#__PURE__*/memo(function PopupTopLayer(_ref) {
89
88
  useAnchorPosition({
90
89
  anchorRef: triggerRef,
91
90
  popoverRef: popoverRef,
92
- placement: topLayerPlacement
91
+ placement: topLayerPlacement,
92
+ isOpen: isOpen
93
93
  });
94
94
  useWidthFromAnchor({
95
95
  mode: shouldFitContainer ? 'match-anchor' : 'none',
96
96
  popoverRef: popoverRef,
97
- anchorRef: triggerRef
97
+ anchorRef: triggerRef,
98
+ isOpen: isOpen
98
99
  });
99
100
 
100
101
  // onClose bridge.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/popup",
3
- "version": "4.23.2",
3
+ "version": "4.23.4",
4
4
  "description": "A popup displays brief content in an overlay.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -48,7 +48,7 @@
48
48
  "@atlaskit/portal": "^5.5.0",
49
49
  "@atlaskit/primitives": "^19.0.0",
50
50
  "@atlaskit/tokens": "^13.3.0",
51
- "@atlaskit/top-layer": "^0.14.0",
51
+ "@atlaskit/top-layer": "^0.16.0",
52
52
  "@babel/runtime": "^7.0.0",
53
53
  "@compiled/react": "^0.20.0",
54
54
  "bind-event-listener": "^3.0.0",