Refactor FlatSelectInput Component to Simplify Template Structure

- Removed the conditional rendering of the selected options slot in `FlatSelectInput.vue`, streamlining the template for better readability and maintainability. This change focuses on enhancing the component's clarity by eliminating unnecessary complexity in the markup.

These modifications aim to improve the overall structure of the FlatSelectInput component, making it easier to understand and work with in future development.
This commit is contained in:
Julien Nahum 2025-05-23 21:09:46 +02:00
parent 591d21d888
commit 2a92d9f24c
2 changed files with 6 additions and 24 deletions

View File

@ -24,24 +24,6 @@
<template
v-if="options && options.length"
>
<div v-if="multiple && compVal && compVal.length" class="px-3 py-2">
<slot
name="selected"
:option="selectedOptions"
:option-name="multiple ? getSelectedOptionsNames().join(', ') : getOptionName(selectedOptions)"
>
<div class="flex items-center truncate">
<span
class="truncate"
:class="[
theme.FlatSelectInput.fontSize,
]"
>
{{ getSelectedOptionsNames().join(', ') }}
</span>
</div>
</slot>
</div>
<div
v-for="(option) in options"
:key="option[optionKey]"

View File

@ -62,21 +62,21 @@ const options = ref([
{
name: 'required',
label: 'Required',
icon: 'ph:asterisk-bold',
selectedIcon: 'ph:asterisk-bold',
icon: 'i-ph-asterisk-bold',
selectedIcon: 'i-ph-asterisk-bold',
iconClass: (isActive) => isActive ? 'text-red-500' : '',
},
{
name: 'hidden',
label: 'Hidden',
icon: 'heroicons:eye',
selectedIcon: 'heroicons:eye-slash-solid',
icon: 'i-heroicons-eye',
selectedIcon: 'i-heroicons-eye-slash-solid',
},
{
name: 'disabled',
label: 'Disabled',
icon: 'heroicons:lock-open',
selectedIcon: 'heroicons:lock-closed-solid',
icon: 'i-heroicons-lock-open',
selectedIcon: 'i-heroicons-lock-closed-solid',
}
])