diff --git a/src/collections/Menu/Menu.d.ts b/src/collections/Menu/Menu.d.ts index bf0ac7fcca..8d7e8b499e 100644 --- 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 index 05b5492f94..b5d2912853 100644 --- 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 index 45cfaa7de2..f4c329e0b1 100644 --- 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() + .find('MenuItem') + .at(1) + .should.have.prop('active', true) + }) }) describe('items', () => {