[joy-ui][Tooltip] Not working with custom sub-components

[m1cm1c]

Steps to reproduce

import {Tooltip} from '@mui/joy';

export function TooltipBug() {
  return <>
    <Tooltip title="foo">
      <div>f</div>
    </Tooltip>
    <Tooltip title="bar">
      <CustomComponent />
    </Tooltip>
  </>;
}

function CustomComponent() {
  return <div>b</div>;
}

shows "foo" but does not show "bar".

Current behavior

Yields:

<div aria-label="foo" class="">f</div>
<div>b</div>

Expected behavior

<div aria-label="foo" class="">f</div>
<div aria-label="bar" class="">b</div>

Context

i want to use components

Your environment

Browser: Mozilla Firefox 126.0.1

npx @mui/envinfo

``` System: OS: Linux 5.19 Manjaro Linux Binaries: Node: 18.18.2 - ~/.nvm/versions/node/v18.18.2/bin/node npm: 9.8.1 - ~/.nvm/versions/node/v18.18.2/bin/npm pnpm: Not Found Browsers: Chrome: Not Found ```

Search keywords: tooltip