I am using Svelecte in an App. When I select multiple items and the associated template is rendered, the <select> options in the template become blank after each item is selected in Svelecte. Initially, I will see the first item's option showing but when adding addional items, the previous rendered <select> become blank (the option).
Here is a REPL showing the issue.
My Svelecte is set up like this:
<Svelectebind:this={svelecte} inputId="drugs"name="drugSelection"multiplebind:value={selectedItems}valueField="name"labelField="name"placeholder="Select Drugs to Add" clearablecloseAfterSelect = {false}collapseSelection ={false}valueAsObject={true}{options}on:change={handlekg}></Svelecte>and my (simplified) select in the template
{#each selectedItems as item, index}<div id="common{item.value}" class="flex flex-wrap py-1 md:py-1 eachdrug eachdrugAB commonDrug dark:border-gray-600 mb-1 md:mx-1 print:mb-0 print:py-0 print:shadow-none" data-id="{item.value}"><span class="font-bold text-base print:text-sm searchme"> {item.name} </span>{#if !item.concSelect || item.concSelect.length === 1}<div class="inline-flex ml-4 relative px-2 font-bold float-right pl-2 md:pl-0 md:pr-6"> {item.concentration} {item.perml}</div> {:else if !item.concSelect || item.concSelect.length > 1}<div class="ml-4 inline-flex relative px-2 font-bold md:float-right"><select bind:value={item.concs} class="conc dark:text-white dark:bg-black form-select blocked transition duration-150 ease-in-out sm:text-sm sm:leading-5 font-bold print:px-1 print:pr-2 print:border-none print:shadow-none print:bg-white print:text-black" name="select-item.calc{item.value}">{#each item.concSelect as conc}{#if conc.selected}<option data-perml={conc.perml} value={conc.value} selected>{conc.name} {conc.perml}</option>{:else}<option data-perml={conc.perml} value={conc.value}>{conc.name}{conc.perml}</option>{/if}{/each}</select></div>{/if}</div>{/each} Any help would be appreciated!