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

app/components/pub/ui/menubar/Menubar.vue

@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import type { MenubarRootEmits, MenubarRootProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import {
   MenubarRoot,
 
   useForwardPropsEmits,
 } from 'radix-vue'
 import { computed } from 'vue'
+import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarRootProps & { class?: HTMLAttributes['class'] }>()
 const emits = defineEmits<MenubarRootEmits>()

app/components/pub/ui/menubar/MenubarCheckboxItem.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { MenubarCheckboxItemEmits, MenubarCheckboxItemProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import {
   MenubarCheckboxItem,
 
@@ -9,6 +8,7 @@ import {
   useForwardPropsEmits,
 } from 'radix-vue'
 import { computed } from 'vue'
+import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarCheckboxItemProps & { class?: HTMLAttributes['class'] }>()
 const emits = defineEmits<MenubarCheckboxItemEmits>()

app/components/pub/ui/menubar/MenubarContent.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { MenubarContentProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import {
   MenubarContent,
 
@@ -9,6 +8,7 @@ import {
   useForwardProps,
 } from 'radix-vue'
 import { computed } from 'vue'
+import { cn } from '@/lib/utils'
 
 const props = withDefaults(
   defineProps<MenubarContentProps & { class?: HTMLAttributes['class'] }>(),

app/components/pub/ui/menubar/MenubarItem.vue

@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import type { MenubarItemEmits, MenubarItemProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import {
   MenubarItem,
 
   useForwardPropsEmits,
 } from 'radix-vue'
 import { computed } from 'vue'
+import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarItemProps & { class?: HTMLAttributes['class'], inset?: boolean }>()
 

app/components/pub/ui/menubar/MenubarLabel.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import type { MenubarLabelProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import { MenubarLabel } from 'radix-vue'
+import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarLabelProps & { class?: HTMLAttributes['class'], inset?: boolean }>()
 </script>

app/components/pub/ui/menubar/MenubarRadioItem.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { MenubarRadioItemEmits, MenubarRadioItemProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import {
   MenubarItemIndicator,
   MenubarRadioItem,
@@ -9,6 +8,7 @@ import {
   useForwardPropsEmits,
 } from 'radix-vue'
 import { computed } from 'vue'
+import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarRadioItemProps & { class?: HTMLAttributes['class'] }>()
 const emits = defineEmits<MenubarRadioItemEmits>()

app/components/pub/ui/menubar/MenubarSeparator.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import type { MenubarSeparatorProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import { MenubarSeparator, useForwardProps } from 'radix-vue'
 import { computed } from 'vue'
+import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarSeparatorProps & { class?: HTMLAttributes['class'] }>()
 

app/components/pub/ui/menubar/MenubarSubContent.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { MenubarSubContentEmits, MenubarSubContentProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import {
   MenubarPortal,
   MenubarSubContent,
@@ -9,6 +8,7 @@ import {
   useForwardPropsEmits,
 } from 'radix-vue'
 import { computed } from 'vue'
+import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarSubContentProps & { class?: HTMLAttributes['class'] }>()
 

app/components/pub/ui/menubar/MenubarSubTrigger.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import type { MenubarSubTriggerProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import { MenubarSubTrigger, useForwardProps } from 'radix-vue'
 import { computed } from 'vue'
+import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarSubTriggerProps & { class?: HTMLAttributes['class'], inset?: boolean }>()
 

app/components/pub/ui/menubar/MenubarTrigger.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import type { MenubarTriggerProps } from 'radix-vue'
 import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
 import { MenubarTrigger, useForwardProps } from 'radix-vue'
 import { computed } from 'vue'
+import { cn } from '@/lib/utils'
 
 const props = defineProps<MenubarTriggerProps & { class?: HTMLAttributes['class'] }>()