fix(VSpeedDial): forward menu slots

fixes #19381
vuetifyjs · Mar 13, 2024 · 46ed018 · 46ed018
1 parent dbd7432
commit 46ed018
Showing 1 changed file with 28 additions and 16 deletions.
diff --git a/packages/vuetify/src/labs/VSpeedDial/VSpeedDial.tsx b/packages/vuetify/src/labs/VSpeedDial/VSpeedDial.tsx
@@ -10,20 +10,26 @@ import { makeComponentProps } from '@/composables/component'
 import { makeTransitionProps, MaybeTransition } from '@/composables/transition'
 
 // Utilities
+import { ref } from 'vue'
 import { genericComponent, propsFactory, useRender } from '@/util'
 
+// Types
+import type { OverlaySlots } from '@/components/VOverlay/VOverlay'
+
 export const makeVSpeedDialProps = propsFactory({
   ...makeComponentProps(),
   ...makeVMenuProps({ offset: 8, minWidth: 0, location: 'top center' as const }),
   ...makeTransitionProps({ transition: 'fade-transition' }),
 }, 'VSpeedDial')
 
-export const VSpeedDial = genericComponent()({
+export const VSpeedDial = genericComponent<OverlaySlots>()({
   name: 'VSpeedDial',
 
   props: makeVSpeedDialProps(),
 
   setup (props, { slots }) {
+    const menuRef = ref<VMenu>()
+
     useRender(() => {
       const menuProps = VMenu.filterProps(props)
 
@@ -33,22 +39,28 @@ export const VSpeedDial = genericComponent()({
           class={ props.class }
           style={ props.style }
           contentClass="v-speed-dial__content"
+          ref={ menuRef }
         >
-          <VDefaultsProvider
-            defaults={{
-              VBtn: {
-                size: 'small',
-              },
-            }}
-          >
-            <MaybeTransition
-              appear
-              group
-              transition={ props.transition }
-            >
-              { slots.default?.() }
-            </MaybeTransition>
-          </VDefaultsProvider>
+          {{
+            ...slots,
+            default: slotProps => (
+              <VDefaultsProvider
+                defaults={{
+                  VBtn: {
+                    size: 'small',
+                  },
+                }}
+              >
+                <MaybeTransition
+                  appear
+                  group
+                  transition={ props.transition }
+                >
+                  { slots.default?.(slotProps) }
+                </MaybeTransition>
+              </VDefaultsProvider>
+            ),
+          }}
         </VMenu>
       )
     })