chore: ⬆️ Upgrade to Nuxt 4

app/components/ui/select/SelectTrigger.vue

@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import { reactiveOmit } from "@vueuse/core";
+import { ChevronDown } from "lucide-vue-next";
+import {
+    SelectIcon,
+    SelectTrigger,
+    type SelectTriggerProps,
+    useForwardProps,
+} from "reka-ui";
+import type { HTMLAttributes } from "vue";
+import { cn } from "@/lib/utils";
+
+const props = withDefaults(
+    defineProps<
+        SelectTriggerProps & {
+            class?: HTMLAttributes["class"];
+            size?: "sm" | "default";
+            disableSelectIcon?: boolean;
+            disableDefaultClasses?: boolean;
+        }
+    >(),
+    { size: "default", disableSelectIcon: false, disableDefaultClasses: false },
+);
+
+const delegatedProps = reactiveOmit(props, "class", "size");
+const forwardedProps = useForwardProps(delegatedProps);
+</script>
+
+<template>
+  <SelectTrigger
+    data-slot="select-trigger"
+    :data-size="size"
+    v-bind="forwardedProps"
+    :class="cn(
+      !disableDefaultClasses && `border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,
+      props.class,
+    )"
+  >
+    <slot />
+    <SelectIcon as-child v-if="!props.disableSelectIcon">
+      <ChevronDown class="size-4 opacity-50" />
+    </SelectIcon>
+  </SelectTrigger>
+</template>