search

unovue / radix-vue

Vue port of Radix UI Primitives. An open-source UI component library for building high-quality, accessible design systems and web apps.
https://radix-vue.com
MIT License
3.44k stars 212 forks source link

[Feature]: Add prop to render AccordionContent at all times, but just hide it visually #790

Open Bobakanoosh opened 6 months ago

Bobakanoosh commented 6 months ago

Describe the feature

I want to use Accordion, but i also want the text within AccordionContent to be parse-able by crawlers for SEO. Right now, if an AccordionItem is collapsed, the content is deleted from the dom, instead of just hiding it visually.

Additional information

zernonia commented 6 months ago

I believe this would be extended to Collapsbile component, as Accordion is using it. 👍🏻

MickL commented 5 days ago

Is there any ETA on this? I just finished implementing Radix Vue accordion and was about to deploy when I noticed that the item content is removed, and not hidden and there is no option to just hide it.

I want to use the accordion specifically for SEO reasons and need the content to be shown in DOM.

MickL commented 4 days ago

@zernonia I see you tagged this as v2. Anyway I feel like it will take too much time and effort for v2 until this gets resolved. It should be a quick fix if I am not wrong.

Here we need the slot either with v-if (default) or instead with v-show when the new prop is set to true: https://github.com/unovue/radix-vue/blob/main/packages/radix-vue/src/Collapsible/CollapsibleContent.vue#L101

MickL commented 3 days ago

I switched to https://github.com/smastrom/vue-collapsed

zernonia commented 3 days ago

We've released Reka UI Alpha 1 which included the fix. 😁

You may set unmountOnHide to false to hide the content visually when closed 😁