feat: Use VButton as default of "as" prop instead "button"

Author: blro0319

packages/vue/src/components/accordion/VAccordionTrigger.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
 import { computed } from "vue";
+import { VButton } from "~/components";
 import type { ComponentAs, VBindAttributes } from "~/types";
 import type { VAccordionTriggerProps } from "./types";
 import { useVAccordionContext, useVAccordionItemContext } from "./context";
 
 withDefaults(defineProps<VAccordionTriggerProps>(), {
-  as: (): ComponentAs => "button",
+  as: (): ComponentAs => VButton,
 });
 
 const { id, renderedItems, toggleItem } = useVAccordionContext(

packages/vue/src/components/dropdown/VDropdownTrigger.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
 import { computed } from "vue";
+import { VButton } from "~/components";
 import type { ComponentAs, VBindAttributes } from "~/types";
 import { useVDropdownContext } from "./context";
 import type { VDropdownTriggerProps } from "./types";
 
 withDefaults(defineProps<VDropdownTriggerProps>(), {
-  as: (): ComponentAs => "button",
+  as: (): ComponentAs => VButton,
 });
 
 const {

packages/vue/src/components/popover/VPopoverTrigger.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
 import { ref } from "vue";
+import { VButton } from "~/components";
 import type { ComponentAs } from "~/types";
 import { useVPopoverContext } from "./context";
 import type { VPopoverTriggerProps } from "./types";
 
 withDefaults(defineProps<VPopoverTriggerProps>(), {
-  as: (): ComponentAs => "button",
+  as: (): ComponentAs => VButton,
 });
 
 const { hooks, id, trigger } = useVPopoverContext("<VPopoverTrigger>");

packages/vue/src/components/roving-tabindex/VRovingTabindexItem.vue

@@ -1,12 +1,13 @@
 <script setup lang="ts">
 import { unrefElement } from "@vueuse/core";
 import { type ComponentPublicInstance, computed, ref, toRefs } from "vue";
+import { VButton } from "~/components";
 import type { ComponentAs, VBindAttributes } from "~/types";
 import type { VRovingTabindexItemProps } from "./types";
 import { useVRovingTabindexContext } from "./context";
 
 const props = withDefaults(defineProps<VRovingTabindexItemProps>(), {
-  as: (): ComponentAs => "button",
+  as: (): ComponentAs => VButton,
   disabled: false,
 });
 
@@ -27,7 +28,7 @@ const bind = computed(() => {
       if (disabled.value || !nodeElement.value) return;
       setActiveItem(nodeElement.value as HTMLElement);
     },
-  } satisfies VBindAttributes;
+  } satisfies VBindAttributes<"button">;
 });
 </script>
 

packages/vue/src/components/tabs/VTabsTrigger.vue

@@ -2,7 +2,7 @@
 import { unrefElement } from "@vueuse/core";
 import { omit } from "lodash-es";
 import { type ComponentPublicInstance, computed, ref, toRefs } from "vue";
-import { VRovingTabindexItem } from "~/components";
+import { VButton, VRovingTabindexItem } from "~/components";
 import type { ComponentAs, VBindAttributes } from "~/types";
 import { useVTabsContext } from "./context";
 import type { VTabsTriggerProps } from "./types";
@@ -12,7 +12,7 @@ defineOptions({
 });
 
 const props = withDefaults(defineProps<VTabsTriggerProps>(), {
-  as: (): ComponentAs => "button",
+  as: (): ComponentAs => VButton,
   disabled: false,
 });
 
@@ -29,8 +29,8 @@ const controls = computed(() => {
 
 const bind = computed(() => {
   return {
-    "id": `${id.value}-${value.value}-trigger`,
     "disabled": disabled.value,
+    "id": `${id.value}-${value.value}-trigger`,
     "role": "tab",
     "aria-selected": selected.value,
     "aria-controls": controls.value,

packages/vue/src/components/tooltip/VTooltipTrigger.vue

@@ -1,12 +1,13 @@
 <script setup lang="ts">
 import { computed } from "vue";
+import { VButton } from "~/components";
 import { useGlobalEscapeStack } from "~/composables";
 import type { ComponentAs } from "~/types";
 import { useVTooltipContext } from "./context";
 import type { VTooltipTriggerProps } from "./types";
 
 withDefaults(defineProps<VTooltipTriggerProps>(), {
-  as: (): ComponentAs => "button",
+  as: (): ComponentAs => VButton,
 });
 
 const { enterDelay, leaveDelay, id, trigger, visible, hooks } =