style: 💄 格式化代码

src/components/ui/command/CommandItem.vue

@@ -1,16 +1,16 @@
 <script setup lang="ts">
-import type { ListboxItemEmits, ListboxItemProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit, useCurrentElement } from "@vueuse/core"
-import { ListboxItem, useForwardPropsEmits, useId } from "reka-ui"
-import { computed, onMounted, onUnmounted, ref } from "vue"
-import { cn } from "@/lib/utils"
-import { useCommand, useCommandGroup } from "."
+import type { ListboxItemEmits, ListboxItemProps } from 'reka-ui'
+import type { HTMLAttributes } from 'vue'
+import { reactiveOmit, useCurrentElement } from '@vueuse/core'
+import { ListboxItem, useForwardPropsEmits, useId } from 'reka-ui'
+import { computed, onMounted, onUnmounted, ref } from 'vue'
+import { cn } from '@/lib/utils'
+import { useCommand, useCommandGroup } from '.'
 
-const props = defineProps<ListboxItemProps & { class?: HTMLAttributes["class"] }>()
+const props = defineProps<ListboxItemProps & { class?: HTMLAttributes['class'] }>()
 const emits = defineEmits<ListboxItemEmits>()
 
-const delegatedProps = reactiveOmit(props, "class")
+const delegatedProps = reactiveOmit(props, 'class')
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits)
 
@@ -19,43 +19,43 @@ const { filterState, allItems, allGroups } = useCommand()
 const groupContext = useCommandGroup()
 
 const isRender = computed(() => {
-  if (!filterState.search) {
-    return true
-  }
-  else {
-    const filteredCurrentItem = filterState.filtered.items.get(id)
-    // If the filtered items is undefined means not in the all times map yet
-    // Do the first render to add into the map
-    if (filteredCurrentItem === undefined) {
-      return true
+    if (!filterState.search) {
+        return true
     }
+    else {
+        const filteredCurrentItem = filterState.filtered.items.get(id)
+        // If the filtered items is undefined means not in the all times map yet
+        // Do the first render to add into the map
+        if (filteredCurrentItem === undefined) {
+            return true
+        }
 
-    // Check with filter
-    return filteredCurrentItem > 0
-  }
+        // Check with filter
+        return filteredCurrentItem > 0
+    }
 })
 
 const itemRef = ref()
 const currentElement = useCurrentElement(itemRef)
 onMounted(() => {
-  if (!(currentElement.value instanceof HTMLElement))
-    return
+    if (!(currentElement.value instanceof HTMLElement))
+        return
 
-  // textValue to perform filter
-  allItems.value.set(id, currentElement.value.textContent ?? (props.value?.toString() ?? ""))
+    // textValue to perform filter
+    allItems.value.set(id, currentElement.value.textContent ?? (props.value?.toString() ?? ''))
 
-  const groupId = groupContext?.id
-  if (groupId) {
-    if (!allGroups.value.has(groupId)) {
-      allGroups.value.set(groupId, new Set([id]))
+    const groupId = groupContext?.id
+    if (groupId) {
+        if (!allGroups.value.has(groupId)) {
+            allGroups.value.set(groupId, new Set([id]))
+        }
+        else {
+            allGroups.value.get(groupId)?.add(id)
+        }
     }
-    else {
-      allGroups.value.get(groupId)?.add(id)
-    }
-  }
 })
 onUnmounted(() => {
-  allItems.value.delete(id)
+    allItems.value.delete(id)
 })
 </script>