Added inputType prop #108 #116

README.md

@@ -185,6 +185,7 @@ Join our [Discord channel](https://discord.gg/WhX2nG6GTQ) or [open an issue](htt
 | **placeholder** | `string` | `null` | The text that should be displayed before any option is selected. |
 | **multipleLabel** | `function` |  | A function that returns the label to be displayed for selected options when using `multiple` mode. It receives `value` as an argument. By default it renders `1 option selected` and `[n] options selected` based on `value` length. |
 | **disabled** | `boolean` | `false` | Whether the input should be disabled for the user (API can still be used programmatically). |
+| **inputType** | `string` | `text` | The `type` attribute of search input. |
 | **max** | `number` | `-1` | The maximum number of options that **can be selected** when using `multiple` or `tags` mode. If `-1` the number of options won't be limited. |
 | **limit** | `number` | `-1` | The maximum number of options that **should be displayed**. If `-1` the number of options won't be limited. |
 | **loading** | `boolean` | `false` | Whether a loading spinner should be shown. |

src/Multiselect.d.ts

@@ -46,6 +46,7 @@ declare class Multiselect extends Vue {
   groupOptions: string;
   groupHideEmpty: boolean;
   groupSelect: boolean;
+  inputType: string;
 
   $emit(eventName: 'change', e: {originalEvent: Event, value: any}): this;
   $emit(eventName: 'select', e: {originalEvent: Event, value: any, option: any}): this;

src/Multiselect.vue

@@ -12,7 +12,7 @@
     <!-- Search -->
     <template v-if="mode !== 'tags' && searchable && !disabled">
       <input
-        type="search"
+        :type="inputType"
         :modelValue="search"
         :value="search"
         :class="classList.search"
@@ -53,7 +53,7 @@
           <!-- Actual search input -->
           <input    
             v-if="searchable && !disabled"
-            type="search"
+            :type="inputType"
             :modelValue="search"
             :value="search"
             :class="classList.tagsSearch"
@@ -431,6 +431,11 @@
         required: false,
         default: true,
       },
+      inputType: {
+        type: String,
+        required: false,
+        default: 'text',
+      }
     },
     setup(props, context)
     {