UNPKG

4.75 kBJavaScriptView Raw
1'use strict';
2
3function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
4
5var _get = _interopDefault(require('lodash/get'));
6var __chunk_1 = require('./chunk-c300b528.js');
7var React = require('react');
8var React__default = _interopDefault(React);
9var createFocusTrap = _interopDefault(require('focus-trap'));
10
11var convertToMs = function convertToMs(time) {
12 if (/([0-9]*[.])?[0-9]+ms/.test(time)) {
13 return parseFloat(time.replace('ms', ''));
14 }
15
16 if (/([0-9]*[.])?[0-9]+s/.test(time)) {
17 return parseFloat(time.replace('s', '')) * 1000;
18 }
19
20 return 0;
21};
22
23var noop = function noop() {};
24
25var TrapFocus =
26/*#__PURE__*/
27function (_React$Component) {
28 __chunk_1._inheritsLoose(TrapFocus, _React$Component);
29
30 function TrapFocus() {
31 var _this;
32
33 for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
34 args[_key] = arguments[_key];
35 }
36
37 _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
38
39 __chunk_1._defineProperty(__chunk_1._assertThisInitialized(_this), "state", {
40 originalAriaHiddenValues: []
41 });
42
43 __chunk_1._defineProperty(__chunk_1._assertThisInitialized(_this), "fallbackFocus", React.createRef());
44
45 __chunk_1._defineProperty(__chunk_1._assertThisInitialized(_this), "initialFocus", React.createRef());
46
47 __chunk_1._defineProperty(__chunk_1._assertThisInitialized(_this), "wrapper", React.createRef());
48
49 __chunk_1._defineProperty(__chunk_1._assertThisInitialized(_this), "trap", {
50 activate: noop,
51 deactivate: noop
52 });
53
54 __chunk_1._defineProperty(__chunk_1._assertThisInitialized(_this), "componentDidMount", function () {
55 var _this$props = _this.props,
56 delayToActivate = _this$props.delayToActivate,
57 isActive = _this$props.isActive,
58 usesPortal = _this$props.usesPortal; // @ts-ignore
59
60 _this.trap = createFocusTrap(_this.wrapper.current, {
61 initialFocus: _this.initialFocus.current,
62 fallbackFocus: _this.fallbackFocus.current,
63 escapeDeactivates: false,
64 clickOutsideDeactivates: false
65 });
66
67 if (isActive) {
68 if (delayToActivate) {
69 setTimeout(_this.trap.activate, convertToMs(delayToActivate));
70 } else {
71 _this.trap.activate();
72 }
73 }
74
75 if (usesPortal) {
76 Array.from(_get(document, 'body.children', [])).forEach(function (child) {
77 if (child.contains(_this.wrapper.current)) return;
78
79 _this.setState(function (prevState) {
80 return {
81 originalAriaHiddenValues: [].concat(prevState.originalAriaHiddenValues || [], [child.getAttribute('aria-hidden')])
82 };
83 });
84 });
85 }
86 });
87
88 __chunk_1._defineProperty(__chunk_1._assertThisInitialized(_this), "componentDidUpdate", function (prevProps) {
89 var _this$props2 = _this.props,
90 delayToActivate = _this$props2.delayToActivate,
91 isActive = _this$props2.isActive,
92 usesPortal = _this$props2.usesPortal;
93 var originalAriaHiddenValues = _this.state.originalAriaHiddenValues;
94
95 if (isActive !== prevProps.isActive) {
96 if (isActive) {
97 if (delayToActivate) {
98 setTimeout(_this.trap.activate, convertToMs(delayToActivate));
99 } else {
100 _this.trap.activate();
101 }
102 } else {
103 _this.trap.deactivate();
104 }
105
106 if (usesPortal) {
107 Array.from(_get(document, 'body.children', [])).forEach(function (child, i) {
108 if (child.contains(_this.wrapper.current)) {
109 return;
110 }
111
112 if (isActive) {
113 child.setAttribute('aria-hidden', 'true');
114 return;
115 }
116
117 if (originalAriaHiddenValues[i]) {
118 child.setAttribute('aria-hidden', originalAriaHiddenValues[i]);
119 return;
120 }
121
122 child.removeAttribute('aria-hidden');
123 });
124 }
125 }
126 });
127
128 __chunk_1._defineProperty(__chunk_1._assertThisInitialized(_this), "componentWillUnmount", function () {
129 _this.trap.deactivate();
130 });
131
132 __chunk_1._defineProperty(__chunk_1._assertThisInitialized(_this), "render", function () {
133 var children = _this.props.children;
134 return React.createElement("div", {
135 ref: _this.wrapper
136 }, children({
137 fallbackFocusRef: _this.fallbackFocus,
138 initialFocusRef: _this.initialFocus
139 }));
140 });
141
142 return _this;
143 }
144
145 return TrapFocus;
146}(React.Component);
147
148__chunk_1._defineProperty(TrapFocus, "defaultProps", {
149 isActive: false,
150 usesPortal: false
151});
152
153exports.TrapFocus = TrapFocus;