@atlaskit/portal 4.3.5 → 4.4.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.
Files changed (30) hide show
  1. package/CHANGELOG.md +43 -30
  2. package/dist/cjs/constants.js +2 -4
  3. package/dist/cjs/internal/constants.js +3 -6
  4. package/dist/cjs/internal/hooks/use-is-subsequent-render.js +9 -4
  5. package/dist/cjs/internal/hooks/use-isomorphic-layout-effect.js +11 -0
  6. package/dist/cjs/internal/hooks/use-portal-event.js +1 -2
  7. package/dist/cjs/internal/utils/portal-custom-event.js +1 -1
  8. package/dist/cjs/internal/utils/portal-dom-utils.js +4 -7
  9. package/dist/cjs/portal.js +7 -5
  10. package/dist/es2019/internal/hooks/use-is-subsequent-render.js +4 -2
  11. package/dist/es2019/internal/hooks/use-isomorphic-layout-effect.js +6 -0
  12. package/dist/es2019/internal/utils/portal-custom-event.js +1 -1
  13. package/dist/es2019/portal.js +6 -6
  14. package/dist/esm/internal/hooks/use-is-subsequent-render.js +8 -2
  15. package/dist/esm/internal/hooks/use-isomorphic-layout-effect.js +6 -0
  16. package/dist/esm/internal/utils/portal-custom-event.js +1 -1
  17. package/dist/esm/portal.js +7 -5
  18. package/dist/types/internal/hooks/use-is-subsequent-render.d.ts +2 -1
  19. package/dist/types/internal/hooks/use-isomorphic-layout-effect.d.ts +5 -0
  20. package/dist/types/internal/types.d.ts +1 -0
  21. package/dist/types/portal.d.ts +1 -1
  22. package/dist/types/types.d.ts +6 -1
  23. package/dist/types-ts4.5/internal/hooks/use-is-subsequent-render.d.ts +2 -1
  24. package/dist/types-ts4.5/internal/hooks/use-isomorphic-layout-effect.d.ts +5 -0
  25. package/dist/types-ts4.5/internal/types.d.ts +1 -0
  26. package/dist/types-ts4.5/portal.d.ts +1 -1
  27. package/dist/types-ts4.5/types.d.ts +6 -1
  28. package/package.json +4 -3
  29. package/report.api.md +9 -1
  30. package/tmp/api-report-tmp.d.ts +5 -1
package/CHANGELOG.md CHANGED
@@ -1,40 +1,53 @@
1
1
  # @atlaskit/portal
2
2
 
3
+ ## 4.4.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#41817](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41817) [`76888385b72`](https://bitbucket.org/atlassian/atlassian-frontend/commits/76888385b72) - Add MountStrategy prop to specify mount strategy
8
+
9
+ ## 4.3.6
10
+
11
+ ### Patch Changes
12
+
13
+ - [#39442](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/39442) [`f78ae454863`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f78ae454863) - Update tooltip z-index to 9999
14
+ - Updated dependencies
15
+
3
16
  ## 4.3.5
4
17
 
5
18
  ### Patch Changes
6
19
 
7
- - [`9af31f3c1ae`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9af31f3c1ae) - Delete version.json
20
+ - [#38731](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/38731) [`9af31f3c1ae`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9af31f3c1ae) - Delete version.json
8
21
 
9
22
  ## 4.3.4
10
23
 
11
24
  ### Patch Changes
12
25
 
13
- - [`33f10b7eb36`](https://bitbucket.org/atlassian/atlassian-frontend/commits/33f10b7eb36) - Removing unused dependencies and dev dependencies
26
+ - [#34445](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/34445) [`33f10b7eb36`](https://bitbucket.org/atlassian/atlassian-frontend/commits/33f10b7eb36) - Removing unused dependencies and dev dependencies
14
27
 
15
28
  ## 4.3.3
16
29
 
17
30
  ### Patch Changes
18
31
 
19
- - [`77766ad157d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/77766ad157d) - Enrol packages to push-model consumption in Jira.
32
+ - [#34124](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/34124) [`77766ad157d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/77766ad157d) - Enrol packages to push-model consumption in Jira.
20
33
 
21
34
  ## 4.3.2
22
35
 
23
36
  ### Patch Changes
24
37
 
25
- - [`9d00501a414`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9d00501a414) - Ensure legacy types are published for TS 4.5-4.8
38
+ - [#33793](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33793) [`9d00501a414`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9d00501a414) - Ensure legacy types are published for TS 4.5-4.8
26
39
 
27
40
  ## 4.3.1
28
41
 
29
42
  ### Patch Changes
30
43
 
31
- - [`41fae2c6f68`](https://bitbucket.org/atlassian/atlassian-frontend/commits/41fae2c6f68) - Upgrade Typescript from `4.5.5` to `4.9.5`
44
+ - [#33649](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33649) [`41fae2c6f68`](https://bitbucket.org/atlassian/atlassian-frontend/commits/41fae2c6f68) - Upgrade Typescript from `4.5.5` to `4.9.5`
32
45
 
33
46
  ## 4.3.0
34
47
 
35
48
  ### Minor Changes
36
49
 
37
- - [`56507598609`](https://bitbucket.org/atlassian/atlassian-frontend/commits/56507598609) - Skip minor dependency bump
50
+ - [#33258](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33258) [`56507598609`](https://bitbucket.org/atlassian/atlassian-frontend/commits/56507598609) - Skip minor dependency bump
38
51
 
39
52
  ### Patch Changes
40
53
 
@@ -44,106 +57,106 @@
44
57
 
45
58
  ### Patch Changes
46
59
 
47
- - [`4ba10567310`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4ba10567310) - Internal changes.
60
+ - [#32211](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/32211) [`4ba10567310`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4ba10567310) - Internal changes.
48
61
 
49
62
  ## 4.2.12
50
63
 
51
64
  ### Patch Changes
52
65
 
53
- - [`9827dcb82b8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9827dcb82b8) - No-op change to introduce spacing tokens to design system components.
66
+ - [#26303](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/26303) [`9827dcb82b8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9827dcb82b8) - No-op change to introduce spacing tokens to design system components.
54
67
 
55
68
  ## 4.2.11
56
69
 
57
70
  ### Patch Changes
58
71
 
59
- - [`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) - Upgrade Typescript from `4.3.5` to `4.5.5`
72
+ - [#24874](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24874) [`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) - Upgrade Typescript from `4.3.5` to `4.5.5`
60
73
 
61
74
  ## 4.2.10
62
75
 
63
76
  ### Patch Changes
64
77
 
65
- - [`8d4228767b0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8d4228767b0) - Upgrade Typescript from `4.2.4` to `4.3.5`.
78
+ - [#24492](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24492) [`8d4228767b0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8d4228767b0) - Upgrade Typescript from `4.2.4` to `4.3.5`.
66
79
 
67
80
  ## 4.2.9
68
81
 
69
82
  ### Patch Changes
70
83
 
71
- - [`d5f0b466415`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d5f0b466415) - Internal code change turning on new linting rules.
84
+ - [#23381](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/23381) [`d5f0b466415`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d5f0b466415) - Internal code change turning on new linting rules.
72
85
 
73
86
  ## 4.2.8
74
87
 
75
88
  ### Patch Changes
76
89
 
77
- - [`8a5bdb3c844`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8a5bdb3c844) - Upgrading internal dependency (bind-event-listener) for improved internal types
90
+ - [#22614](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/22614) [`8a5bdb3c844`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8a5bdb3c844) - Upgrading internal dependency (bind-event-listener) for improved internal types
78
91
 
79
92
  ## 4.2.7
80
93
 
81
94
  ### Patch Changes
82
95
 
83
- - [`cb2392f6d33`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb2392f6d33) - Upgrade to TypeScript 4.2.4
96
+ - [#20650](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/20650) [`cb2392f6d33`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb2392f6d33) - Upgrade to TypeScript 4.2.4
84
97
 
85
98
  ## 4.2.6
86
99
 
87
100
  ### Patch Changes
88
101
 
89
- - [`b3e5a62a9e3`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b3e5a62a9e3) - Adds `static` techstack to package, enforcing stricter style linting. In this case the package already satisfied this requirement so there have been no changes to styles.
102
+ - [#20033](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/20033) [`b3e5a62a9e3`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b3e5a62a9e3) - Adds `static` techstack to package, enforcing stricter style linting. In this case the package already satisfied this requirement so there have been no changes to styles.
90
103
 
91
104
  ## 4.2.5
92
105
 
93
106
  ### Patch Changes
94
107
 
95
- - [`cf853e39278`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cf853e39278) - Retains the portal wrapper in the DOM after the last portal is unmounted. This drastically reduces the style recalculations and improves performance for portalled elements.
108
+ - [#14319](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/14319) [`cf853e39278`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cf853e39278) - Retains the portal wrapper in the DOM after the last portal is unmounted. This drastically reduces the style recalculations and improves performance for portalled elements.
96
109
  - Updated dependencies
97
110
 
98
111
  ## 4.2.4
99
112
 
100
113
  ### Patch Changes
101
114
 
102
- - [`cd34d8ca8ea`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cd34d8ca8ea) - Internal wiring up to the tokens techstack, no code changes.
115
+ - [#13302](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/13302) [`cd34d8ca8ea`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cd34d8ca8ea) - Internal wiring up to the tokens techstack, no code changes.
103
116
 
104
117
  ## 4.2.3
105
118
 
106
119
  ### Patch Changes
107
120
 
108
- - [`ea086afdc2d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ea086afdc2d) - Fix bug where Portal was attached to the body after the children were rendered. Now Portal is attached before it's children are rendered.
121
+ - [#12837](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/12837) [`ea086afdc2d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ea086afdc2d) - Fix bug where Portal was attached to the body after the children were rendered. Now Portal is attached before it's children are rendered.
109
122
  - Updated dependencies
110
123
 
111
124
  ## 4.2.2
112
125
 
113
126
  ### Patch Changes
114
127
 
115
- - [`378d1cef00f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/378d1cef00f) - Bump `@atlaskit/theme` to version `^11.3.0`.
128
+ - [#12880](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/12880) [`378d1cef00f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/378d1cef00f) - Bump `@atlaskit/theme` to version `^11.3.0`.
116
129
 
117
130
  ## 4.2.1
118
131
 
119
132
  ### Patch Changes
120
133
 
121
- - [`d6f7ff383cf`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d6f7ff383cf) - Updates to development dependency `storybook-addon-performance`
134
+ - [#12167](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/12167) [`d6f7ff383cf`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d6f7ff383cf) - Updates to development dependency `storybook-addon-performance`
122
135
 
123
136
  ## 4.2.0
124
137
 
125
138
  ### Minor Changes
126
139
 
127
- - [`f6b951a51f2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f6b951a51f2) - Removes usage of styled-components in favour of standardising on emotion
140
+ - [#12170](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/12170) [`f6b951a51f2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f6b951a51f2) - Removes usage of styled-components in favour of standardising on emotion
128
141
 
129
142
  ## 4.1.2
130
143
 
131
144
  ### Patch Changes
132
145
 
133
- - [`28f40bac160`](https://bitbucket.org/atlassian/atlassian-frontend/commits/28f40bac160) - Updates targets for modal dialog in VR tests.
146
+ - [#10569](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/10569) [`28f40bac160`](https://bitbucket.org/atlassian/atlassian-frontend/commits/28f40bac160) - Updates targets for modal dialog in VR tests.
134
147
 
135
148
  ## 4.1.1
136
149
 
137
150
  ### Patch Changes
138
151
 
139
- - [`8b360a4ac06`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8b360a4ac06) - NO-ISSUE Update modal dialog selector for VR & integration tests
152
+ - [#10230](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/10230) [`8b360a4ac06`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8b360a4ac06) - NO-ISSUE Update modal dialog selector for VR & integration tests
140
153
  - Updated dependencies
141
154
 
142
155
  ## 4.1.0
143
156
 
144
157
  ### Minor Changes
145
158
 
146
- - [`d4f0c36ac36`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d4f0c36ac36) - Converted class based portal component to functional component and dropped unused ie11 specific code
159
+ - [#9083](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/9083) [`d4f0c36ac36`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d4f0c36ac36) - Converted class based portal component to functional component and dropped unused ie11 specific code
147
160
 
148
161
  ### Patch Changes
149
162
 
@@ -154,13 +167,13 @@
154
167
 
155
168
  ### Patch Changes
156
169
 
157
- - [`d3265f19be`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d3265f19be) - Transpile packages using babel rather than tsc
170
+ - [#5857](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/5857) [`d3265f19be`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d3265f19be) - Transpile packages using babel rather than tsc
158
171
 
159
172
  ## 4.0.4
160
173
 
161
174
  ### Patch Changes
162
175
 
163
- - [`5f58283e1f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5f58283e1f) - Export types using Typescript's new "export type" syntax to satisfy Typescript's --isolatedModules compiler option.
176
+ - [#5497](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/5497) [`5f58283e1f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5f58283e1f) - Export types using Typescript's new "export type" syntax to satisfy Typescript's --isolatedModules compiler option.
164
177
  This requires version 3.8 of Typescript, read more about how we handle Typescript versions here: https://atlaskit.atlassian.com/get-started
165
178
  Also add `typescript` to `devDependencies` to denote version that the package was built with.
166
179
 
@@ -174,7 +187,7 @@
174
187
 
175
188
  ### Patch Changes
176
189
 
177
- - [`6c525a8229`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6c525a8229) - Upgraded to TypeScript 3.9.6 and tslib to 2.0.0
190
+ - [#3885](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/3885) [`6c525a8229`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6c525a8229) - Upgraded to TypeScript 3.9.6 and tslib to 2.0.0
178
191
 
179
192
  Since tslib is a dependency for all our packages we recommend that products also follow this tslib upgrade
180
193
  to prevent duplicates of tslib being bundled.
@@ -183,14 +196,14 @@
183
196
 
184
197
  ### Patch Changes
185
198
 
186
- - [`3414523d6f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3414523d6f) - Rearange buttons order to align with design guidelines
199
+ - [#3428](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/3428) [`3414523d6f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3414523d6f) - Rearange buttons order to align with design guidelines
187
200
  - [`db053b24d8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/db053b24d8) - Update all the theme imports to be tree-shakable
188
201
 
189
202
  ## 4.0.0
190
203
 
191
204
  ### Major Changes
192
205
 
193
- - [`87f4720f27`](https://bitbucket.org/atlassian/atlassian-frontend/commits/87f4720f27) - Officially dropping IE11 support, from this version onwards there are no warranties of the package working in IE11.
206
+ - [#3335](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/3335) [`87f4720f27`](https://bitbucket.org/atlassian/atlassian-frontend/commits/87f4720f27) - Officially dropping IE11 support, from this version onwards there are no warranties of the package working in IE11.
194
207
  For more information see: https://community.developer.atlassian.com/t/atlaskit-to-drop-support-for-internet-explorer-11-from-1st-july-2020/39534
195
208
 
196
209
  ### Patch Changes
@@ -201,13 +214,13 @@
201
214
 
202
215
  ### Patch Changes
203
216
 
204
- - [`54a9514fcf`](https://bitbucket.org/atlassian/atlassian-frontend/commits/54a9514fcf) - Build and supporting files will no longer be published to npm
217
+ - [#2866](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/2866) [`54a9514fcf`](https://bitbucket.org/atlassian/atlassian-frontend/commits/54a9514fcf) - Build and supporting files will no longer be published to npm
205
218
 
206
219
  ## 3.1.8
207
220
 
208
221
  ### Patch Changes
209
222
 
210
- - [`4069606178`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4069606178) - Change imports to comply with Atlassian conventions- Updated dependencies
223
+ - [#1868](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/1868) [`4069606178`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4069606178) - Change imports to comply with Atlassian conventions- Updated dependencies
211
224
 
212
225
  ## 3.1.7
213
226
 
@@ -4,7 +4,5 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.PORTAL_UNMOUNT_EVENT = exports.PORTAL_MOUNT_EVENT = void 0;
7
- var PORTAL_MOUNT_EVENT = 'akPortalMount';
8
- exports.PORTAL_MOUNT_EVENT = PORTAL_MOUNT_EVENT;
9
- var PORTAL_UNMOUNT_EVENT = 'akPortalUnmount';
10
- exports.PORTAL_UNMOUNT_EVENT = PORTAL_UNMOUNT_EVENT;
7
+ var PORTAL_MOUNT_EVENT = exports.PORTAL_MOUNT_EVENT = 'akPortalMount';
8
+ var PORTAL_UNMOUNT_EVENT = exports.PORTAL_UNMOUNT_EVENT = 'akPortalUnmount';
@@ -4,9 +4,6 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.portalParentSelector = exports.portalParentClassName = exports.portalClassName = void 0;
7
- var portalParentClassName = 'atlaskit-portal-container';
8
- exports.portalParentClassName = portalParentClassName;
9
- var portalParentSelector = 'body > .atlaskit-portal-container';
10
- exports.portalParentSelector = portalParentSelector;
11
- var portalClassName = 'atlaskit-portal';
12
- exports.portalClassName = portalClassName;
7
+ var portalParentClassName = exports.portalParentClassName = 'atlaskit-portal-container';
8
+ var portalParentSelector = exports.portalParentSelector = 'body > .atlaskit-portal-container';
9
+ var portalClassName = exports.portalClassName = 'atlaskit-portal';
@@ -7,15 +7,20 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.default = void 0;
8
8
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
9
9
  var _react = require("react");
10
- var useIsSubsequentRender = function useIsSubsequentRender() {
10
+ var _useIsomorphicLayoutEffect = require("./use-isomorphic-layout-effect");
11
+ var useIsSubsequentRender = function useIsSubsequentRender(mountStrategy) {
11
12
  var _useState = (0, _react.useState)(false),
12
13
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
13
14
  isSubsequentRender = _useState2[0],
14
15
  setIsSubsequentRender = _useState2[1];
15
- (0, _react.useEffect)(function () {
16
+ var _useState3 = (0, _react.useState)(function () {
17
+ return mountStrategy === 'layoutEffect' ? _useIsomorphicLayoutEffect.useIsomorphicLayoutEffect : _react.useEffect;
18
+ }),
19
+ _useState4 = (0, _slicedToArray2.default)(_useState3, 1),
20
+ useMountEffect = _useState4[0];
21
+ useMountEffect(function () {
16
22
  setIsSubsequentRender(true);
17
23
  }, []);
18
24
  return isSubsequentRender;
19
25
  };
20
- var _default = useIsSubsequentRender;
21
- exports.default = _default;
26
+ var _default = exports.default = useIsSubsequentRender;
@@ -0,0 +1,11 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useIsomorphicLayoutEffect = void 0;
7
+ var _react = require("react");
8
+ /**
9
+ * Needed to supress the SSR warning when running use layout effect on the server.
10
+ */
11
+ var useIsomorphicLayoutEffect = exports.useIsomorphicLayoutEffect = typeof window !== 'undefined' ? _react.useLayoutEffect : _react.useEffect;
@@ -17,5 +17,4 @@ var useFirePortalEvent = function useFirePortalEvent(zIndex) {
17
17
  };
18
18
  }, [zIndexNumber]);
19
19
  };
20
- var _default = useFirePortalEvent;
21
- exports.default = _default;
20
+ var _default = exports.default = useFirePortalEvent;
@@ -13,7 +13,7 @@ var zIndexToName = {
13
13
  510: 'modal',
14
14
  600: 'flag',
15
15
  700: 'spotlight',
16
- 800: 'tooltip'
16
+ 9999: 'tooltip'
17
17
  };
18
18
 
19
19
  /**
@@ -11,7 +11,7 @@ var _constants = require("../constants");
11
11
  * @param {number | string} zIndex - the z-index value of the newly created portal container element
12
12
  * @return {number} - The newly created container element
13
13
  */
14
- var createContainer = function createContainer(zIndex) {
14
+ var createContainer = exports.createContainer = function createContainer(zIndex) {
15
15
  var container = document.createElement('div');
16
16
  container.className = _constants.portalClassName;
17
17
  container.style.zIndex = "".concat(zIndex);
@@ -22,7 +22,6 @@ var createContainer = function createContainer(zIndex) {
22
22
  * Returns document body element
23
23
  * @return {number} - The document body element
24
24
  */
25
- exports.createContainer = createContainer;
26
25
  var getBody = function getBody() {
27
26
  return document.body;
28
27
  };
@@ -49,7 +48,7 @@ var getPortalParent = function getPortalParent() {
49
48
  * Removes portal container from portal parent container
50
49
  * @param {HTMLDivElement | undefined} container - portal container to be removed from portal parent container
51
50
  */
52
- var removePortalContainer = function removePortalContainer(container) {
51
+ var removePortalContainer = exports.removePortalContainer = function removePortalContainer(container) {
53
52
  getPortalParent().removeChild(container);
54
53
  };
55
54
 
@@ -57,10 +56,8 @@ var removePortalContainer = function removePortalContainer(container) {
57
56
  * Appends portal container to portal parent container if it hasn't already been done
58
57
  * @param {HTMLDivElement | undefined} container - portal container to be added to portal parent container
59
58
  */
60
- exports.removePortalContainer = removePortalContainer;
61
- var appendPortalContainerIfNotAppended = function appendPortalContainerIfNotAppended(container) {
59
+ var appendPortalContainerIfNotAppended = exports.appendPortalContainerIfNotAppended = function appendPortalContainerIfNotAppended(container) {
62
60
  if (!container.parentElement) {
63
61
  getPortalParent().appendChild(container);
64
62
  }
65
- };
66
- exports.appendPortalContainerIfNotAppended = appendPortalContainerIfNotAppended;
63
+ };
@@ -9,11 +9,13 @@ var _react = _interopRequireDefault(require("react"));
9
9
  var _internalPortal = _interopRequireDefault(require("./internal/components/internal-portal"));
10
10
  var _useIsSubsequentRender = _interopRequireDefault(require("./internal/hooks/use-is-subsequent-render"));
11
11
  var _usePortalEvent = _interopRequireDefault(require("./internal/hooks/use-portal-event"));
12
- function Portal(props) {
13
- var _props$zIndex = props.zIndex,
14
- zIndex = _props$zIndex === void 0 ? 0 : _props$zIndex,
15
- children = props.children;
16
- var isSubsequentRender = (0, _useIsSubsequentRender.default)();
12
+ function Portal(_ref) {
13
+ var _ref$zIndex = _ref.zIndex,
14
+ zIndex = _ref$zIndex === void 0 ? 0 : _ref$zIndex,
15
+ children = _ref.children,
16
+ _ref$mountStrategy = _ref.mountStrategy,
17
+ mountStrategy = _ref$mountStrategy === void 0 ? 'effect' : _ref$mountStrategy;
18
+ var isSubsequentRender = (0, _useIsSubsequentRender.default)(mountStrategy);
17
19
  (0, _usePortalEvent.default)(zIndex);
18
20
  return isSubsequentRender ? /*#__PURE__*/_react.default.createElement(_internalPortal.default, {
19
21
  zIndex: zIndex
@@ -1,7 +1,9 @@
1
1
  import { useEffect, useState } from 'react';
2
- const useIsSubsequentRender = () => {
2
+ import { useIsomorphicLayoutEffect } from './use-isomorphic-layout-effect';
3
+ const useIsSubsequentRender = mountStrategy => {
3
4
  const [isSubsequentRender, setIsSubsequentRender] = useState(false);
4
- useEffect(() => {
5
+ const [useMountEffect] = useState(() => mountStrategy === 'layoutEffect' ? useIsomorphicLayoutEffect : useEffect);
6
+ useMountEffect(() => {
5
7
  setIsSubsequentRender(true);
6
8
  }, []);
7
9
  return isSubsequentRender;
@@ -0,0 +1,6 @@
1
+ import { useEffect, useLayoutEffect } from 'react';
2
+
3
+ /**
4
+ * Needed to supress the SSR warning when running use layout effect on the server.
5
+ */
6
+ export const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
@@ -7,7 +7,7 @@ const zIndexToName = {
7
7
  510: 'modal',
8
8
  600: 'flag',
9
9
  700: 'spotlight',
10
- 800: 'tooltip'
10
+ 9999: 'tooltip'
11
11
  };
12
12
 
13
13
  /**
@@ -2,12 +2,12 @@ import React from 'react';
2
2
  import InternalPortal from './internal/components/internal-portal';
3
3
  import useIsSubsequentRender from './internal/hooks/use-is-subsequent-render';
4
4
  import useFirePortalEvent from './internal/hooks/use-portal-event';
5
- export default function Portal(props) {
6
- const {
7
- zIndex = 0,
8
- children
9
- } = props;
10
- const isSubsequentRender = useIsSubsequentRender();
5
+ export default function Portal({
6
+ zIndex = 0,
7
+ children,
8
+ mountStrategy = 'effect'
9
+ }) {
10
+ const isSubsequentRender = useIsSubsequentRender(mountStrategy);
11
11
  useFirePortalEvent(zIndex);
12
12
  return isSubsequentRender ? /*#__PURE__*/React.createElement(InternalPortal, {
13
13
  zIndex: zIndex
@@ -1,11 +1,17 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  import { useEffect, useState } from 'react';
3
- var useIsSubsequentRender = function useIsSubsequentRender() {
3
+ import { useIsomorphicLayoutEffect } from './use-isomorphic-layout-effect';
4
+ var useIsSubsequentRender = function useIsSubsequentRender(mountStrategy) {
4
5
  var _useState = useState(false),
5
6
  _useState2 = _slicedToArray(_useState, 2),
6
7
  isSubsequentRender = _useState2[0],
7
8
  setIsSubsequentRender = _useState2[1];
8
- useEffect(function () {
9
+ var _useState3 = useState(function () {
10
+ return mountStrategy === 'layoutEffect' ? useIsomorphicLayoutEffect : useEffect;
11
+ }),
12
+ _useState4 = _slicedToArray(_useState3, 1),
13
+ useMountEffect = _useState4[0];
14
+ useMountEffect(function () {
9
15
  setIsSubsequentRender(true);
10
16
  }, []);
11
17
  return isSubsequentRender;
@@ -0,0 +1,6 @@
1
+ import { useEffect, useLayoutEffect } from 'react';
2
+
3
+ /**
4
+ * Needed to supress the SSR warning when running use layout effect on the server.
5
+ */
6
+ export var useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
@@ -7,7 +7,7 @@ var zIndexToName = {
7
7
  510: 'modal',
8
8
  600: 'flag',
9
9
  700: 'spotlight',
10
- 800: 'tooltip'
10
+ 9999: 'tooltip'
11
11
  };
12
12
 
13
13
  /**
@@ -2,11 +2,13 @@ import React from 'react';
2
2
  import InternalPortal from './internal/components/internal-portal';
3
3
  import useIsSubsequentRender from './internal/hooks/use-is-subsequent-render';
4
4
  import useFirePortalEvent from './internal/hooks/use-portal-event';
5
- export default function Portal(props) {
6
- var _props$zIndex = props.zIndex,
7
- zIndex = _props$zIndex === void 0 ? 0 : _props$zIndex,
8
- children = props.children;
9
- var isSubsequentRender = useIsSubsequentRender();
5
+ export default function Portal(_ref) {
6
+ var _ref$zIndex = _ref.zIndex,
7
+ zIndex = _ref$zIndex === void 0 ? 0 : _ref$zIndex,
8
+ children = _ref.children,
9
+ _ref$mountStrategy = _ref.mountStrategy,
10
+ mountStrategy = _ref$mountStrategy === void 0 ? 'effect' : _ref$mountStrategy;
11
+ var isSubsequentRender = useIsSubsequentRender(mountStrategy);
10
12
  useFirePortalEvent(zIndex);
11
13
  return isSubsequentRender ? /*#__PURE__*/React.createElement(InternalPortal, {
12
14
  zIndex: zIndex
@@ -1,2 +1,3 @@
1
- declare const useIsSubsequentRender: () => boolean;
1
+ import { MountStrategy } from '../types';
2
+ declare const useIsSubsequentRender: (mountStrategy?: MountStrategy) => boolean;
2
3
  export default useIsSubsequentRender;
@@ -0,0 +1,5 @@
1
+ import { useEffect } from 'react';
2
+ /**
3
+ * Needed to supress the SSR warning when running use layout effect on the server.
4
+ */
5
+ export declare const useIsomorphicLayoutEffect: typeof useEffect;
@@ -21,4 +21,5 @@ export interface PortalEventDetail {
21
21
  layer: LayerName | null;
22
22
  zIndex: number;
23
23
  }
24
+ export type MountStrategy = 'effect' | 'layoutEffect';
24
25
  export {};
@@ -1,3 +1,3 @@
1
1
  /// <reference types="react" />
2
2
  import type { PortalProps } from './types';
3
- export default function Portal(props: PortalProps): JSX.Element | null;
3
+ export default function Portal({ zIndex, children, mountStrategy, }: PortalProps): JSX.Element | null;
@@ -1,11 +1,16 @@
1
1
  import React from 'react';
2
- import { PortalEventDetail } from './internal/types';
2
+ import { MountStrategy, PortalEventDetail } from './internal/types';
3
3
  /**
4
4
  * Interface for props to be passed in Atlassian Portal component
5
5
  */
6
6
  export interface PortalProps {
7
7
  children: React.ReactNode;
8
8
  zIndex?: number | string;
9
+ /**
10
+ * Specify the mount strategy: useEffect or useLayoutEffect.
11
+ * Note: UseLayoutEffect can lead to performance issues and is discouraged.
12
+ */
13
+ mountStrategy?: MountStrategy;
9
14
  }
10
15
  /**
11
16
  * Custom event object that will be fired when Atlassian Portal component is mounted and unmounted
@@ -1,2 +1,3 @@
1
- declare const useIsSubsequentRender: () => boolean;
1
+ import { MountStrategy } from '../types';
2
+ declare const useIsSubsequentRender: (mountStrategy?: MountStrategy) => boolean;
2
3
  export default useIsSubsequentRender;
@@ -0,0 +1,5 @@
1
+ import { useEffect } from 'react';
2
+ /**
3
+ * Needed to supress the SSR warning when running use layout effect on the server.
4
+ */
5
+ export declare const useIsomorphicLayoutEffect: typeof useEffect;
@@ -21,4 +21,5 @@ export interface PortalEventDetail {
21
21
  layer: LayerName | null;
22
22
  zIndex: number;
23
23
  }
24
+ export type MountStrategy = 'effect' | 'layoutEffect';
24
25
  export {};
@@ -1,3 +1,3 @@
1
1
  /// <reference types="react" />
2
2
  import type { PortalProps } from './types';
3
- export default function Portal(props: PortalProps): JSX.Element | null;
3
+ export default function Portal({ zIndex, children, mountStrategy, }: PortalProps): JSX.Element | null;
@@ -1,11 +1,16 @@
1
1
  import React from 'react';
2
- import { PortalEventDetail } from './internal/types';
2
+ import { MountStrategy, PortalEventDetail } from './internal/types';
3
3
  /**
4
4
  * Interface for props to be passed in Atlassian Portal component
5
5
  */
6
6
  export interface PortalProps {
7
7
  children: React.ReactNode;
8
8
  zIndex?: number | string;
9
+ /**
10
+ * Specify the mount strategy: useEffect or useLayoutEffect.
11
+ * Note: UseLayoutEffect can lead to performance issues and is discouraged.
12
+ */
13
+ mountStrategy?: MountStrategy;
9
14
  }
10
15
  /**
11
16
  * Custom event object that will be fired when Atlassian Portal component is mounted and unmounted
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/portal",
3
- "version": "4.3.5",
3
+ "version": "4.4.0",
4
4
  "description": "A wrapper for rendering components in React portals.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -38,7 +38,7 @@
38
38
  ".": "./src/index.tsx"
39
39
  },
40
40
  "dependencies": {
41
- "@atlaskit/theme": "^12.5.0",
41
+ "@atlaskit/theme": "^12.6.0",
42
42
  "@babel/runtime": "^7.0.0"
43
43
  },
44
44
  "peerDependencies": {
@@ -48,12 +48,13 @@
48
48
  "devDependencies": {
49
49
  "@af/accessibility-testing": "*",
50
50
  "@atlaskit/ssr": "*",
51
- "@atlaskit/tokens": "^1.14.0",
51
+ "@atlaskit/tokens": "^1.28.0",
52
52
  "@atlaskit/visual-regression": "*",
53
53
  "@atlaskit/webdriver-runner": "*",
54
54
  "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
55
55
  "@emotion/react": "^11.7.1",
56
56
  "@testing-library/react": "^12.1.5",
57
+ "@testing-library/react-hooks": "^8.0.1",
57
58
  "bind-event-listener": "^2.1.1",
58
59
  "raf-stub": "^2.0.1",
59
60
  "storybook-addon-performance": "^0.16.0",
package/report.api.md CHANGED
@@ -24,7 +24,14 @@ import { default as React_2 } from 'react';
24
24
  type LayerName = keyof Layers;
25
25
 
26
26
  // @public (undocumented)
27
- function Portal(props: PortalProps): JSX.Element | null;
27
+ type MountStrategy = 'effect' | 'layoutEffect';
28
+
29
+ // @public (undocumented)
30
+ function Portal({
31
+ zIndex,
32
+ children,
33
+ mountStrategy,
34
+ }: PortalProps): JSX.Element | null;
28
35
  export default Portal;
29
36
 
30
37
  // @public (undocumented)
@@ -48,6 +55,7 @@ interface PortalEventDetail {
48
55
  export interface PortalProps {
49
56
  // (undocumented)
50
57
  children: React_2.ReactNode;
58
+ mountStrategy?: MountStrategy;
51
59
  // (undocumented)
52
60
  zIndex?: number | string;
53
61
  }
@@ -13,7 +13,10 @@ import { default as React_2 } from 'react';
13
13
  type LayerName = keyof Layers;
14
14
 
15
15
  // @public (undocumented)
16
- function Portal(props: PortalProps): JSX.Element | null;
16
+ type MountStrategy = 'effect' | 'layoutEffect';
17
+
18
+ // @public (undocumented)
19
+ function Portal({ zIndex, children, mountStrategy, }: PortalProps): JSX.Element | null;
17
20
  export default Portal;
18
21
 
19
22
  // @public (undocumented)
@@ -37,6 +40,7 @@ interface PortalEventDetail {
37
40
  export interface PortalProps {
38
41
  // (undocumented)
39
42
  children: React_2.ReactNode;
43
+ mountStrategy?: MountStrategy;
40
44
  // (undocumented)
41
45
  zIndex?: number | string;
42
46
  }