nuxt / ui

A UI Library for Modern Web Apps, powered by Vue & Tailwind CSS.
https://ui.nuxt.com
MIT License
3.4k stars 374 forks source link

[Tabs] Disable content prop #1709

Open emavitta opened 3 weeks ago

emavitta commented 3 weeks ago

Description

I'm wondering if it could be possible to disable the content in the tabs component. I'm using it with the @click to do other stuff on the page and i don't need the content. I could rebuild it with the headlessui component, but it could be a simple yet usefull feature.

Additional context

No response

benjamincanac commented 3 weeks ago

You can already use the Tabs without content, visually the only thing you'd need to change is override the wrapper to remove the spacing:

<UTabs v-model="selected" :items="items" :ui="{ wrapper: '' }" />
emavitta commented 3 weeks ago

Thanks for your reply; i wasn't clearly enough, but i was suggesting a way to completely revmove the markup of the content, not only visually hiding it.

Maybe it's just i am a little bit too concerned about semantic and so on, but i do think it would be better to completely remove the content markup with something like this;

`

... ` where contentVisibile is a prop you can pass to the component (true by defult). Does it make sense to you?
emavitta commented 1 week ago

May i suggest a pr as an example?

benjamincanac commented 1 week ago

Sure! I was just wondering about the prop naming, we can discuss that in the PR review 😊