IX Select input clears if selection options change (since version 2.6.1)

[vormacher]

Prerequisites

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

What happened?

Hi,

Use Case:
We're using the iX-select to search and select data in a database.
Every time the iX-select input changes, an API is being called to retrieve new data.

Problem:
Since the Version 2.6.1 the input is getting cleared if a new value (select-option) is being added.

In the "How to Produce", you will also find our current workaround by adding an additional div-container around the selects.

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

React

Which version of iX do you use?

2.6.1

Code to produce this issue.

// stackblitz: https://stackblitz.com/edit/react-ts-qcylb8l8?file=App.tsx
import * as React from 'react';
import './style.css';
import { IxSelect, IxSelectItem } from '@siemens/ix-react';

export default function App() {
  const [items, setItems] = React.useState<string[]>([]);

  const callApiWhichAddNewSelectOptions = (event: any) => {
    setTimeout(() => {
      setItems((prevItems) => [...prevItems, event.detail]);
    }, 1000);
  };

  return (
    <>
      <h3>broken select:</h3>
      <IxSelect
        value="1"
        onInputChange={callApiWhichAddNewSelectOptions}
        i18nPlaceholder="Search in database..."
      >
        {items.map((i, index) => (
          <IxSelectItem key={index} label={i} value={i}></IxSelectItem>
        ))}
      </IxSelect>
      <br />
      <br />
      <h3>working select (with additional container):</h3>
      <IxSelect
        value="1"
        onInputChange={callApiWhichAddNewSelectOptions}
        i18nPlaceholder="Search in database..."
      >
        <div>
          {items.map((i, index) => (
            <IxSelectItem key={index} label={i} value={i}></IxSelectItem>
          ))}
        </div>
      </IxSelect>
    </>
  );
}