@@ -1742,8 +1742,8 @@ var SpatialNavigation = function (_Component) {
17421742 }
17431743 }
17441744 } , {
1745- key : 'componentWillUnount ' ,
1746- value : function componentWillUnount ( ) {
1745+ key : 'componentWillUnmount ' ,
1746+ value : function componentWillUnmount ( ) {
17471747 _spatial_navigation2 . default . uninit ( ) ;
17481748 }
17491749 } , {
@@ -1760,8 +1760,8 @@ var SpatialNavigation = function (_Component) {
17601760 return SpatialNavigation ;
17611761} ( _react . Component ) ;
17621762
1763- function getSectionSelectorFromId ( id ) {
1764- return 'section_ ' + id ;
1763+ function getSelector ( id ) {
1764+ return '. ' + id ;
17651765}
17661766
17671767/**
@@ -1843,7 +1843,7 @@ var Focusable = function (_Component2) {
18431843 value : function render ( ) {
18441844 var _this3 = this ;
18451845
1846- var classNames = [ this . context . focusableSectionId ? getSectionSelectorFromId ( this . context . focusableSectionId ) : config . focusableClassName ] ;
1846+ var classNames = [ this . context . focusableSectionId ? this . context . focusableSectionId : config . focusableClassName ] ;
18471847
18481848 if ( this . props . active ) {
18491849 classNames . push ( config . activeClassName ) ;
@@ -1867,11 +1867,9 @@ var Focusable = function (_Component2) {
18671867} ( _react . Component ) ;
18681868
18691869Focusable . contextTypes = {
1870- focusableSectionId : _propTypes2 . default . number
1870+ focusableSectionId : _propTypes2 . default . string
18711871} ;
18721872
1873- var sectionsIds = 1 ;
1874- 18751873/*
18761874* A Focusable Section can specify a behaviour before focusing an element.
18771875* I.e. selecting a default element, the first element or an active one.
@@ -1910,12 +1908,17 @@ var FocusableSection = function (_Component3) {
19101908 } , {
19111909 key : 'componentWillMount' ,
19121910 value : function componentWillMount ( ) {
1913- this . sectionId = sectionsIds ++ ;
1911+ this . sectionId = _spatial_navigation2 . default . add ( { } ) ;
1912+ }
1913+ } , {
1914+ key : 'componentWillUnmount' ,
1915+ value : function componentWillUnmount ( ) {
1916+ _spatial_navigation2 . default . remove ( this . sectionId ) ;
19141917 }
19151918 } , {
19161919 key : '_getSelector' ,
19171920 value : function _getSelector ( ) {
1918- return '.' + getSectionSelectorFromId ( this . sectionId ) ;
1921+ return getSelector ( this . sectionId ) ;
19191922 }
19201923 } , {
19211924 key : 'componentDidMount' ,
@@ -1931,8 +1934,7 @@ var FocusableSection = function (_Component3) {
19311934 defaultElement = this . _getSelector ( ) + ( '.' + config . activeClassName ) ;
19321935 }
19331936
1934- _spatial_navigation2 . default . add ( {
1935- id : this . sectionId ,
1937+ _spatial_navigation2 . default . set ( this . sectionId , {
19361938 selector : this . _getSelector ( ) ,
19371939 enterTo : enterTo ,
19381940 defaultElement : defaultElement
@@ -1953,7 +1955,7 @@ var FocusableSection = function (_Component3) {
19531955} ( _react . Component ) ;
19541956
19551957FocusableSection . childContextTypes = {
1956- focusableSectionId : _propTypes2 . default . number
1958+ focusableSectionId : _propTypes2 . default . string
19571959} ;
19581960
19591961exports . default = SpatialNavigation ;
0 commit comments