Empty values in createOption with trimmed value

[mathieutu]

Version

• Vue version: 3

Description

Hi, thanks for your work.
I'm trying to trim values that are created. However, if you only enter a space , we can avoid to create the option but not avoid to show and empty one in the list.

Ex: (spaces are in the search bar)

It would be great to be able to sanitize the search query to trim the value here directly.

Another solution would be to execute onCreate directly in createdOption, so we would filter it directly, and even allow to change the property (including label, when showed).

multiselect/src/composables/useOptions.js

Lines 210 to 225 in f8af61b

	const createdOption = computed(() => {
	if (createOption.value === false || !search.value) {
	return []
	}
	if (getOptionByTrackBy(search.value) !== -1) {
	return []
	}
	return [{
	[valueProp.value]: search.value,
	[trackBy.value[0]]: search.value,
	[label.value]: search.value,
	__CREATE__: true,
	}]
	})

Happy to create the PR if you want to.

Demo

https://jsfiddle.net/hvko13n0/2/

[mathieutu]

For now I patched the package with:

   const handleSearchInput = (e) => {
-    search.value = e.target.value;
+    search.value = e.target.value.trim();
   };

And it seems to work great.