@instructure/ui-focusable 8.25.1-snapshot-10 → 8.25.1-snapshot-13

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
@@ -3,7 +3,7 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- ## [8.25.1-snapshot-10](https://github.com/instructure/instructure-ui/compare/v8.25.0...v8.25.1-snapshot-10) (2022-06-20)
6
+ ## [8.25.1-snapshot-13](https://github.com/instructure/instructure-ui/compare/v8.25.0...v8.25.1-snapshot-13) (2022-06-22)
7
7
 
8
8
  **Note:** Version bump only for package @instructure/ui-focusable
9
9
 
@@ -34,34 +34,40 @@ category: components/utilities
34
34
  @tsProps
35
35
  **/
36
36
  class Focusable extends Component {
37
- static displayName = "Focusable";
38
- static propTypes = propTypes;
39
- static allowedProps = allowedProps;
40
- static defaultProps = {
41
- children: null
42
- };
43
- static inputTypes = {
44
- text: true,
45
- search: true,
46
- url: true,
47
- tel: true,
48
- email: true,
49
- password: true,
50
- number: true,
51
- date: true,
52
- month: true,
53
- week: true,
54
- time: true,
55
- datetime: true,
56
- 'datetime-local': true
57
- };
58
- _focusListener = null;
59
- _blurListener = null;
60
- _inputModeListener = null;
61
- state = {
62
- focused: false,
63
- focusable: void 0
64
- };
37
+ constructor() {
38
+ super(...arguments);
39
+ this._focusListener = null;
40
+ this._blurListener = null;
41
+ this._inputModeListener = null;
42
+ this.state = {
43
+ focused: false,
44
+ focusable: void 0
45
+ };
46
+
47
+ this.handleInputModeChange = () => {
48
+ this.forceUpdate();
49
+ };
50
+
51
+ this.handleFocus = () => {
52
+ this.removeFocusListener();
53
+ this.setState({
54
+ focused: true
55
+ });
56
+ };
57
+
58
+ this.handleBlur = () => {
59
+ this.removeBlurListener();
60
+ this.setState({
61
+ focused: false
62
+ });
63
+ };
64
+
65
+ this.ref = null;
66
+
67
+ this.attachRef = el => {
68
+ this.ref = el;
69
+ };
70
+ }
65
71
 
66
72
  componentDidMount() {
67
73
  const focusable = this.focusable,
@@ -155,22 +161,6 @@ class Focusable extends Component {
155
161
  }
156
162
  }
157
163
 
158
- handleInputModeChange = () => {
159
- this.forceUpdate();
160
- };
161
- handleFocus = () => {
162
- this.removeFocusListener();
163
- this.setState({
164
- focused: true
165
- });
166
- };
167
- handleBlur = () => {
168
- this.removeBlurListener();
169
- this.setState({
170
- focused: false
171
- });
172
- };
173
-
174
164
  get focused() {
175
165
  return containsActiveElement(this);
176
166
  }
@@ -203,11 +193,6 @@ class Focusable extends Component {
203
193
  }
204
194
  }
205
195
 
206
- ref = null;
207
- attachRef = el => {
208
- this.ref = el;
209
- };
210
-
211
196
  isFocusVisible(focused, focusable) {
212
197
  if (!focusable || !focused) return false; // always show focus for keyboard input mode
213
198
 
@@ -258,5 +243,26 @@ class Focusable extends Component {
258
243
 
259
244
  }
260
245
 
246
+ Focusable.displayName = "Focusable";
247
+ Focusable.propTypes = propTypes;
248
+ Focusable.allowedProps = allowedProps;
249
+ Focusable.defaultProps = {
250
+ children: null
251
+ };
252
+ Focusable.inputTypes = {
253
+ text: true,
254
+ search: true,
255
+ url: true,
256
+ tel: true,
257
+ email: true,
258
+ password: true,
259
+ number: true,
260
+ date: true,
261
+ month: true,
262
+ week: true,
263
+ time: true,
264
+ datetime: true,
265
+ 'datetime-local': true
266
+ };
261
267
  export default Focusable;
262
268
  export { Focusable };
@@ -52,34 +52,40 @@ category: components/utilities
52
52
  @tsProps
53
53
  **/
54
54
  class Focusable extends _react.Component {
55
- static displayName = "Focusable";
56
- static propTypes = _props.propTypes;
57
- static allowedProps = _props.allowedProps;
58
- static defaultProps = {
59
- children: null
60
- };
61
- static inputTypes = {
62
- text: true,
63
- search: true,
64
- url: true,
65
- tel: true,
66
- email: true,
67
- password: true,
68
- number: true,
69
- date: true,
70
- month: true,
71
- week: true,
72
- time: true,
73
- datetime: true,
74
- 'datetime-local': true
75
- };
76
- _focusListener = null;
77
- _blurListener = null;
78
- _inputModeListener = null;
79
- state = {
80
- focused: false,
81
- focusable: void 0
82
- };
55
+ constructor() {
56
+ super(...arguments);
57
+ this._focusListener = null;
58
+ this._blurListener = null;
59
+ this._inputModeListener = null;
60
+ this.state = {
61
+ focused: false,
62
+ focusable: void 0
63
+ };
64
+
65
+ this.handleInputModeChange = () => {
66
+ this.forceUpdate();
67
+ };
68
+
69
+ this.handleFocus = () => {
70
+ this.removeFocusListener();
71
+ this.setState({
72
+ focused: true
73
+ });
74
+ };
75
+
76
+ this.handleBlur = () => {
77
+ this.removeBlurListener();
78
+ this.setState({
79
+ focused: false
80
+ });
81
+ };
82
+
83
+ this.ref = null;
84
+
85
+ this.attachRef = el => {
86
+ this.ref = el;
87
+ };
88
+ }
83
89
 
84
90
  componentDidMount() {
85
91
  const focusable = this.focusable,
@@ -173,22 +179,6 @@ class Focusable extends _react.Component {
173
179
  }
174
180
  }
175
181
 
176
- handleInputModeChange = () => {
177
- this.forceUpdate();
178
- };
179
- handleFocus = () => {
180
- this.removeFocusListener();
181
- this.setState({
182
- focused: true
183
- });
184
- };
185
- handleBlur = () => {
186
- this.removeBlurListener();
187
- this.setState({
188
- focused: false
189
- });
190
- };
191
-
192
182
  get focused() {
193
183
  return (0, _containsActiveElement.containsActiveElement)(this);
194
184
  }
@@ -221,11 +211,6 @@ class Focusable extends _react.Component {
221
211
  }
222
212
  }
223
213
 
224
- ref = null;
225
- attachRef = el => {
226
- this.ref = el;
227
- };
228
-
229
214
  isFocusVisible(focused, focusable) {
230
215
  if (!focusable || !focused) return false; // always show focus for keyboard input mode
231
216
 
@@ -277,5 +262,26 @@ class Focusable extends _react.Component {
277
262
  }
278
263
 
279
264
  exports.Focusable = Focusable;
265
+ Focusable.displayName = "Focusable";
266
+ Focusable.propTypes = _props.propTypes;
267
+ Focusable.allowedProps = _props.allowedProps;
268
+ Focusable.defaultProps = {
269
+ children: null
270
+ };
271
+ Focusable.inputTypes = {
272
+ text: true,
273
+ search: true,
274
+ url: true,
275
+ tel: true,
276
+ email: true,
277
+ password: true,
278
+ number: true,
279
+ date: true,
280
+ month: true,
281
+ week: true,
282
+ time: true,
283
+ datetime: true,
284
+ 'datetime-local': true
285
+ };
280
286
  var _default = Focusable;
281
287
  exports.default = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-focusable",
3
- "version": "8.25.1-snapshot-10",
3
+ "version": "8.25.1-snapshot-13",
4
4
  "description": "A utility used to identify when an element receives focus.",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -23,16 +23,16 @@
23
23
  },
24
24
  "license": "MIT",
25
25
  "devDependencies": {
26
- "@instructure/ui-babel-preset": "8.25.1-snapshot-10",
27
- "@instructure/ui-test-utils": "8.25.1-snapshot-10"
26
+ "@instructure/ui-babel-preset": "8.25.1-snapshot-13",
27
+ "@instructure/ui-test-utils": "8.25.1-snapshot-13"
28
28
  },
29
29
  "dependencies": {
30
30
  "@babel/runtime": "^7.13.10",
31
- "@instructure/console": "8.25.1-snapshot-10",
32
- "@instructure/ui-dom-utils": "8.25.1-snapshot-10",
33
- "@instructure/ui-react-utils": "8.25.1-snapshot-10",
34
- "@instructure/ui-utils": "8.25.1-snapshot-10",
35
- "@instructure/ui-view": "8.25.1-snapshot-10",
31
+ "@instructure/console": "8.25.1-snapshot-13",
32
+ "@instructure/ui-dom-utils": "8.25.1-snapshot-13",
33
+ "@instructure/ui-react-utils": "8.25.1-snapshot-13",
34
+ "@instructure/ui-utils": "8.25.1-snapshot-13",
35
+ "@instructure/ui-view": "8.25.1-snapshot-13",
36
36
  "prop-types": "^15"
37
37
  },
38
38
  "peerDependencies": {