@noriginmedia/react-spatial-navigation - npm Package Compare versions

Comparing version 2.12.7 to 2.12.8

CHANGELOG.md

@@ -7,2 +7,6 @@ # Changelog
 
+## [2.12.8]
+### Added
+- onEnterRelease event triggered when the Enter is released from the focused item
+
 ## [2.12.7]
@@ -9,0 +13,0 @@ ### Added

dist/spatialNavigation.js

@@ -518,2 +518,6 @@ 'use strict';
           }
+
+          if (eventType === KEY_ENTER && _this3.focusKey) {
+            _this3.onEnterRelease();
+          }
         };
@@ -561,2 +565,23 @@
   }, {
+    key: 'onEnterRelease',
+    value: function onEnterRelease() {
+      var component = this.focusableComponents[this.focusKey];
+
+      /* Guard against last-focused component being unmounted at time of onEnterRelease (e.g due to UI fading out) */
+      if (!component) {
+        this.log('onEnterRelease', 'noComponent');
+
+        return;
+      }
+
+      /* Suppress onEnterRelease if the last-focused item happens to lose its 'focused' status. */
+      if (!component.focusable) {
+        this.log('onEnterRelease', 'componentNotFocusable');
+
+        return;
+      }
+
+      component.onEnterReleaseHandler && component.onEnterReleaseHandler();
+    }
+  }, {
     key: 'onArrowPress',
@@ -794,2 +819,3 @@ value: function onArrowPress() {
           onEnterPressHandler = _ref3.onEnterPressHandler,
+          onEnterReleaseHandler = _ref3.onEnterReleaseHandler,
           onArrowPressHandler = _ref3.onArrowPressHandler,
@@ -812,2 +838,3 @@ onBecameFocusedHandler = _ref3.onBecameFocusedHandler,
         onEnterPressHandler: onEnterPressHandler,
+        onEnterReleaseHandler: onEnterReleaseHandler,
         onArrowPressHandler: onArrowPressHandler,
@@ -814,0 +841,0 @@ onBecameFocusedHandler: onBecameFocusedHandler,

dist/withFocusable.js

@@ -152,7 +152,16 @@ 'use strict';
     },
-    onArrowPressHandler: function onArrowPressHandler(_ref5) {
-      var _ref5$onArrowPress = _ref5.onArrowPress,
-          onArrowPress = _ref5$onArrowPress === undefined ? _noop2.default : _ref5$onArrowPress,
-          rest = _objectWithoutProperties(_ref5, ['onArrowPress']);
+    onEnterReleaseHandler: function onEnterReleaseHandler(_ref5) {
+      var _ref5$onEnterRelease = _ref5.onEnterRelease,
+          onEnterRelease = _ref5$onEnterRelease === undefined ? _noop2.default : _ref5$onEnterRelease,
+          rest = _objectWithoutProperties(_ref5, ['onEnterRelease']);
 
+      return function () {
+        onEnterRelease(rest);
+      };
+    },
+    onArrowPressHandler: function onArrowPressHandler(_ref6) {
+      var _ref6$onArrowPress = _ref6.onArrowPress,
+          onArrowPress = _ref6$onArrowPress === undefined ? _noop2.default : _ref6$onArrowPress,
+          rest = _objectWithoutProperties(_ref6, ['onArrowPress']);
+
       return function (direction, details) {
@@ -162,6 +171,6 @@ return onArrowPress(direction, rest, details);
     },
-    onBecameFocusedHandler: function onBecameFocusedHandler(_ref6) {
-      var _ref6$onBecameFocused = _ref6.onBecameFocused,
-          onBecameFocused = _ref6$onBecameFocused === undefined ? _noop2.default : _ref6$onBecameFocused,
-          rest = _objectWithoutProperties(_ref6, ['onBecameFocused']);
+    onBecameFocusedHandler: function onBecameFocusedHandler(_ref7) {
+      var _ref7$onBecameFocused = _ref7.onBecameFocused,
+          onBecameFocused = _ref7$onBecameFocused === undefined ? _noop2.default : _ref7$onBecameFocused,
+          rest = _objectWithoutProperties(_ref7, ['onBecameFocused']);
 
@@ -172,6 +181,6 @@ return function (layout, details) {
     },
-    onBecameBlurredHandler: function onBecameBlurredHandler(_ref7) {
-      var _ref7$onBecameBlurred = _ref7.onBecameBlurred,
-          onBecameBlurred = _ref7$onBecameBlurred === undefined ? _noop2.default : _ref7$onBecameBlurred,
-          rest = _objectWithoutProperties(_ref7, ['onBecameBlurred']);
+    onBecameBlurredHandler: function onBecameBlurredHandler(_ref8) {
+      var _ref8$onBecameBlurred = _ref8.onBecameBlurred,
+          onBecameBlurred = _ref8$onBecameBlurred === undefined ? _noop2.default : _ref8$onBecameBlurred,
+          rest = _objectWithoutProperties(_ref8, ['onBecameBlurred']);
 
@@ -200,2 +209,3 @@ return function (layout, details) {
           onEnterPressHandler = _props.onEnterPressHandler,
+          onEnterReleaseHandler = _props.onEnterReleaseHandler,
           onArrowPressHandler = _props.onArrowPressHandler,
@@ -223,2 +233,3 @@ onBecameFocusedHandler = _props.onBecameFocusedHandler,
         onEnterPressHandler: onEnterPressHandler,
+        onEnterReleaseHandler: onEnterReleaseHandler,
         onArrowPressHandler: onArrowPressHandler,
@@ -263,5 +274,5 @@ onBecameFocusedHandler: onBecameFocusedHandler,
     }
-  }), _pure2.default, omitProps(['onBecameFocusedHandler', 'onBecameBlurredHandler', 'onEnterPressHandler', 'onArrowPressHandler', 'onUpdateFocus', 'onUpdateHasFocusedChild', 'forgetLastFocusedChild', 'trackChildren', 'autoRestoreFocus']));
+  }), _pure2.default, omitProps(['onBecameFocusedHandler', 'onBecameBlurredHandler', 'onEnterPressHandler', 'onEnterReleaseHandler', 'onArrowPressHandler', 'onUpdateFocus', 'onUpdateHasFocusedChild', 'forgetLastFocusedChild', 'trackChildren', 'autoRestoreFocus']));
 };
 
 exports.default = withFocusable;

package.json

 {
   "name": "@noriginmedia/react-spatial-navigation",
-  "version": "2.12.7",
+  "version": "2.12.8",
   "description": "HOC-based Spatial Navigation (key navigation) solution for React",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

@@ -287,2 +287,5 @@ # react-spatial-navigation
 
+### `onEnterRelease`: function
+Callback function that is called when the item is currently focused and Enter (OK) key is released.
+
 Payload:
@@ -294,3 +297,3 @@ 1. All the props passed to HOC is passed back to this callback. Useful to avoid creating callback functions during render.
 const onPress = ({prop1, prop2}, details) => {...};
-
+const onRelease = ({prop1, prop2}) => {...};
 ...
@@ -301,2 +304,3 @@ <FocusableItem
   onEnterPress={onPress}
+  onEnterRelease={onRelease}
 />
@@ -303,0 +307,0 @@ ...

No alert changes

Improved metrics

Total package byte prevSize

110379

increased by1.57%

Lines of code

1937

increased by1.63%

Number of lines in readme file

488

increased by0.83%

No dependency changes