Grouping duplicates items on the first group
What version of rsuite are you using?
6.1.3
What version of React are you using?
18.3.1
What version of TypeScript are you using (if any)?
5.9.3
What browser are you using?
Chrome
Describe the Bug
I have a long list of elements, and I want to group them. The list is grouped correctly, but collapse and expand the group is not working correctly, seems that the items doesn't collapse and they duplicates themself. I hope the video helps.
https://github.com/user-attachments/assets/435c9504-eb91-48de-afea-d387c08a34ae
This can be reproduced on the rsuite documentation just adding more elements to the Group example.
Expected Behavior
When collapse, the actual group collapses and hides the elements. When expanded, the elements are visible but there are only the same elements, no duplicates.
To Reproduce
import { InputPicker } from 'rsuite';
const data = ['Eugenia', 'Bryan', 'Linda', 'Nancy', 'Lloyd','Eugenia', 'Bryan', 'Linda', 'Nancy', 'Lloyd','Eugenia', 'Bryan', 'Linda', 'Nancy', 'Lloyd','Eugenia', 'Bryan', 'Linda', 'Nancy', 'Lloyd'].map( item => ({ label: item, value: item, role: Math.random() > 0.5 ? 'Owner' : 'Guest' }) );
const App = () => ( <> <InputPicker creatable data={data} w={224} groupBy="role" placeholder="Group Select" onCreate={(value, item) => { console.log(value, item); }} /> </> );
ReactDOM.render(, document.getElementById('root'));
Source: rsuite/rsuite