fix(Item): actually make content a shorthand prop for ItemContent

src/views/Item/Item.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react'
 
-import { SemanticShorthandContent, SemanticShorthandItem } from '../../generic'
-import ItemContent from './ItemContent'
+import { SemanticShorthandItem } from '../../generic'
+import ItemContent, { ItemContentProps } from './ItemContent'
 import ItemDescription, { ItemDescriptionProps } from './ItemDescription'
 import ItemExtra, { ItemExtraProps } from './ItemExtra'
 import ItemGroup from './ItemGroup'
@@ -24,7 +24,7 @@ export interface StrictItemProps {
   className?: string
 
   /** Shorthand for ItemContent component. */
-  content?: SemanticShorthandContent
+  content?: SemanticShorthandItem<ItemContentProps>
 
   /** Shorthand for ItemDescription component. */
   description?: SemanticShorthandItem<ItemDescriptionProps>

src/views/Item/Item.js

@@ -1,4 +1,5 @@
 import cx from 'clsx'
+import _ from 'lodash'
 import PropTypes from 'prop-types'
 import React from 'react'
 
@@ -29,17 +30,22 @@ function Item(props) {
     )
   }
 
+  let contentShorthandValue = content
+  if (
+    contentShorthandValue === undefined &&
+    [description, extra, header, meta].some((prop) => !_.isNil(prop))
+  ) {
+    contentShorthandValue = {}
+  }
+
   return (
     <ElementType {...rest} className={classes}>
       {ItemImage.create(image, { autoGenerateKey: false })}
 
-      <ItemContent
-        content={content}
-        description={description}
-        extra={extra}
-        header={header}
-        meta={meta}
-      />
+      {ItemContent.create(contentShorthandValue, {
+        autoGenerateKey: false,
+        overrideProps: { description, extra, header, meta },
+      })}
     </ElementType>
   )
 }
@@ -63,7 +69,7 @@ Item.propTypes = {
   className: PropTypes.string,
 
   /** Shorthand for ItemContent component. */
-  content: customPropTypes.contentShorthand,
+  content: customPropTypes.itemShorthand,
 
   /** Shorthand for ItemDescription component. */
   description: customPropTypes.itemShorthand,

src/views/Item/ItemContent.js

@@ -4,6 +4,7 @@ import React from 'react'
 
 import {
   childrenUtils,
+  createShorthandFactory,
   customPropTypes,
   getElementType,
   getUnhandledProps,
@@ -73,4 +74,6 @@ ItemContent.propTypes = {
   verticalAlign: PropTypes.oneOf(SUI.VERTICAL_ALIGNMENTS),
 }
 
+ItemContent.create = createShorthandFactory(ItemContent, (content) => ({ content }))
+
 export default ItemContent

test/specs/views/Item/Item-test.js

@@ -33,6 +33,13 @@ describe('Item', () => {
     mapValueToProps: (val) => ({ src: val }),
   })
 
+  common.implementsShorthandProp(Item, {
+    autoGenerateKey: false,
+    propKey: 'content',
+    ShorthandComponent: ItemContent,
+    mapValueToProps: (val) => ({ content: val }),
+  })
+
   describe('content prop', () => {
     it('renders ItemContent component', () => {
       shallow(<Item content={faker.hacker.phrase()} />).should.have.descendants('ItemContent')