How to implement multiline ToggleGroup?

[roigreenberg]

Hi.
I want to achieve something like in the picture.
It should be a general component that can have different items every time.

I tried to use ToggleGroup, but when I set many items, I get it all in 1 long line.
How can I make it so it will take just the container width, and start a new line when needed?

[sadeghbarati]

Hi

ToggleGroup uses flex class, if you want to have multiline ToggleGroup without flex-wrap you can use grid grid-cols-3 classes on the ToggleGroup component

https://stackblitz.com/edit/uq6gah?file=src%2FApp.vue

[roigreenberg]

Apparently, flex-wrap seems to do the job :)