style: 🎨 Format code with Biome

app/components/ui/command/Command.vue

@@ -90,11 +90,11 @@ provideCommandContext({
 </script>
 
 <template>
-  <ListboxRoot
-    data-slot="command"
-    v-bind="forwarded"
-    :class="cn('bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md', props.class)"
-  >
-    <slot />
-  </ListboxRoot>
+    <ListboxRoot
+        data-slot="command"
+        v-bind="forwarded"
+        :class="cn('bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md', props.class)"
+    >
+        <slot/>
+    </ListboxRoot>
 </template>

app/components/ui/command/CommandDialog.vue

@@ -28,15 +28,15 @@ const forwarded = useForwardPropsEmits(props, emits);
 </script>
 
 <template>
-  <Dialog v-bind="forwarded">
-    <DialogHeader class="sr-only">
-      <DialogTitle>{{ title }}</DialogTitle>
-      <DialogDescription>{{ description }}</DialogDescription>
-    </DialogHeader>
-    <DialogContent class="overflow-hidden p-0 ">
-      <Command>
-        <slot />
-      </Command>
-    </DialogContent>
-  </Dialog>
+    <Dialog v-bind="forwarded">
+        <DialogHeader class="sr-only">
+            <DialogTitle>{{ title }}</DialogTitle>
+            <DialogDescription>{{ description }}</DialogDescription>
+        </DialogHeader>
+        <DialogContent class="overflow-hidden p-0 ">
+            <Command>
+                <slot/>
+            </Command>
+        </DialogContent>
+    </Dialog>
 </template>

app/components/ui/command/CommandEmpty.vue

@@ -22,11 +22,12 @@ const isRender = computed(
 </script>
 
 <template>
-  <Primitive
-    v-if="isRender"
-    data-slot="command-empty"
-    v-bind="delegatedProps" :class="cn('py-6 text-center text-sm', props.class)"
-  >
-    <slot />
-  </Primitive>
+    <Primitive
+        v-if="isRender"
+        data-slot="command-empty"
+        v-bind="delegatedProps"
+        :class="cn('py-6 text-center text-sm', props.class)"
+    >
+        <slot/>
+    </Primitive>
 </template>

app/components/ui/command/CommandGroup.vue

@@ -37,16 +37,19 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <ListboxGroup
-    v-bind="delegatedProps"
-    :id="id"
-    data-slot="command-group"
-    :class="cn('text-foreground overflow-hidden p-1', props.class)"
-    :hidden="isRender ? undefined : true"
-  >
-    <ListboxGroupLabel v-if="heading" class="px-2 py-1.5 text-xs font-medium text-muted-foreground">
-      {{ heading }}
-    </ListboxGroupLabel>
-    <slot />
-  </ListboxGroup>
+    <ListboxGroup
+        v-bind="delegatedProps"
+        :id="id"
+        data-slot="command-group"
+        :class="cn('text-foreground overflow-hidden p-1', props.class)"
+        :hidden="isRender ? undefined : true"
+    >
+        <ListboxGroupLabel
+            v-if="heading"
+            class="px-2 py-1.5 text-xs font-medium text-muted-foreground"
+        >
+            {{ heading }}
+        </ListboxGroupLabel>
+        <slot/>
+    </ListboxGroup>
 </template>

app/components/ui/command/CommandInput.vue

@@ -31,17 +31,17 @@ const { filterState } = useCommand();
 </script>
 
 <template>
-  <div
-    data-slot="command-input-wrapper"
-    class="flex h-12 items-center gap-2 border-b px-3"
-  >
-    <Search class="size-4 shrink-0 opacity-50" />
-    <ListboxFilter
-      v-bind="{ ...forwardedProps, ...$attrs }"
-      v-model="filterState.search"
-      data-slot="command-input"
-      auto-focus
-      :class="cn('placeholder:text-muted-foreground flex h-12 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50', props.class)"
-    />
-  </div>
+    <div
+        data-slot="command-input-wrapper"
+        class="flex h-12 items-center gap-2 border-b px-3"
+    >
+        <Search class="size-4 shrink-0 opacity-50"/>
+        <ListboxFilter
+            v-bind="{ ...forwardedProps, ...$attrs }"
+            v-model="filterState.search"
+            data-slot="command-input"
+            auto-focus
+            :class="cn('placeholder:text-muted-foreground flex h-12 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50', props.class)"
+        />
+    </div>
 </template>

app/components/ui/command/CommandItem.vue

@@ -73,17 +73,17 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <ListboxItem
-    v-if="isRender"
-    v-bind="forwarded"
-    :id="id"
-    ref="itemRef"
-    data-slot="command-item"
-    :class="cn(`data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-2 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`, props.class)"
-    @select="() => {
+    <ListboxItem
+        v-if="isRender"
+        v-bind="forwarded"
+        :id="id"
+        ref="itemRef"
+        data-slot="command-item"
+        :class="cn(`data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-2 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`, props.class)"
+        @select="() => {
       filterState.search = ''
     }"
-  >
-    <slot />
-  </ListboxItem>
+    >
+        <slot/>
+    </ListboxItem>
 </template>

app/components/ui/command/CommandList.vue

@@ -18,13 +18,13 @@ const forwarded = useForwardProps(delegatedProps);
 </script>
 
 <template>
-  <ListboxContent
-    data-slot="command-list"
-    v-bind="forwarded"
-    :class="cn('max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto', props.class)"
-  >
-    <div role="presentation">
-      <slot />
-    </div>
-  </ListboxContent>
+    <ListboxContent
+        data-slot="command-list"
+        v-bind="forwarded"
+        :class="cn('max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto', props.class)"
+    >
+        <div role="presentation">
+            <slot/>
+        </div>
+    </ListboxContent>
 </template>

app/components/ui/command/CommandSeparator.vue

@@ -16,11 +16,11 @@ const delegatedProps = computed(() => {
 </script>
 
 <template>
-  <Separator
-    data-slot="command-separator"
-    v-bind="delegatedProps"
-    :class="cn('bg-border -mx-1 h-px', props.class)"
-  >
-    <slot />
-  </Separator>
+    <Separator
+        data-slot="command-separator"
+        v-bind="delegatedProps"
+        :class="cn('bg-border -mx-1 h-px', props.class)"
+    >
+        <slot/>
+    </Separator>
 </template>

app/components/ui/command/CommandShortcut.vue

@@ -8,10 +8,10 @@ const props = defineProps<{
 </script>
 
 <template>
-  <span
-    data-slot="command-shortcut"
-    :class="cn('text-muted-foreground ml-auto text-xs tracking-widest', props.class)"
-  >
-    <slot />
-  </span>
+    <span
+        data-slot="command-shortcut"
+        :class="cn('text-muted-foreground ml-auto text-xs tracking-widest', props.class)"
+    >
+        <slot/>
+    </span>
 </template>