diff --git a/docs/src/app/components/pages/components/lists.jsx b/docs/src/app/components/pages/components/lists.jsx index fd877f06fd4095..f14b5a39fb9c29 100644 --- a/docs/src/app/components/pages/components/lists.jsx +++ b/docs/src/app/components/pages/components/lists.jsx @@ -215,6 +215,12 @@ This is automatically disabled if leftCheckbox or rightToggle is set.`, desc: 'This is the block element that contains the primary text. If a string is passed in, a div ' + 'tag will be rendered.', }, + { + name: 'primaryTogglesNestedList', + type: 'bool', + header: 'default: false', + desc: 'If provided, tapping on the primary text of the item toggles the nested list.', + }, { name: 'rightAvatar', type: 'element', @@ -481,6 +487,7 @@ import ListItem from 'material-ui/lib/lists/list-item'; primaryText="Inbox" leftIcon={} initiallyOpen={true} + primaryTogglesNestedList={true} nestedItems={[ } />, {}, onNestedListToggle: () => {}, onTouchStart: () => {}, + primaryTogglesNestedList: false, secondaryTextLines: 1, }; }, @@ -123,6 +125,7 @@ const ListItem = React.createClass({ rightIconButton, rightToggle, primaryText, + primaryTogglesNestedList, secondaryText, secondaryTextLines, style, @@ -360,7 +363,7 @@ const ListItem = React.createClass({ onMouseLeave={this._handleMouseLeave} onMouseEnter={this._handleMouseEnter} onTouchStart={this._handleTouchStart} - onTouchTap={onTouchTap} + onTouchTap={primaryTogglesNestedList ? this._handleNestedListToggle : onTouchTap} ref="enhancedButton" style={this.mergeStyles(styles.root, style)}>