@atlaskit/popup 1.6.2 → 1.6.3
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,11 @@
|
|
|
1
1
|
# @atlaskit/popup
|
|
2
2
|
|
|
3
|
+
## 1.6.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`c394dbc632f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c394dbc632f) - Addresses the problem where the popup fails to close upon clicking on the iframe
|
|
8
|
+
|
|
3
9
|
## 1.6.2
|
|
4
10
|
|
|
5
11
|
### Patch Changes
|
|
@@ -30,6 +30,16 @@ var popupStyles = (0, _react2.css)({
|
|
|
30
30
|
outline: 'none'
|
|
31
31
|
}
|
|
32
32
|
});
|
|
33
|
+
|
|
34
|
+
// disables iframe pointer events while popup is open, except if iframe is nested inside popup
|
|
35
|
+
// solves an issue of popup not being closed on iframe click
|
|
36
|
+
// @ts-expect-error adding `!important` to style rules is currently a type error
|
|
37
|
+
var blockPointerEventsOnExternalIframeStyles = (0, _react2.css)({
|
|
38
|
+
// eslint-disable-next-line @repo/internal/styles/no-nested-styles
|
|
39
|
+
'iframe:not([data-ds--popup] iframe)': {
|
|
40
|
+
pointerEvents: 'none !important'
|
|
41
|
+
}
|
|
42
|
+
});
|
|
33
43
|
var DefaultPopupComponent = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
34
44
|
return (0, _react2.jsx)("div", (0, _extends2.default)({
|
|
35
45
|
css: popupStyles
|
|
@@ -99,6 +109,7 @@ function PopperWrapper(_ref) {
|
|
|
99
109
|
id: id,
|
|
100
110
|
"data-placement": placement,
|
|
101
111
|
"data-testid": testId,
|
|
112
|
+
"data-ds--popup": "true",
|
|
102
113
|
ref: function ref(node) {
|
|
103
114
|
if (node) {
|
|
104
115
|
if (typeof _ref3 === 'function') {
|
|
@@ -114,7 +125,9 @@ function PopperWrapper(_ref) {
|
|
|
114
125
|
// first on the browser address bar when using keyboard
|
|
115
126
|
,
|
|
116
127
|
tabIndex: autoFocus ? 0 : undefined
|
|
117
|
-
}, (0, _react2.jsx)(
|
|
128
|
+
}, (0, _react2.jsx)(_react2.Global, {
|
|
129
|
+
styles: blockPointerEventsOnExternalIframeStyles
|
|
130
|
+
}), (0, _react2.jsx)(_repositionOnUpdate.RepositionOnUpdate, {
|
|
118
131
|
update: update
|
|
119
132
|
}, content({
|
|
120
133
|
update: update,
|
package/dist/cjs/version.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
/** @jsx jsx */
|
|
3
3
|
import { forwardRef, useMemo, useState } from 'react';
|
|
4
|
-
import { css, jsx } from '@emotion/react';
|
|
4
|
+
import { css, Global, jsx } from '@emotion/react';
|
|
5
5
|
import { Popper } from '@atlaskit/popper';
|
|
6
6
|
import { N0, N50A, N60A } from '@atlaskit/theme/colors';
|
|
7
7
|
import { borderRadius, layers } from '@atlaskit/theme/constants';
|
|
@@ -21,6 +21,16 @@ const popupStyles = css({
|
|
|
21
21
|
outline: 'none'
|
|
22
22
|
}
|
|
23
23
|
});
|
|
24
|
+
|
|
25
|
+
// disables iframe pointer events while popup is open, except if iframe is nested inside popup
|
|
26
|
+
// solves an issue of popup not being closed on iframe click
|
|
27
|
+
// @ts-expect-error adding `!important` to style rules is currently a type error
|
|
28
|
+
const blockPointerEventsOnExternalIframeStyles = css({
|
|
29
|
+
// eslint-disable-next-line @repo/internal/styles/no-nested-styles
|
|
30
|
+
'iframe:not([data-ds--popup] iframe)': {
|
|
31
|
+
pointerEvents: 'none !important'
|
|
32
|
+
}
|
|
33
|
+
});
|
|
24
34
|
const DefaultPopupComponent = /*#__PURE__*/forwardRef((props, ref) => jsx("div", _extends({
|
|
25
35
|
css: popupStyles
|
|
26
36
|
}, props, {
|
|
@@ -79,6 +89,7 @@ function PopperWrapper({
|
|
|
79
89
|
id: id,
|
|
80
90
|
"data-placement": placement,
|
|
81
91
|
"data-testid": testId,
|
|
92
|
+
"data-ds--popup": "true",
|
|
82
93
|
ref: node => {
|
|
83
94
|
if (node) {
|
|
84
95
|
if (typeof ref === 'function') {
|
|
@@ -94,7 +105,9 @@ function PopperWrapper({
|
|
|
94
105
|
// first on the browser address bar when using keyboard
|
|
95
106
|
,
|
|
96
107
|
tabIndex: autoFocus ? 0 : undefined
|
|
97
|
-
}, jsx(
|
|
108
|
+
}, jsx(Global, {
|
|
109
|
+
styles: blockPointerEventsOnExternalIframeStyles
|
|
110
|
+
}), jsx(RepositionOnUpdate, {
|
|
98
111
|
update: update
|
|
99
112
|
}, content({
|
|
100
113
|
update,
|
package/dist/es2019/version.json
CHANGED
|
@@ -2,7 +2,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
/** @jsx jsx */
|
|
4
4
|
import { forwardRef, useMemo, useState } from 'react';
|
|
5
|
-
import { css, jsx } from '@emotion/react';
|
|
5
|
+
import { css, Global, jsx } from '@emotion/react';
|
|
6
6
|
import { Popper } from '@atlaskit/popper';
|
|
7
7
|
import { N0, N50A, N60A } from '@atlaskit/theme/colors';
|
|
8
8
|
import { borderRadius, layers } from '@atlaskit/theme/constants';
|
|
@@ -22,6 +22,16 @@ var popupStyles = css({
|
|
|
22
22
|
outline: 'none'
|
|
23
23
|
}
|
|
24
24
|
});
|
|
25
|
+
|
|
26
|
+
// disables iframe pointer events while popup is open, except if iframe is nested inside popup
|
|
27
|
+
// solves an issue of popup not being closed on iframe click
|
|
28
|
+
// @ts-expect-error adding `!important` to style rules is currently a type error
|
|
29
|
+
var blockPointerEventsOnExternalIframeStyles = css({
|
|
30
|
+
// eslint-disable-next-line @repo/internal/styles/no-nested-styles
|
|
31
|
+
'iframe:not([data-ds--popup] iframe)': {
|
|
32
|
+
pointerEvents: 'none !important'
|
|
33
|
+
}
|
|
34
|
+
});
|
|
25
35
|
var DefaultPopupComponent = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
26
36
|
return jsx("div", _extends({
|
|
27
37
|
css: popupStyles
|
|
@@ -91,6 +101,7 @@ function PopperWrapper(_ref) {
|
|
|
91
101
|
id: id,
|
|
92
102
|
"data-placement": placement,
|
|
93
103
|
"data-testid": testId,
|
|
104
|
+
"data-ds--popup": "true",
|
|
94
105
|
ref: function ref(node) {
|
|
95
106
|
if (node) {
|
|
96
107
|
if (typeof _ref3 === 'function') {
|
|
@@ -106,7 +117,9 @@ function PopperWrapper(_ref) {
|
|
|
106
117
|
// first on the browser address bar when using keyboard
|
|
107
118
|
,
|
|
108
119
|
tabIndex: autoFocus ? 0 : undefined
|
|
109
|
-
}, jsx(
|
|
120
|
+
}, jsx(Global, {
|
|
121
|
+
styles: blockPointerEventsOnExternalIframeStyles
|
|
122
|
+
}), jsx(RepositionOnUpdate, {
|
|
110
123
|
update: update
|
|
111
124
|
}, content({
|
|
112
125
|
update: update,
|
package/dist/esm/version.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/popup",
|
|
3
|
-
"version": "1.6.
|
|
3
|
+
"version": "1.6.3",
|
|
4
4
|
"description": "A popup displays brief content in an overlay.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -54,16 +54,18 @@
|
|
|
54
54
|
"@atlaskit/docs": "*",
|
|
55
55
|
"@atlaskit/icon": "^21.12.0",
|
|
56
56
|
"@atlaskit/menu": "^1.7.0",
|
|
57
|
-
"@atlaskit/
|
|
57
|
+
"@atlaskit/page-layout": "^1.6.0",
|
|
58
|
+
"@atlaskit/radio": "^5.6.0",
|
|
58
59
|
"@atlaskit/section-message": "^6.4.0",
|
|
59
|
-
"@atlaskit/select": "^16.
|
|
60
|
+
"@atlaskit/select": "^16.4.0",
|
|
60
61
|
"@atlaskit/ssr": "*",
|
|
61
|
-
"@atlaskit/textfield": "^5.
|
|
62
|
+
"@atlaskit/textfield": "^5.5.0",
|
|
62
63
|
"@atlaskit/toggle": "^12.6.0",
|
|
63
64
|
"@atlaskit/visual-regression": "*",
|
|
64
65
|
"@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
|
|
65
66
|
"@testing-library/dom": "^8.17.1",
|
|
66
67
|
"@testing-library/react": "^12.1.5",
|
|
68
|
+
"@testing-library/user-event": "^14.4.3",
|
|
67
69
|
"ast-types": "^0.13.3",
|
|
68
70
|
"jest-axe": "^4.0.0",
|
|
69
71
|
"jscodeshift": "^0.13.0",
|