Feedback

vatesfr · Dec 11, 2024 · 96fd09c · 96fd09c
1 parent 7c14d16
commit 96fd09c
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 11 deletions.
diff --git a/@xen-orchestra/lite/src/stories/web-core/ui/input/ui-input.story.vue b/@xen-orchestra/lite/src/stories/web-core/ui/input/ui-input.story.vue
@@ -2,7 +2,7 @@
   <ComponentStory
     v-slot="{ properties, settings }"
     :params="[
-      model().type('string').preset(''),
+      model().type('string | number').preset(''),
       prop('accent').enum('info', 'warning', 'danger').required().preset('info').widget(),
       prop('type').enum('text', 'number', 'password').required().preset('text').widget(),
       prop('disabled').bool().widget(),

diff --git a/@xen-orchestra/web-core/lib/components/ui/input/UiInput.vue b/@xen-orchestra/web-core/lib/components/ui/input/UiInput.vue
@@ -6,7 +6,7 @@
     </UiLabel>
     <div>
       <VtsIcon :icon="iconBefore" accent="current" class="before" />
-      <input v-model.trim="modelValue" class="typo p1-regular input text-truncate" :type :disabled v-bind="attrs" />
+      <input v-model.trim="modelValue" class="typo p1-regular input text-ellipsis" :type :disabled v-bind="attrs" />
       <VtsIcon
         v-if="!attrs.disabled && modelValue && clearable"
         :icon="faXmark"
@@ -31,12 +31,12 @@ import { faXmark } from '@fortawesome/free-solid-svg-icons'
 import { computed, useAttrs } from 'vue'
 
 type InputTextAccent = 'info' | 'warning' | 'danger'
-type InputType = 'text' | 'number' | 'password'
+type InputType = 'text' | 'number' | 'password | search'
 
 defineOptions({
   inheritAttrs: false,
 })
-const props = defineProps<{
+const { accent } = defineProps<{
   type: InputType
   accent: InputTextAccent
   disabled?: boolean
@@ -56,7 +56,7 @@ const slots = defineSlots<{
 
 const attrs = useAttrs()
 
-const labelAccent = computed(() => (props.accent === 'info' ? 'neutral' : props.accent))
+const labelAccent = computed(() => (accent === 'info' ? 'neutral' : accent))
 </script>
 
 <style lang="postcss" scoped>
@@ -79,12 +79,6 @@ const labelAccent = computed(() => (props.accent === 'info' ? 'neutral' : props.
     padding-block: 0.8rem;
     padding-inline: 1.6rem;
 
-    &.text-truncate {
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
-
     &::placeholder {
       color: var(--color-neutral-txt-secondary);
     }