Open
Description
I have an accordion module with a somewhat complex structure:
<section class="page-container" id="faq">
<h2 class="heading">{heading}</h2>
<div class="accordion">
{#each items as item, i (i)}
<div class="item article" class:active={activeItem === i}>
<button on:click={() => setActiveItem(i)}>
<Icon icon="material-symbols:expand-{ activeItem === i ? 'less' : 'more'}" style="color:var(--primary);" height=32 />
<h4 data-key="items[{i}].title">{item.title}</h4>
</button>
{#if activeItem === i}
<article data-key="items[{i}].description" class="description" transition:slide>{@html item.description.html}</article>
{/if}
<noscript>
<article class="description">{@html item.description.html}</article>
</noscript>
</div>
{/each}
</div>
</section>
When clicking in the description it adds it to the title every time.
Edit: removed video, you can use the json provided to recreate.