fix(ui) : checkbox internes de SelectCheckbox sans espace message réservé
Les options du dropdown (et le « tout sélectionner ») passaient reserveMessageSpace par défaut → chaque ligne réservait un min-h-[1rem] inutile, d'où le gros espacement. On force :reserve-message-space=false sur ces Checkbox internes. Retire aussi la carte de démo playground hors-sujet. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -168,36 +168,6 @@
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="rounded-lg border p-4 md:col-span-2">
|
|
||||||
<h2 class="mb-1 text-xl font-bold">Espace message : reserveMessageSpace</h2>
|
|
||||||
<p class="mb-4 text-sm text-m-muted">
|
|
||||||
A gauche : defaut (true) — la ligne message reste reservee sous le champ.
|
|
||||||
A droite : <code>:reserve-message-space="false"</code> — pas de reserve, le bloc suivant colle au champ.
|
|
||||||
</p>
|
|
||||||
<div class="grid grid-cols-1 gap-6 md:grid-cols-2">
|
|
||||||
<div>
|
|
||||||
<p class="mb-1 text-xs font-semibold">Defaut (reserve)</p>
|
|
||||||
<MalioSelectCheckbox
|
|
||||||
v-model="reserveDefaultValue"
|
|
||||||
:options="options"
|
|
||||||
label="Pays"
|
|
||||||
empty-option-label="Aucune selection"
|
|
||||||
/>
|
|
||||||
<div class="rounded bg-m-muted/20 p-2 text-xs">Bloc suivant</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<p class="mb-1 text-xs font-semibold">reserve-message-space = false</p>
|
|
||||||
<MalioSelectCheckbox
|
|
||||||
v-model="reserveOffValue"
|
|
||||||
:options="options"
|
|
||||||
label="Pays"
|
|
||||||
empty-option-label="Aucune selection"
|
|
||||||
:reserve-message-space="false"
|
|
||||||
/>
|
|
||||||
<div class="rounded bg-m-muted/20 p-2 text-xs">Bloc suivant</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -245,6 +215,4 @@ const longListValue = ref<Array<string | number>>([])
|
|||||||
const bottomValue = ref<Array<string | number>>([])
|
const bottomValue = ref<Array<string | number>>([])
|
||||||
const readonlyEmptyValue = ref<Array<string | number>>([])
|
const readonlyEmptyValue = ref<Array<string | number>>([])
|
||||||
const readonlyFilledValue = ref<Array<string | number>>(['fr'])
|
const readonlyFilledValue = ref<Array<string | number>>(['fr'])
|
||||||
const reserveDefaultValue = ref<Array<string | number>>([])
|
|
||||||
const reserveOffValue = ref<Array<string | number>>([])
|
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -184,6 +184,7 @@
|
|||||||
group-class="!mt-0"
|
group-class="!mt-0"
|
||||||
label-class="option-checkbox w-full cursor-pointer font-semibold"
|
label-class="option-checkbox w-full cursor-pointer font-semibold"
|
||||||
tabindex="-1"
|
tabindex="-1"
|
||||||
|
:reserve-message-space="false"
|
||||||
@update:model-value="toggleAll"
|
@update:model-value="toggleAll"
|
||||||
/>
|
/>
|
||||||
</li>
|
</li>
|
||||||
@@ -209,6 +210,7 @@
|
|||||||
group-class="!mt-0"
|
group-class="!mt-0"
|
||||||
label-class="option-checkbox w-full cursor-pointer"
|
label-class="option-checkbox w-full cursor-pointer"
|
||||||
tabindex="-1"
|
tabindex="-1"
|
||||||
|
:reserve-message-space="false"
|
||||||
@update:model-value="toggleOption(opt.value)"
|
@update:model-value="toggleOption(opt.value)"
|
||||||
/>
|
/>
|
||||||
</li>
|
</li>
|
||||||
|
|||||||
Reference in New Issue
Block a user