diff --git a/docs/data/joy/components/tooltip/ArrowTooltips.js b/docs/data/joy/components/tooltip/ArrowTooltips.js
index 9adbf036cfe59b..3699ca7d80b14d 100644
--- a/docs/data/joy/components/tooltip/ArrowTooltips.js
+++ b/docs/data/joy/components/tooltip/ArrowTooltips.js
@@ -1,11 +1,14 @@
import * as React from 'react';
import Button from '@mui/joy/Button';
+import Sheet from '@mui/joy/Sheet';
import Tooltip from '@mui/joy/Tooltip';
export default function ArrowTooltips() {
return (
-
-
-
+
+
+
+
+
);
}
diff --git a/docs/data/joy/components/tooltip/ArrowTooltips.tsx b/docs/data/joy/components/tooltip/ArrowTooltips.tsx
index 9adbf036cfe59b..3699ca7d80b14d 100644
--- a/docs/data/joy/components/tooltip/ArrowTooltips.tsx
+++ b/docs/data/joy/components/tooltip/ArrowTooltips.tsx
@@ -1,11 +1,14 @@
import * as React from 'react';
import Button from '@mui/joy/Button';
+import Sheet from '@mui/joy/Sheet';
import Tooltip from '@mui/joy/Tooltip';
export default function ArrowTooltips() {
return (
-
-
-
+
+
+
+
+
);
}
diff --git a/docs/data/joy/components/tooltip/ArrowTooltips.tsx.preview b/docs/data/joy/components/tooltip/ArrowTooltips.tsx.preview
index 609cf9ae271afc..8b6d7d124e1790 100644
--- a/docs/data/joy/components/tooltip/ArrowTooltips.tsx.preview
+++ b/docs/data/joy/components/tooltip/ArrowTooltips.tsx.preview
@@ -1,3 +1,5 @@
-
-
-
\ No newline at end of file
+
+
+
+
+
\ No newline at end of file
diff --git a/packages/mui-joy/src/Tooltip/Tooltip.tsx b/packages/mui-joy/src/Tooltip/Tooltip.tsx
index 3bba6eaad4ae8d..ed56ebaa61d076 100644
--- a/packages/mui-joy/src/Tooltip/Tooltip.tsx
+++ b/packages/mui-joy/src/Tooltip/Tooltip.tsx
@@ -588,9 +588,7 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
});
const [SlotArrow, arrowProps] = useSlot('arrow', {
- additionalProps: {
- ref: setArrowRef,
- },
+ ref: setArrowRef,
className: classes.arrow,
elementType: TooltipArrow,
externalForwardedProps: other,
diff --git a/packages/mui-joy/src/utils/useSlot.ts b/packages/mui-joy/src/utils/useSlot.ts
index 915668fabef754..f3e6400aefe8e6 100644
--- a/packages/mui-joy/src/utils/useSlot.ts
+++ b/packages/mui-joy/src/utils/useSlot.ts
@@ -52,7 +52,9 @@ export default function useSlot<
* e.g. the `externalForwardedProps` are spread to `root` slot but not other slots.
*/
name: T,
- parameters: (T extends 'root' ? { ref: React.ForwardedRef } : {}) & {
+ parameters: (T extends 'root' // root slot must pass a `ref` as a parameter
+ ? { ref: React.ForwardedRef }
+ : { ref?: React.ForwardedRef }) & {
/**
* The slot's className
*/
@@ -129,11 +131,7 @@ export default function useSlot<
externalSlotProps: resolvedComponentsProps,
});
- const ref = useForkRef(
- internalRef,
- // @ts-ignore `ref` is required for the 'root' slot
- useForkRef(resolvedComponentsProps?.ref, name === 'root' ? parameters.ref : undefined),
- ) as ((instance: any | null) => void) | null;
+ const ref = useForkRef(internalRef, resolvedComponentsProps?.ref, parameters.ref);
const finalOwnerState = getSlotOwnerState
? { ...ownerState, ...getSlotOwnerState(mergedProps as any) }