Dropdown item weird behavior

[igdmdimitrov]

Description

The dropdown item is shifting infinitely down.

Steps to reproduce

import { IgrButton, IgrButtonModule, IgrDropdown, IgrDropdownItem, IgrDropdownItemModule, IgrDropdownModule, IgrRipple, IgrRippleModule } from 'igniteui-react';
import { useRef } from 'react';
import styles from './master-view.module.css';
import createClassTransformer from '../style-utils';

IgrButtonModule.register();
IgrDropdownItemModule.register();
IgrDropdownModule.register();
IgrRippleModule.register();

export default function MasterView() {
  const classes = createClassTransformer(styles);
  const dropdown = useRef<IgrDropdown>(null);

  return (
    <>
      <div className={classes("row-layout master-view-container")}>
        <IgrButton variant="Contained" size="large" clicked={(e: any) => dropdown?.current.toggleTarget(e.target || e.i.nativeElement)} className={classes("button")}>
          <span>Dropdown</span>
          <IgrRipple></IgrRipple>
        </IgrButton>
        <IgrDropdown ref={dropdown} className={classes("dropdown")}>
          <div style={{display: 'contents'}} onClick={(e: any) => dropdown?.current.toggleTarget(e.target || e.i.nativeElement)}>
            <IgrDropdownItem>
              <span>Option</span>
            </IgrDropdownItem>
          </div>
        </IgrDropdown>
      </div>
    </>
  );
}

Result

Expected result

Dropdown should close