Skip to content

Commit

Permalink
[@mantine/core] List: Remove extra span tag (#2146)
Browse files Browse the repository at this point in the history
By Removing the span we can now pass a div or any other JSX Element which can take the full width of the container the list is in.
Eg. I can put Text on the left side and have a button floated / flexed to the right side.
  • Loading branch information
glomyst committed Sep 19, 2022
1 parent 8c663f2 commit 2e0426b
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion src/mantine-core/src/List/ListItem/ListItem.tsx
Expand Up @@ -33,7 +33,7 @@ export function ListItem({ className, children, icon, ...others }: ListItemProps
>
<div className={classes.itemWrapper}>
{_icon && <span className={classes.itemIcon}>{_icon}</span>}
<span>{children}</span>
{children}
</div>
</Box>
);
Expand Down

1 comment on commit 2e0426b

@Manas-Nagelia
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here, this is the problem. Since this change is made, now each time I use a list, it overfills. For example from Mantine UI itself:
Screenshot 2022-11-01 at 7 58 35 PM

A workaround over this is just to re-add the tags in the list item.

Please sign in to comment.