⚠️ refactor (form): refactor label component for improved styling and responsiveness

app/components/pub/ui/form/FormItem.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import { provide } from 'vue'
+import { cn } from '@/lib/utils'
 import { FORM_ITEM_INJECTION_KEY } from './injectionKeys'
 
 const props = defineProps<{

app/components/pub/ui/form/FormLabel.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { LabelProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { Label } from '@/components/ui/label'
+import { Label } from '@/components/pub/ui/label'
 import { cn } from '@/lib/utils'
 import { useFormField } from './useFormField'
 
@@ -11,13 +11,7 @@ const { error, formItemId } = useFormField()
 </script>
 
 <template>
-  <Label
-    :class="cn(
-      error && 'text-destructive',
-      props.class,
-    )"
-    :for="formItemId"
-  >
+  <Label :class="cn(error && 'text-destructive', props.class)" :for="formItemId">
     <slot />
   </Label>
 </template>

app/components/pub/ui/form/useFormField.ts

@@ -13,7 +13,7 @@ export function useFormField() {
   }
 
   if (!fieldContext)
-    throw new Error('useFormField should be used within <FormField>')
+  { throw new Error('useFormField should be used within <FormField>') }
 
   const { name } = fieldContext
   const id = fieldItemContext