From 7723704f793eb444b24ee8b9d0a0eb2260b991c0 Mon Sep 17 00:00:00 2001
From: Benjamin Canac <canacb1@gmail.com>
Date: Tue, 1 Mar 2022 17:01:48 +0100
Subject: [PATCH] fix(Select): disable placeholder

---
 docs/pages/examples.vue                 | 5 +++--
 src/runtime/components/forms/Select.vue | 6 +++++-
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/docs/pages/examples.vue b/docs/pages/examples.vue
index 80b39847..8ab1c66a 100644
--- a/docs/pages/examples.vue
+++ b/docs/pages/examples.vue
@@ -175,7 +175,7 @@
         Card:
       </div>
 
-      <UCard body-class="flex" @submit.prevent="onSubmit">
+      <UCard body-class="flex">
         <div class="flex-1 px-4 py-5 sm:p-6 space-y-3">
           <UFormGroup label="Email" name="email" required>
             <UInput v-model="form.email" type="email" name="email" required icon="heroicons-outline:mail" />
@@ -190,6 +190,7 @@
               v-model="form.personId"
               name="person"
               :options="people"
+              placeholder="Select a person"
               text-attribute="name"
               value-attribute="id"
               icon="heroicons-outline:user"
@@ -253,7 +254,7 @@ const form = reactive({
   notification: 'email',
   notifications: [],
   terms: false,
-  personId: people[0].id,
+  personId: null,
   person: ref(people[0])
 })
 
diff --git a/src/runtime/components/forms/Select.vue b/src/runtime/components/forms/Select.vue
index 0bc8d6bc..aa08513a 100644
--- a/src/runtime/components/forms/Select.vue
+++ b/src/runtime/components/forms/Select.vue
@@ -3,6 +3,7 @@
     <select
       :id="name"
       :name="name"
+      :value="modelValue"
       :required="required"
       :disabled="disabled"
       :class="selectClass"
@@ -20,6 +21,7 @@
             :key="`${childOption[valueAttribute]}-${index}-${index2}`"
             :value="childOption[valueAttribute]"
             :selected="childOption[valueAttribute] === normalizedValue"
+            :disabled="option.disabled"
             v-text="childOption[textAttribute]"
           />
         </optgroup>
@@ -28,6 +30,7 @@
           :key="`${option[valueAttribute]}-${index}`"
           :value="option[valueAttribute]"
           :selected="option[valueAttribute] === normalizedValue"
+          :disabled="option.disabled"
           v-text="option[textAttribute]"
         />
       </template>
@@ -154,7 +157,8 @@ export default {
       return [
         {
           [props.valueAttribute]: null,
-          [props.textAttribute]: props.placeholder
+          [props.textAttribute]: props.placeholder,
+          disabled: true
         },
         ...normalizedOptions.value
       ]