Skip to content
This repository was archived by the owner on May 5, 2023. It is now read-only.

Commit 737dec0

Browse files
authored
added autoRestoreFocus prop (#63)
* added autoRestoreFocus prop * changes from review
1 parent 43a6b34 commit 737dec0

5 files changed

Lines changed: 23 additions & 5 deletions

File tree

CHANGELOG.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,9 @@ All notable changes to this project will be documented in this file.
33

44
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
55
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
6+
## [2.12.0]
7+
### Changed
8+
- added `autoRestoreFocus` prop to control whether parent component should restore focus on any available child when a currently focused child component is unmounted.
69

710
## [2.11.0]
811
### Changed

README.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,7 @@ const ParentComponent = (props) => (<View>
8787
onArrowPress={props.onArrowPress}
8888
onBecameFocused={props.onItemFocused}
8989
onBecameBlurred={props.onItemBlurred}
90+
autoRestoreFocus={false}
9091
/>
9192
...
9293
</View>);
@@ -236,6 +237,11 @@ Determine whether this component should not remember the last focused child comp
236237
* **false (default)**
237238
* **true**
238239

240+
##### `autoRestoreFocus`: boolean
241+
To determine whether parent component should focus the first available child component when currently focused child is unmounted.
242+
* **true (default)**
243+
* **false**
244+
239245
## Props that can be applied to HOC
240246
All these props are optional.
241247

@@ -245,6 +251,9 @@ Same as in [config](#config).
245251
### `forgetLastFocusedChild`: boolean
246252
Same as in [config](#config).
247253

254+
### `autoRestoreFocus`: boolean
255+
Same as in [config](#config).
256+
248257
### `focusable`: boolean
249258
Determine whether this component should be focusable (in other words, whether it's *currently* participating in the spatial navigation tree). This allows a focusable component to be ignored as a navigation target despite being mounted (e.g. due to being off-screen, hidden, or temporarily disabled).
250259

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@noriginmedia/react-spatial-navigation",
3-
"version": "2.11.0",
3+
"version": "2.12.0",
44
"description": "HOC-based Spatial Navigation (key navigation) solution for React",
55
"main": "dist/index.js",
66
"files": [

src/spatialNavigation.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -717,6 +717,7 @@ class SpatialNavigation {
717717
onUpdateFocus,
718718
onUpdateHasFocusedChild,
719719
preferredChildFocusKey,
720+
autoRestoreFocus,
720721
focusable
721722
}) {
722723
this.focusableComponents[focusKey] = {
@@ -734,6 +735,7 @@ class SpatialNavigation {
734735
lastFocusedChildKey: null,
735736
preferredChildFocusKey,
736737
focusable,
738+
autoRestoreFocus,
737739
layout: {
738740
x: 0,
739741
y: 0,
@@ -788,7 +790,7 @@ class SpatialNavigation {
788790
/**
789791
* If the component was also focused at this time, focus another one
790792
*/
791-
if (isFocused) {
793+
if (isFocused && parentComponent.autoRestoreFocus) {
792794
this.setFocus(parentFocusKey);
793795
}
794796
}

src/withFocusable.js

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,8 @@ const omitProps = (keys) => mapProps((props) => omit(props, keys));
1818

1919
const withFocusable = ({
2020
forgetLastFocusedChild: configForgetLastFocusedChild = false,
21-
trackChildren: configTrackChildren = false
21+
trackChildren: configTrackChildren = false,
22+
autoRestoreFocus: configAutoRestoreFocus
2223
} = {}) => compose(
2324
getContext({
2425
/**
@@ -109,7 +110,8 @@ const withFocusable = ({
109110
onUpdateFocus,
110111
onUpdateHasFocusedChild,
111112
trackChildren,
112-
focusable = true
113+
focusable = true,
114+
autoRestoreFocus = true
113115
} = this.props;
114116

115117
const node = SpatialNavigation.isNativeMode() ? this : findDOMNode(this);
@@ -127,6 +129,7 @@ const withFocusable = ({
127129
onUpdateHasFocusedChild,
128130
forgetLastFocusedChild: (configForgetLastFocusedChild || forgetLastFocusedChild),
129131
trackChildren: (configTrackChildren || trackChildren),
132+
autoRestoreFocus: configAutoRestoreFocus !== undefined ? configAutoRestoreFocus : autoRestoreFocus,
130133
focusable
131134
});
132135
},
@@ -164,7 +167,8 @@ const withFocusable = ({
164167
'onUpdateFocus',
165168
'onUpdateHasFocusedChild',
166169
'forgetLastFocusedChild',
167-
'trackChildren'
170+
'trackChildren',
171+
'autoRestoreFocus'
168172
])
169173
);
170174

0 commit comments

Comments
 (0)