NavigationMenu: Option to enable collapsible with collapsed prop

[baedlowi]

Description

Is there any chance we can get option to enable/disable collapsible when collapsed prop is true. v3.0.0-alpha.13 'fixed' NavigationMenu: disable collapsible with collapsed prop, i used nuxt ui since v3.0.0-alpha.12 and thought the collapsible when collapsed was feature.

Additional context

No response

[benjamincanac]

Would you mind being a bit more specific? 🤔

[baedlowi]

Add props to enable submenu expansion when in collapsed mode.

Rightnow (alpha 13):

Screencast.from.2025-02-19.18-30-07.mp4

Before alpha 13:

Screencast.from.2025-02-19.18-28-46.mp4

If the intended behaviour is v-alpha13, maybe add a prop to enable behaviour like before alpha13 for additional enhancement

[benjamincanac]

Oh I see, I actually disabled it on purpose in 07e1b4f.

I thought it didn't have much sense to have a collapsible displaying children when the collapsed prop is enabled. Maybe you can just change the items based on the collapsed prop and put them at the root?

[toooni]

Wouldn't it make sense to use DropdownMenu or a custom Popover here? In my opinion it doesn't make much sense to have a parent which is a link when collapsed, and just an "opener" for the children when expanded.

[benjamincanac]

So in latest commit 2be60cd, I reverted 07e1b4f and introduced a collapsible field in items instead.

To summarize, by default in vertical orientation an item with children will act as a collapsible, you can set collapsible: false so the trigger can be a link and don't activate the collapsible and set open: true for example to force its open state. All of this independently of the collapsed prop to give more flexibility.

[manuel-84]

the way you implemented collapsible is hiding the trailing arrow and user don't know if there are children

[benjamincanac]

That's kind of the point, if the item is not collapsible then there should be no arrow since it cannot be open. You can programmatically control whether its open or not though.

[manuel-84]

actually i'm using collapsible: false to avoid the problem of losing the link on click, and they open/close automatically, but i had to manually re-add the trailing icon

[benjamincanac]

For your information, I just reverted the collapsible field in 3c78e2f as it wasn't really usable and it also introduced a breaking change where children were displayed even without icons.

We'll implement this as described in #4186 instead.