submenu dropdown is moving on scrolling the main dropdown

[iturhs123]

Prerequisites

• I have read the Contributing Guidelines.
• I have not leaked any internal/restricted information like screenshots, videos, code snippets, links etc.

What happened?

When the submenu dropdown is open and we scroll the parent dropdown, the submenu moves along with it.

PFA recording.

Screen.Recording.2025-03-14.at.3.01.32.PM.mov

What type of frontend framework are you seeing the problem on?

React

Which version of iX do you use?

2.7.0

Code to produce this issue.

import { IxButton, IxDropdown, IxDropdownItem } from '@siemens/ix-react';
import React from 'react';

export default () => {
  return (
    <>
      <IxButton id="iconTriggerId">Open</IxButton>
      <IxDropdown trigger="iconTriggerId">
        <IxDropdownItem icon="star" label="Model 1"></IxDropdownItem>
        <IxDropdownItem icon="document" label="Model 2"></IxDropdownItem>
        <IxDropdownItem icon="bulb" label="Model 3"></IxDropdownItem>
        <IxDropdownItem icon="star" label="Model 4"></IxDropdownItem>
        <IxDropdownItem icon="document" label="Model 5"></IxDropdownItem>
        <IxDropdownItem icon="bulb" label="Model 6"></IxDropdownItem>
        <IxDropdownItem icon="star" label="Model 7"></IxDropdownItem>
        <IxDropdownItem icon="document" label="Model 8"></IxDropdownItem>
        <IxDropdownItem icon="bulb" label="Model 9"></IxDropdownItem>
        <IxDropdownItem icon="star" label="Model 10"></IxDropdownItem>
        <IxDropdownItem icon="document" label="Model 11"></IxDropdownItem>
        <IxDropdownItem icon="bulb" label="Model 12"></IxDropdownItem>
        <IxDropdownItem icon="star" label="Model 13"></IxDropdownItem>
        <IxDropdownItem icon="document" label="Model 14"></IxDropdownItem>
        <IxDropdownItem id="submenuTrigger" label="More Model"></IxDropdownItem>
        <IxDropdownItem icon="bulb" label="Model 15"></IxDropdownItem>
      </IxDropdown>
      <IxDropdown trigger="submenuTrigger" placement="right-start">
        <IxDropdownItem icon="star" label="Item 1"></IxDropdownItem>
        <IxDropdownItem icon="document" label="Item 2"></IxDropdownItem>
      </IxDropdown>
    </>
  );
};

[danielleroux]

@iturhs123 This is an intended behaviour of the component, if the sub-menu is open the dropdown tries to keep the dropdown always visible to the user

[flxlst09]

@iturhs123 In addition to @danielleroux: We added this topic to discuss in our internal UX sync and will come back to you.