@atlaskit/drawer 7.14.2 → 7.14.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 +8 -0
- package/dist/cjs/components/index.js +99 -139
- package/dist/cjs/components/primitives/focus-lock.js +43 -72
- package/dist/es2019/components/index.js +93 -118
- package/dist/es2019/components/primitives/focus-lock.js +37 -52
- package/dist/esm/components/index.js +97 -140
- package/dist/esm/components/primitives/focus-lock.js +44 -74
- package/dist/types/components/index.d.ts +18 -30
- package/dist/types/components/primitives/focus-lock.d.ts +9 -12
- package/dist/types/components/types.d.ts +1 -1
- package/dist/types-ts4.5/components/index.d.ts +18 -30
- package/dist/types-ts4.5/components/primitives/focus-lock.d.ts +9 -12
- package/dist/types-ts4.5/components/types.d.ts +1 -1
- package/package.json +5 -9
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @atlaskit/drawer
|
|
2
2
|
|
|
3
|
+
## 7.14.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#138959](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/138959)
|
|
8
|
+
[`787e6d015c8cd`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/787e6d015c8cd) -
|
|
9
|
+
Internal change only: Convert from class components to function components.
|
|
10
|
+
|
|
3
11
|
## 7.14.2
|
|
4
12
|
|
|
5
13
|
### Patch Changes
|
|
@@ -6,30 +6,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.default = exports.DrawerBase = void 0;
|
|
9
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
10
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
11
|
-
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
12
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
13
|
-
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
14
|
-
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
15
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
16
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
17
10
|
var _exenv = require("exenv");
|
|
18
11
|
var _analyticsNext = require("@atlaskit/analytics-next");
|
|
19
12
|
var _layering = require("@atlaskit/layering");
|
|
20
13
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
21
14
|
var _portal = _interopRequireDefault(require("@atlaskit/portal"));
|
|
22
|
-
var _constants = require("../constants");
|
|
23
15
|
var _blanket = _interopRequireDefault(require("./blanket"));
|
|
24
16
|
var _primitives = _interopRequireDefault(require("./primitives"));
|
|
25
17
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
26
18
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
|
|
30
|
-
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
|
|
19
|
+
/* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
|
|
20
|
+
|
|
31
21
|
var packageName = "@atlaskit/drawer";
|
|
32
|
-
var packageVersion = "7.14.
|
|
22
|
+
var packageVersion = "7.14.3";
|
|
33
23
|
var createAndFireEventOnAtlaskit = (0, _analyticsNext.createAndFireEvent)('atlaskit');
|
|
34
24
|
var createAndFireOnClick = function createAndFireOnClick(createAnalyticsEvent, trigger) {
|
|
35
25
|
return createAndFireEventOnAtlaskit({
|
|
@@ -60,139 +50,112 @@ var EscapeCloseManager = function EscapeCloseManager(_ref) {
|
|
|
60
50
|
// only create a dummy component for using ths hook in class component
|
|
61
51
|
return /*#__PURE__*/_react.default.createElement("span", null);
|
|
62
52
|
};
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* __Drawer base__
|
|
56
|
+
*
|
|
57
|
+
* A drawer is a panel that slides in from the left side of the screen.
|
|
58
|
+
*
|
|
59
|
+
* - [Examples](https://atlassian.design/components/drawer/examples)
|
|
60
|
+
* - [Code](https://atlassian.design/components/drawer/code)
|
|
61
|
+
* - [Usage](https://atlassian.design/components/drawer/usage)
|
|
62
|
+
*/
|
|
63
|
+
var DrawerBase = exports.DrawerBase = function DrawerBase(_ref2) {
|
|
64
|
+
var _ref2$width = _ref2.width,
|
|
65
|
+
width = _ref2$width === void 0 ? 'narrow' : _ref2$width,
|
|
66
|
+
isOpen = _ref2.isOpen,
|
|
67
|
+
_ref2$isFocusLockEnab = _ref2.isFocusLockEnabled,
|
|
68
|
+
isFocusLockEnabled = _ref2$isFocusLockEnab === void 0 ? true : _ref2$isFocusLockEnab,
|
|
69
|
+
_ref2$shouldReturnFoc = _ref2.shouldReturnFocus,
|
|
70
|
+
shouldReturnFocus = _ref2$shouldReturnFoc === void 0 ? true : _ref2$shouldReturnFoc,
|
|
71
|
+
_ref2$autoFocusFirstE = _ref2.autoFocusFirstElem,
|
|
72
|
+
autoFocusFirstElem = _ref2$autoFocusFirstE === void 0 ? true : _ref2$autoFocusFirstE,
|
|
73
|
+
onKeyDown = _ref2.onKeyDown,
|
|
74
|
+
createAnalyticsEvent = _ref2.createAnalyticsEvent,
|
|
75
|
+
onClose = _ref2.onClose,
|
|
76
|
+
testId = _ref2.testId,
|
|
77
|
+
children = _ref2.children,
|
|
78
|
+
icon = _ref2.icon,
|
|
79
|
+
closeLabel = _ref2.closeLabel,
|
|
80
|
+
scrollContentLabel = _ref2.scrollContentLabel,
|
|
81
|
+
shouldUnmountOnExit = _ref2.shouldUnmountOnExit,
|
|
82
|
+
onCloseComplete = _ref2.onCloseComplete,
|
|
83
|
+
onOpenComplete = _ref2.onOpenComplete,
|
|
84
|
+
overrides = _ref2.overrides,
|
|
85
|
+
_ref2$zIndex = _ref2.zIndex,
|
|
86
|
+
zIndex = _ref2$zIndex === void 0 ? 'unset' : _ref2$zIndex,
|
|
87
|
+
label = _ref2.label,
|
|
88
|
+
titleId = _ref2.titleId,
|
|
89
|
+
enterFrom = _ref2.enterFrom;
|
|
90
|
+
var body = _exenv.canUseDOM ? document.querySelector('body') : undefined;
|
|
91
|
+
var handleClose = (0, _react.useCallback)(function (event, trigger) {
|
|
92
|
+
var analyticsEvent = createAnalyticsEvent && createAndFireOnClick(createAnalyticsEvent, trigger);
|
|
93
|
+
if (onClose) {
|
|
94
|
+
onClose(event, analyticsEvent);
|
|
71
95
|
}
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
});
|
|
76
|
-
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "body", _exenv.canUseDOM ? document.querySelector('body') : undefined);
|
|
77
|
-
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleBlanketClick", function (event) {
|
|
78
|
-
_this.handleClose(event, 'blanket');
|
|
79
|
-
});
|
|
80
|
-
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleBackButtonClick", function (event) {
|
|
81
|
-
_this.handleClose(event, 'backButton');
|
|
82
|
-
});
|
|
83
|
-
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleClose", function (event, trigger) {
|
|
84
|
-
var _this$props = _this.props,
|
|
85
|
-
createAnalyticsEvent = _this$props.createAnalyticsEvent,
|
|
86
|
-
onClose = _this$props.onClose;
|
|
87
|
-
var analyticsEvent = createAnalyticsEvent && createAndFireOnClick(createAnalyticsEvent, trigger);
|
|
88
|
-
if (onClose) {
|
|
89
|
-
onClose(event, analyticsEvent);
|
|
90
|
-
}
|
|
91
|
-
});
|
|
92
|
-
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleKeyDown", function (event) {
|
|
93
|
-
var _this$props2 = _this.props,
|
|
94
|
-
isOpen = _this$props2.isOpen,
|
|
95
|
-
onKeyDown = _this$props2.onKeyDown;
|
|
96
|
+
}, [createAnalyticsEvent, onClose]);
|
|
97
|
+
(0, _react.useEffect)(function () {
|
|
98
|
+
var handleKeyDown = function handleKeyDown(event) {
|
|
96
99
|
if (!(0, _platformFeatureFlags.fg)('platform.design-system-team.inline-message-layering_wfp1p')) {
|
|
97
100
|
// when feature flag on, we will use the EscapeCloseManager instead
|
|
98
101
|
if (event.key === 'Escape' && isOpen) {
|
|
99
|
-
|
|
102
|
+
handleClose(event, 'escKey');
|
|
100
103
|
}
|
|
101
104
|
}
|
|
102
105
|
if (onKeyDown) {
|
|
103
106
|
onKeyDown(event);
|
|
104
107
|
}
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
(0, _createClass2.default)(DrawerBase, [{
|
|
109
|
-
key: "componentDidMount",
|
|
110
|
-
value: function componentDidMount() {
|
|
111
|
-
var isOpen = this.props.isOpen;
|
|
112
|
-
if (isOpen) {
|
|
113
|
-
window.addEventListener('keydown', this.handleKeyDown);
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
}, {
|
|
117
|
-
key: "componentWillUnmount",
|
|
118
|
-
value: function componentWillUnmount() {
|
|
119
|
-
window.removeEventListener('keydown', this.handleKeyDown);
|
|
120
|
-
}
|
|
121
|
-
}, {
|
|
122
|
-
key: "componentDidUpdate",
|
|
123
|
-
value: function componentDidUpdate(prevProps) {
|
|
124
|
-
var isOpen = this.props.isOpen;
|
|
125
|
-
if (isOpen !== prevProps.isOpen) {
|
|
126
|
-
if (isOpen) {
|
|
127
|
-
window.addEventListener('keydown', this.handleKeyDown);
|
|
128
|
-
} else {
|
|
129
|
-
window.removeEventListener('keydown', this.handleKeyDown);
|
|
130
|
-
}
|
|
131
|
-
}
|
|
108
|
+
};
|
|
109
|
+
if (isOpen) {
|
|
110
|
+
window.addEventListener('keydown', handleKeyDown);
|
|
132
111
|
}
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
,
|
|
181
|
-
overrides: overrides,
|
|
182
|
-
autoFocusFirstElem: autoFocusFirstElem,
|
|
183
|
-
isFocusLockEnabled: isFocusLockEnabled,
|
|
184
|
-
shouldReturnFocus: shouldReturnFocus,
|
|
185
|
-
scrollContentLabel: scrollContentLabel
|
|
186
|
-
}, shouldHaveLayeringEnabled ? /*#__PURE__*/_react.default.createElement(_layering.UNSAFE_LAYERING, {
|
|
187
|
-
isDisabled: false
|
|
188
|
-
}, children, /*#__PURE__*/_react.default.createElement(EscapeCloseManager, {
|
|
189
|
-
createAnalyticsEvent: this.props.createAnalyticsEvent,
|
|
190
|
-
handleClose: this.handleClose
|
|
191
|
-
})) : children));
|
|
192
|
-
}
|
|
193
|
-
}]);
|
|
194
|
-
return DrawerBase;
|
|
195
|
-
}(_react.Component);
|
|
112
|
+
return function () {
|
|
113
|
+
window.removeEventListener('keydown', handleKeyDown);
|
|
114
|
+
};
|
|
115
|
+
}, [handleClose, isOpen, onKeyDown]);
|
|
116
|
+
var handleBlanketClick = function handleBlanketClick(event) {
|
|
117
|
+
handleClose(event, 'blanket');
|
|
118
|
+
};
|
|
119
|
+
var handleBackButtonClick = function handleBackButtonClick(event) {
|
|
120
|
+
handleClose(event, 'backButton');
|
|
121
|
+
};
|
|
122
|
+
if (!body) {
|
|
123
|
+
return null;
|
|
124
|
+
}
|
|
125
|
+
return /*#__PURE__*/_react.default.createElement(_portal.default, {
|
|
126
|
+
zIndex: zIndex
|
|
127
|
+
}, /*#__PURE__*/_react.default.createElement(_blanket.default, {
|
|
128
|
+
isOpen: isOpen,
|
|
129
|
+
onBlanketClicked: handleBlanketClick,
|
|
130
|
+
testId: testId && "".concat(testId, "--blanket")
|
|
131
|
+
}), /*#__PURE__*/_react.default.createElement(_primitives.default, {
|
|
132
|
+
testId: testId,
|
|
133
|
+
icon: icon,
|
|
134
|
+
closeLabel: closeLabel,
|
|
135
|
+
in: isOpen,
|
|
136
|
+
onClose: handleBackButtonClick,
|
|
137
|
+
onCloseComplete: onCloseComplete,
|
|
138
|
+
onOpenComplete: onOpenComplete,
|
|
139
|
+
width: width,
|
|
140
|
+
enterFrom: enterFrom,
|
|
141
|
+
label: label,
|
|
142
|
+
titleId: titleId,
|
|
143
|
+
shouldUnmountOnExit: shouldUnmountOnExit
|
|
144
|
+
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
145
|
+
,
|
|
146
|
+
overrides: overrides,
|
|
147
|
+
autoFocusFirstElem: autoFocusFirstElem,
|
|
148
|
+
isFocusLockEnabled: isFocusLockEnabled,
|
|
149
|
+
shouldReturnFocus: shouldReturnFocus,
|
|
150
|
+
scrollContentLabel: scrollContentLabel
|
|
151
|
+
}, isOpen && (0, _platformFeatureFlags.fg)('platform.design-system-team.inline-message-layering_wfp1p') ? /*#__PURE__*/_react.default.createElement(_layering.UNSAFE_LAYERING, {
|
|
152
|
+
isDisabled: false
|
|
153
|
+
}, children, /*#__PURE__*/_react.default.createElement(EscapeCloseManager, {
|
|
154
|
+
createAnalyticsEvent: createAnalyticsEvent,
|
|
155
|
+
handleClose: handleClose
|
|
156
|
+
})) : children));
|
|
157
|
+
};
|
|
158
|
+
|
|
196
159
|
/**
|
|
197
160
|
* __Drawer__
|
|
198
161
|
*
|
|
@@ -202,9 +165,6 @@ var DrawerBase = exports.DrawerBase = /*#__PURE__*/function (_Component) {
|
|
|
202
165
|
* - [Code](https://atlassian.design/components/drawer/code)
|
|
203
166
|
* - [Usage](https://atlassian.design/components/drawer/usage)
|
|
204
167
|
*/
|
|
205
|
-
(0, _defineProperty2.default)(DrawerBase, "defaultProps", _objectSpread({
|
|
206
|
-
width: 'narrow'
|
|
207
|
-
}, _constants.defaultFocusLockSettings));
|
|
208
168
|
var Drawer = (0, _analyticsNext.withAnalyticsContext)({
|
|
209
169
|
componentName: 'drawer',
|
|
210
170
|
packageName: packageName,
|
|
@@ -6,85 +6,56 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.default = void 0;
|
|
9
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
10
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
11
|
-
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
12
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
13
|
-
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
14
|
-
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
15
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
16
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
17
10
|
var _reactFocusLock = _interopRequireDefault(require("react-focus-lock"));
|
|
18
11
|
var _reactScrolllock = _interopRequireDefault(require("react-scrolllock"));
|
|
19
12
|
var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
|
|
20
|
-
var _constants = require("../../constants");
|
|
21
13
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
22
14
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
var FocusLock =
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
15
|
+
/**
|
|
16
|
+
* __Focus lock__
|
|
17
|
+
*
|
|
18
|
+
* Thin wrapper over react-focus-lock. This wrapper only exists to ensure API compatibility.
|
|
19
|
+
* This component should be deleted during https://ecosystem.atlassian.net/browse/AK-5658
|
|
20
|
+
*/
|
|
21
|
+
var FocusLock = function FocusLock(_ref) {
|
|
22
|
+
var _ref$isFocusLockEnabl = _ref.isFocusLockEnabled,
|
|
23
|
+
isFocusLockEnabled = _ref$isFocusLockEnabl === void 0 ? true : _ref$isFocusLockEnabl,
|
|
24
|
+
_ref$autoFocusFirstEl = _ref.autoFocusFirstElem,
|
|
25
|
+
autoFocusFirstElem = _ref$autoFocusFirstEl === void 0 ? true : _ref$autoFocusFirstEl,
|
|
26
|
+
_ref$shouldReturnFocu = _ref.shouldReturnFocus,
|
|
27
|
+
shouldReturnFocus = _ref$shouldReturnFocu === void 0 ? true : _ref$shouldReturnFocu,
|
|
28
|
+
children = _ref.children;
|
|
29
|
+
(0, _react.useEffect)(function () {
|
|
30
|
+
if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production' && !process.env.CI) {
|
|
31
|
+
(0, _tinyInvariant.default)(typeof autoFocusFirstElem === 'boolean', '@atlaskit/drawer: Passing a function as autoFocus is deprecated. Instead call focus on the element ref or use the autofocus property.');
|
|
37
32
|
}
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
return shouldReturnFocus;
|
|
43
|
-
}
|
|
44
|
-
return false;
|
|
45
|
-
});
|
|
46
|
-
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onDeactivation", function () {
|
|
47
|
-
var shouldReturnFocus = _this.props.shouldReturnFocus;
|
|
48
|
-
if (typeof shouldReturnFocus !== 'boolean') {
|
|
49
|
-
window.setTimeout(function () {
|
|
50
|
-
var _shouldReturnFocus$cu;
|
|
51
|
-
shouldReturnFocus === null || shouldReturnFocus === void 0 || (_shouldReturnFocus$cu = shouldReturnFocus.current) === null || _shouldReturnFocus$cu === void 0 || _shouldReturnFocus$cu.focus();
|
|
52
|
-
}, 0);
|
|
53
|
-
}
|
|
54
|
-
});
|
|
55
|
-
return _this;
|
|
56
|
-
}
|
|
57
|
-
(0, _createClass2.default)(FocusLock, [{
|
|
58
|
-
key: "componentDidMount",
|
|
59
|
-
value: function componentDidMount() {
|
|
60
|
-
var _this$props = this.props,
|
|
61
|
-
isFocusLockEnabled = _this$props.isFocusLockEnabled,
|
|
62
|
-
autoFocusFirstElem = _this$props.autoFocusFirstElem;
|
|
63
|
-
if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production' && !process.env.CI) {
|
|
64
|
-
(0, _tinyInvariant.default)(typeof autoFocusFirstElem === 'boolean', '@atlaskit/drawer: Passing a function as autoFocus is deprecated. Instead call focus on the element ref or use the autofocus property.');
|
|
65
|
-
}
|
|
66
|
-
if (typeof autoFocusFirstElem === 'function' && isFocusLockEnabled) {
|
|
67
|
-
var elem = autoFocusFirstElem();
|
|
68
|
-
if (elem && elem.focus) {
|
|
69
|
-
elem.focus();
|
|
70
|
-
}
|
|
33
|
+
if (typeof autoFocusFirstElem === 'function' && isFocusLockEnabled) {
|
|
34
|
+
var elem = autoFocusFirstElem();
|
|
35
|
+
if (elem && elem.focus) {
|
|
36
|
+
elem.focus();
|
|
71
37
|
}
|
|
72
38
|
}
|
|
73
|
-
},
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
},
|
|
39
|
+
}, [autoFocusFirstElem, isFocusLockEnabled]);
|
|
40
|
+
var getFocusTarget = function getFocusTarget() {
|
|
41
|
+
if (typeof shouldReturnFocus === 'boolean') {
|
|
42
|
+
return shouldReturnFocus;
|
|
43
|
+
}
|
|
44
|
+
return false;
|
|
45
|
+
};
|
|
46
|
+
var onDeactivation = function onDeactivation() {
|
|
47
|
+
if (typeof shouldReturnFocus !== 'boolean') {
|
|
48
|
+
window.setTimeout(function () {
|
|
49
|
+
var _shouldReturnFocus$cu;
|
|
50
|
+
shouldReturnFocus === null || shouldReturnFocus === void 0 || (_shouldReturnFocus$cu = shouldReturnFocus.current) === null || _shouldReturnFocus$cu === void 0 || _shouldReturnFocus$cu.focus();
|
|
51
|
+
}, 0);
|
|
86
52
|
}
|
|
87
|
-
}
|
|
88
|
-
return
|
|
89
|
-
|
|
90
|
-
|
|
53
|
+
};
|
|
54
|
+
return /*#__PURE__*/_react.default.createElement(_reactFocusLock.default, {
|
|
55
|
+
disabled: !isFocusLockEnabled,
|
|
56
|
+
autoFocus: !!autoFocusFirstElem,
|
|
57
|
+
returnFocus: getFocusTarget(),
|
|
58
|
+
onDeactivation: onDeactivation
|
|
59
|
+
}, /*#__PURE__*/_react.default.createElement(_reactScrolllock.default, null, children));
|
|
60
|
+
};
|
|
61
|
+
var _default = exports.default = FocusLock;
|