How to Retain Customized Dropdown Options in Component Instances?

I’ve created a dropdown component with two variants: expanded and unexpanded. When the user clicks the chevron down icon in the unexpanded variant, it switches to the expanded variant, and clicking the chevron up icon switches it back. I want to use this dropdown in multiple places, each with different options. However, when I change the options in any instance, they revert to the original options defined in the component. How can I retain the customized options in each instance while maintaining the expand/collapse functionality?

This is the component

and these are some of the instances, but after some time, the options get changed to the ones in the original component.

Figma Link:

Thanks in advance for your assistance!

I have a similar issue in Nested component properties not updating with main component.

I’m following this thread, because that might also answer my questions

Hi there,

Thanks for reaching out. Just to confirm, would you like to retain the instance sizes? If that’s the case, ss this thread explains, this could be a feature limitation.

You might be encountering a potential feature limitation when swapping instances or changing variants, especially with nested instances retaining the size of the original instance or variant There’d be a workaround for it. To get the nested instance to resize, you can add auto layout on each variant. It works for many cases.

Please let me know if you have further questions!

Thanks,
Toku