Exposed updateAllSpatialLayouts (#81)

* Exposed updateAllSpatialLayouts

* typo

Author: guilleccc

CHANGELOG.md

@@ -4,6 +4,10 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [2.12.6]
+### Added
+- Added `updateAllSpatialLayouts` to allow updating components layout at any time that is required.
+
 ## [2.12.5]
 ### Added
 - Added `blockNavigationOut` to avoid focus out from the selected component.

README.md

@@ -420,6 +420,9 @@ This function pauses key listeners. Useful when you need to temporary disable na
 ### `resumeSpatialNavigation`: function
 This function resumes key listeners if it was paused with [pauseSpatialNavigation](#pauseSpatialNavigation-function)
 
+### `updateAllSpatialLayouts`: function
+This function update all components layouts. It can be used before setFocus is invoked, when the layouts have changed without being noticed by spatialNavigation service.
+
 ### Data Types
 
 ### `KeyDetails`: object

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@noriginmedia/react-spatial-navigation",
-  "version": "2.12.5",
+  "version": "2.12.6",
   "description": "HOC-based Spatial Navigation (key navigation) solution for React",
   "main": "dist/index.js",
   "files": [

package.json

@@ -309,6 +309,7 @@ class SpatialNavigation {
     this.pause = this.pause.bind(this);
     this.resume = this.resume.bind(this);
     this.setFocus = this.setFocus.bind(this);
+    this.updateAllLayouts = this.updateAllLayouts.bind(this);
     this.navigateByDirection = this.navigateByDirection.bind(this);
     this.init = this.init.bind(this);
     this.setKeyMap = this.setKeyMap.bind(this);

src/spatialNavigation.js

@@ -94,7 +94,8 @@ const withFocusable = ({
       onBecameBlurred(layout, rest, details);
     },
     pauseSpatialNavigation: () => SpatialNavigation.pause,
-    resumeSpatialNavigation: () => SpatialNavigation.resume
+    resumeSpatialNavigation: () => SpatialNavigation.resume,
+    updateAllSpatialLayouts: () => SpatialNavigation.updateAllLayouts
   }),
 
   lifecycle({