fix(VSpeedDial): position prop styling and transition delay

packages/vuetify/src/labs/VSpeedDial/VSpeedDial.sass

@@ -1,2 +1,24 @@
 .v-speed-dial__content
   gap: 8px
+
+  &.v-overlay__content
+    &.v-speed-dial__content--end,
+    &.v-speed-dial__content--end-center,
+    &.v-speed-dial__content--right,
+    &.v-speed-dial__content--right-center
+      flex-direction: row
+
+    &.v-speed-dial__content--left,
+    &.v-speed-dial__content--left-center,
+    &.v-speed-dial__content--start,
+    &.v-speed-dial__content--start-center
+      flex-direction: row-reverse
+
+    &.v-speed-dial__content--top,
+    &.v-speed-dial__content--top-center
+      flex-direction: column-reverse
+
+  > *
+    @for $i from 1 through 10
+      &:nth-child(#{$i})
+        transition-delay: 0.05s * ($i - 1)

packages/vuetify/src/labs/VSpeedDial/VSpeedDial.tsx

@@ -7,19 +7,27 @@ import { makeVMenuProps, VMenu } from '@/components/VMenu/VMenu'
 
 // Composables
 import { makeComponentProps } from '@/composables/component'
-import { makeTransitionProps, MaybeTransition } from '@/composables/transition'
+import { MaybeTransition } from '@/composables/transition'
 
 // Utilities
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
 import { genericComponent, propsFactory, useRender } from '@/util'
 
 // Types
+import type { ComputedRef } from 'vue'
 import type { OverlaySlots } from '@/components/VOverlay/VOverlay'
+import type { Anchor } from '@/util'
 
 export const makeVSpeedDialProps = propsFactory({
   ...makeComponentProps(),
-  ...makeVMenuProps({ offset: 8, minWidth: 0, location: 'top center' as const }),
-  ...makeTransitionProps({ transition: 'fade-transition' }),
+  ...makeVMenuProps({
+    offset: 8,
+    minWidth: 0,
+    openDelay: 0,
+    closeDelay: 100,
+    location: 'top center' as const,
+    transition: 'scale-transition',
+  }),
 }, 'VSpeedDial')
 
 export const VSpeedDial = genericComponent<OverlaySlots>()({
@@ -30,6 +38,16 @@ export const VSpeedDial = genericComponent<OverlaySlots>()({
   setup (props, { slots }) {
     const menuRef = ref<VMenu>()
 
+    const location = computed(() => {
+      const [y, x = 'center'] = props.location.split(' ')
+
+      return `${y} ${x}`
+    }) as ComputedRef<Anchor>
+
+    const locationClasses = computed(() => ({
+      [`v-speed-dial__content--${location.value.replace(' ', '-')}`]: true,
+    }))
+
     useRender(() => {
       const menuProps = VMenu.filterProps(props)
 
@@ -38,8 +56,13 @@ export const VSpeedDial = genericComponent<OverlaySlots>()({
           { ...menuProps }
           class={ props.class }
           style={ props.style }
-          contentClass="v-speed-dial__content"
+          contentClass={[
+            'v-speed-dial__content',
+            locationClasses.value,
+          ]}
+          location={ location.value }
           ref={ menuRef }
+          transition="fade-transition"
         >
           {{
             ...slots,
@@ -55,6 +78,7 @@ export const VSpeedDial = genericComponent<OverlaySlots>()({
                   appear
                   group
                   transition={ props.transition }
+                  mode="out-in"
                 >
                   { slots.default?.(slotProps) }
                 </MaybeTransition>