svelte-material-ui icon indicating copy to clipboard operation
svelte-material-ui copied to clipboard

Add resetTextWhenSelected to Autocomplete

Open edu-rosado opened this issue 3 years ago • 1 comments

Hi!

I have added a new prop to Autocomplete, it allows for the component to act as a field to append elements to a list. Her's a link with a minimal demo: https://streamable.com/0vwsjo

It satisfies my use case, and maybe it's also useful for the community, hence the pull request. Initialy I tried to do it all inside the $: if (!combobox && previousValue !== value) block but text got overwritten after that, so I ended up setting text in the $: if (previousText !== text) block.

I hope you like it and thank you for this nice library

edu-rosado avatar Aug 11 '22 12:08 edu-rosado

I have made some modifications to improve the behavior of the Menu. For this I have binded the open variable in Menu and Autocomplete (bind:open={menuOpen), currently the variables ar enot binded and so they may decouple and misbehave. I have also created an event fired from Menu to detect a programatic close in Autocomplete and act accordingly. This changes are a little bit more involved than the original pr, so you may prefer not to implement them, however I think it is good to being able to use Autocomplete to insert into a list. As a summary of the feature: when you use resetTextWhenSelected the text will reset after a selection and the menu will remain visible for you to choose more if desired. When losing focus, the menu goes away.

I attach a demo showing the behavior with and without resetTextWhenSelected https://streamable.com/wuqt9f

Cheers.

edu-rosado avatar Aug 12 '22 15:08 edu-rosado

I like this idea, but I think we could make it even more general. I'm thinking something along the lines of closeOnSelection={false}.

hperrin avatar Apr 03 '23 18:04 hperrin

I was able to accomplish this by making the SMUIAutocomplete:selected event cancelable.

hperrin avatar Apr 03 '23 19:04 hperrin