Commit b31425de authored by Mickaël Bourgier's avatar Mickaël Bourgier
Browse files

[ListItem] Make `clickable` optional when `onClick` is defined

parent 23fa4a23
......@@ -18,6 +18,8 @@
- **[CssBaseline]** Add "cursor" feature (!7 by @chapa)
- **[CssBaseline]** Add "overflow" feature (!8 by @chapa)
- **[CssBaseline]** Add "text" feature (!6 by @chapa)
- **[ListItem]** Make the `clickable` prop optional if `onClick` is defined (!9
by @chapa)
## v1.2.0 (August 27, 2019) and below
......
......@@ -43,20 +43,10 @@ export const Topbar = () => (
export const Sidemenu = withCloseSidemenu(({ closeSidemenu }) => (
<List component='div'>
<ListItem
component={Link}
to={routes.home}
onClick={closeSidemenu}
clickable
>
<ListItem component={Link} to={routes.home} onClick={closeSidemenu}>
Accueil
</ListItem>
<ListItem
component={Link}
to={routes.contributing}
onClick={closeSidemenu}
clickable
>
<ListItem component={Link} to={routes.contributing} onClick={closeSidemenu}>
Contribution
</ListItem>
<ListItem component='div'>Personnalisation</ListItem>
......
......@@ -54,7 +54,6 @@ export const ComponentsSidemenu = withCloseSidemenu(({ closeSidemenu }) => (
component={Link}
to={routes[component]}
onClick={closeSidemenu}
clickable
>
{component}
</ListItem>
......
......@@ -28,20 +28,10 @@ export const CustomizationTopbar = () => (
export const CustomizationSidemenu = withCloseSidemenu(({ closeSidemenu }) => (
<List component='div'>
<ListItem
component={Link}
to={routes.themes}
onClick={closeSidemenu}
clickable
>
<ListItem component={Link} to={routes.themes} onClick={closeSidemenu}>
Thèmes
</ListItem>
<ListItem
component={Link}
to={routes.defaultTheme}
onClick={closeSidemenu}
clickable
>
<ListItem component={Link} to={routes.defaultTheme} onClick={closeSidemenu}>
Thème par défaut
</ListItem>
</List>
......
......@@ -50,7 +50,7 @@ class NestedList extends Component {
Un deuxième élément avec une icône
</ListItemText>
</ListItem>
<ListItem clickable onClick={this.toggleCollapse}>
<ListItem onClick={this.toggleCollapse}>
<ListItemText>Un troisième clickable</ListItemText>
<ListItemIcon
className={classNames(classes.icon, {
......
......@@ -23,7 +23,7 @@ const ListItem = props => {
const {
classes,
className,
clickable,
clickable: clickableProp,
component = 'li',
disabled,
listContext,
......@@ -65,6 +65,9 @@ const ListItem = props => {
)} + 1px)`;
}
const clickable =
clickableProp === undefined ? Boolean(onClick) : clickableProp;
return (
<Box
className={classNames(
......@@ -80,7 +83,7 @@ const ListItem = props => {
component={component}
disabled={disabled}
muted={muted}
onClick={clickable && onClick ? handleClick : undefined}
onClick={clickable ? handleClick : undefined}
interactive={clickable}
variant={variant}
{...otherProps}
......@@ -183,9 +186,7 @@ ListItem.propTypes = {
};
ListItem.defaultProps = {
component: 'li',
clickable: false,
onClick: () => {}
component: 'li'
};
export default withListContext(
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment