It's interfering and annoying. autocomplete="false" should do the trick

Repro:

1. Type "mango" in the fruit list at https://svelte-autocomplete.surge.sh/
2. Backspace all characters
3. The results for "m" will remain visible.

The country example works better and resets to an unfiltered dropdown list, but maybe should also close the dropdown so it won't risk blocking other UI elements from the user.

i have added this library to my project but ever since its been failing to load ever since. Here is the error message .

[!] Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)
node_modules/svelte-autocomplete/src/index.html (1:0)
1: <svelte:window on:click="close()" />
^
2:

If you want to fetch results based on the input, where do you set the API endpoint? The demo page has this functionality but the source of the demo page is bundled and I don't see that site in a repo anywhere.

Thanks!

This is just what I needed - way better than trying to add some other solution loading as external js on the front end side.

I'm using the Async option, and got rid of the "data loading" as it loads from my site and the filesizes are pretty small.

Here is my version for anybody that may be able to glean something from it!
Autocomplete.txt

Hi, I tried to use your component just with the minimum requirement:

<AutoComplete class="input" name="fruits" items="{fruits}" minChar="1" />

But it fails at runtime:

h:function hydrate() {
			addListener(input, "input", input_input_handler);
			addListener(input, "input", input_handler);
			addListener(input, "focus", focus_handler);
			addListener(input, "blur", blur_handler);
			addListener(input, "keydown", keydown_handler);
			setAttribute(input, "type", "text");
			input.className = "{class} svelte-1yo2r3";
			setAttribute(input, "{name}", true);
			setAttribute(input, "{placeholder}", true);
			setAttribute(input, "{required}", true);
			setAttribute(input, "{disabled}", true);
			input.value = "{value || ''}";
			input.autocomplete = "{name}";
			addListener(li, "click", click_handler);
			li.className = "autocomplete-result{ i === arrowCounter ? ' is-active' : '' } svelte-1yo2r3";
			ul.className = "autocomplete-results{!isOpen ? ' hide-results' : ''} svelte-1yo2r3";
			if (!slot_content_default) {
				p.className = "fallback svelte-1yo2r3";
			}
			addListener(div, "click", click_handler_1);
			div.className = "autocomplete svelte-1yo2r3";
		},

Happens on the setAttribute(input, "{name}", true); line

I am using svelte 2.11 and parcel 1.9.7 with the svelte plugin 1.2.2

Hi - do you have the source code for http://svelte-autocomplete.surge.sh/ available anywhere?

The problem is when using key,value pairs, when I select a value, it places the "key" attribute's value into the input box.

I can't figure out why, or how to fix it.

In onchange check if value is in provided data list. If not, reset value (and provide visual feedback/error message?)

Extend current build script to output a custom element as well

• https://svelte.technology/guide#custom-elements
• https://github.com/sveltejs/template-custom-element