MUI Tooltip overflow problem

<p>If you're encountering an inexplicable overflow issue with the <code>Tooltip</code> component in Material-UI on hover, here's a solution that might help.</p>
<p>First, make sure you have popper.js installed using the following command:</p>

```bash
npm install --save-dev @types/popper.js
```
Next, in the component containing <code>Tooltip</code>, add the following imports:
```javascript
import { OptionsGeneric } from '@popperjs/core';
```
Then, update your <code>Tooltip</code> usage as follows:
```javascript
<Tooltip
  title={'Some text'}
  PopperProps={{
    disablePortal: true,
    popperOptions: {
      modifiers: [
        {
          name: 'preventOverflow',
          options: {
            enabled: true,
            boundariesElement: 'window',
          },
        },
      ] as OptionsGeneric<any>['modifiers'],
    },
  }}
  aria-label='Some text'
>
  {/* ... your content ... */}
</Tooltip>
```
<p>This configuration adds Popper options to handle overflow.</p>

Cosmin Doboș
13 Feb 2024