pstanoev / simple-svelte-autocomplete

Simple Autocomplete / typeahead component for Svelte
http://simple-svelte-autocomplete.surge.sh/
MIT License
464 stars 78 forks source link

Fixed some accessibility warnings #185

Closed azmeuk closed 1 year ago

azmeuk commented 1 year ago

The latest svelte versions print warnings where displaying those warnings:

(!) Plugin svelte: A11y: visible, non-interactive elements with an on:click event must be accompanied by an on:keydown, on:keyup, or on:keypress event.
src/SimpleAutocomplete.svelte
1146:             <div class="tags has-addons">
1147:               <span class="tag">{safeLabelFunction(tagItem)}</span>
1148:               <span class="tag is-delete" on:click|preventDefault={unselectItem(tagItem)} />
                    ^
1149:             </div>
1150:           </slot>
src/SimpleAutocomplete.svelte
1179:     />
1180:     {#if clearable}
1181:       <span on:click={clear} class="autocomplete-clear-button">{@html clearText}</span>
            ^
1182:     {/if}
1183:   </div>
src/SimpleAutocomplete.svelte
1192:       {#each filteredListItems as listItem, i}
1193:         {#if listItem && (maxItemsToShowInList <= 0 || i < maxItemsToShowInList)}
1194:           <div
                ^
1195:             class="autocomplete-list-item"
1196:             class:selected={i === highlightIndex}
src/SimpleAutocomplete.svelte
1231:       </div>
1232:     {:else if create}
1233:       <div class="autocomplete-list-item-create" on:click={selectItem}>
            ^
1234:         <slot name="create" {createText}>{createText}</slot>
1235:       </div>

This is fixed by this patch.

pstanoev commented 1 year ago

Looks good to me.

mbjedk commented 1 year ago

Looks good to me.

Dear pstanoev. Could you push a new version with this fix?

pstanoev commented 1 year ago

New version 2.5.1 on it's way.