diff --git a/src/collections/Menu/MenuItem.js b/src/collections/Menu/MenuItem.js
index 256808213a..351b2bce0e 100644
--- a/src/collections/Menu/MenuItem.js
+++ b/src/collections/Menu/MenuItem.js
@@ -11,6 +11,7 @@ import {
useKeyOnly,
useKeyOrValueAndKey,
} from '../../lib'
+import { createIcon } from '../../factories'
function MenuItem(props) {
const {
@@ -35,9 +36,18 @@ function MenuItem(props) {
}
const rest = getUnhandledProps(MenuItem, props)
+ if (children) {
+ return (
+
+ {children}
+
+ )
+ }
+
return (
- {children || content || _.startCase(name)}
+ {createIcon(icon)}
+ {content || _.startCase(name)}
)
}
diff --git a/test/specs/collections/Menu/MenuItem-test.js b/test/specs/collections/Menu/MenuItem-test.js
index 893570bb7e..ec350dd09e 100644
--- a/test/specs/collections/Menu/MenuItem-test.js
+++ b/test/specs/collections/Menu/MenuItem-test.js
@@ -7,6 +7,7 @@ import { sandbox } from 'test/utils'
describe('MenuItem', () => {
common.isConformant(MenuItem)
+ common.implementsIconProp(MenuItem)
common.propKeyOnlyToClassName(MenuItem, 'active')
common.propValueOnlyToClassName(MenuItem, 'color')
common.propKeyOrValueToClassName(MenuItem, 'fitted')