fix(FormField): missing conditions to apply container classes (#2631)

Co-authored-by: Benjamin Canac <[email protected]>
nuxt · Nov 13, 2024 · 9241ba1 · 9241ba1
1 parent 3396d5c
commit 9241ba1
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/src/runtime/components/FormField.vue b/src/runtime/components/FormField.vue
@@ -96,7 +96,7 @@ provide(formFieldInjectionKey, computed(() => ({
       </p>
     </div>
 
-    <div :class="[label && ui.container({ class: props.ui?.container })]">
+    <div :class="[(label || !!slots.label || description || !!slots.description) && ui.container({ class: props.ui?.container })]">
       <slot :error="error" />
 
       <p v-if="(typeof error === 'string' && error) || !!slots.error" :class="ui.error({ class: props.ui?.error })">

diff --git a/test/components/__snapshots__/FormField-vue.spec.ts.snap b/test/components/__snapshots__/FormField-vue.spec.ts.snap
@@ -30,7 +30,7 @@ exports[`FormField > renders with description slot correctly 1`] = `
     <!--v-if-->
     <p class="text-[var(--ui-text-muted)]">Description slot</p>
   </div>
-  <div class="">
+  <div class="mt-1 relative">
     <!--v-if-->
   </div>
 </div>"
@@ -130,7 +130,7 @@ exports[`FormField > renders with label slot correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <div class="">
+  <div class="mt-1 relative">
     <!--v-if-->
   </div>
 </div>"

diff --git a/test/components/__snapshots__/FormField.spec.ts.snap b/test/components/__snapshots__/FormField.spec.ts.snap
@@ -30,7 +30,7 @@ exports[`FormField > renders with description slot correctly 1`] = `
     <!--v-if-->
     <p class="text-[var(--ui-text-muted)]">Description slot</p>
   </div>
-  <div class="">
+  <div class="mt-1 relative">
     <!--v-if-->
   </div>
 </div>"
@@ -130,7 +130,7 @@ exports[`FormField > renders with label slot correctly 1`] = `
     </div>
     <!--v-if-->
   </div>
-  <div class="">
+  <div class="mt-1 relative">
     <!--v-if-->
   </div>
 </div>"