From 4e0d23ed3470f79f5c6ab805a7f5edd39594c197 Mon Sep 17 00:00:00 2001
From: Benjamin Canac <canacb1@gmail.com>
Date: Tue, 15 Feb 2022 12:45:37 +0100
Subject: [PATCH] fix(SelectCustom): handle placeholder when value is null

---
 src/runtime/components/forms/SelectCustom.vue | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/runtime/components/forms/SelectCustom.vue b/src/runtime/components/forms/SelectCustom.vue
index e324be0e..4d2e978f 100644
--- a/src/runtime/components/forms/SelectCustom.vue
+++ b/src/runtime/components/forms/SelectCustom.vue
@@ -8,7 +8,8 @@
     <input :value="modelValue" :required="required" class="absolute inset-0 w-px opacity-0 cursor-default">
 
     <ListboxButton :class="selectCustomClass">
-      <span class="block truncate">{{ modelValue[textAttribute] }}</span>
+      <span v-if="modelValue && modelValue[textAttribute]" class="block truncate">{{ modelValue[textAttribute] }}</span>
+      <span v-else class="block truncate u-text-gray-400">{{ placeholder }}</span>
       <span :class="iconWrapperClass">
         <Icon name="heroicons-solid:selector" :class="iconClass" aria-hidden="true" />
       </span>
@@ -66,6 +67,10 @@ const props = defineProps({
     type: Boolean,
     default: false
   },
+  placeholder: {
+    type: String,
+    default: null
+  },
   size: {
     type: String,
     default: 'md',