feat(Menu): support activeIndex strings

Semantic-Org · Jun 6, 2017 · bae3aaf · bae3aaf
1 parent c836275
commit bae3aaf
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 5 deletions.
diff --git a/src/collections/Menu/Menu.d.ts b/src/collections/Menu/Menu.d.ts
@@ -12,7 +12,7 @@ export interface MenuProps {
   as?: any;
 
   /** Index of the currently active item. */
-  activeIndex?: number;
+  activeIndex?: number | string;
 
   /** A menu may be attached to other content segments. */
   attached?: boolean | 'bottom' | 'top';
@@ -33,7 +33,7 @@ export interface MenuProps {
   compact?: boolean;
 
   /** Initial activeIndex value. */
-  defaultActiveIndex?: number;
+  defaultActiveIndex?: number | string;
 
   /** A menu can be fixed to a side of its context. */
   fixed?: 'left'| 'right'| 'bottom'| 'top';

diff --git a/src/collections/Menu/Menu.js b/src/collections/Menu/Menu.js
@@ -30,7 +30,10 @@ class Menu extends Component {
     as: customPropTypes.as,
 
     /** Index of the currently active item. */
-    activeIndex: PropTypes.number,
+    activeIndex: PropTypes.oneOfType([
+      PropTypes.number,
+      PropTypes.string,
+    ]),
 
     /** A menu may be attached to other content segments. */
     attached: PropTypes.oneOfType([
@@ -54,7 +57,10 @@ class Menu extends Component {
     compact: PropTypes.bool,
 
     /** Initial activeIndex value. */
-    defaultActiveIndex: PropTypes.number,
+    defaultActiveIndex: PropTypes.oneOfType([
+      PropTypes.number,
+      PropTypes.string,
+    ]),
 
     /** A menu can be fixed to a side of its context. */
     fixed: PropTypes.oneOf(['left', 'right', 'bottom', 'top']),
@@ -152,7 +158,7 @@ class Menu extends Component {
 
     return _.map(items, (item, index) => MenuItem.create(item, {
       defaultProps: {
-        active: activeIndex === index,
+        active: parseInt(activeIndex, 10) === index,
         index,
       },
       overrideProps: this.handleItemOverrides,

diff --git a/test/specs/collections/Menu/Menu-test.js b/test/specs/collections/Menu/Menu-test.js
@@ -71,6 +71,13 @@ describe('Menu', () => {
         .at(1)
         .should.have.prop('active', true)
     })
+
+    it('works as a string', () => {
+      mount(<Menu items={items} activeIndex={1} />)
+        .find('MenuItem')
+        .at(1)
+        .should.have.prop('active', true)
+    })
   })
 
   describe('items', () => {