Hello, I am working on a large product and our library has a broad color palette where many sections are monochromatic and use the same components just in different colors. Since Figma doesn’t allow for color as a property I am making base components of all of my icons, texts, forms fields etc. Which seems to be working great so far.

I’m running into one small issue where I’ve taken my basic input field component, which has a frame with slot components for text and icon/text and set the icon to a boolean prop. I’ve made several new components that use this as a nested instance and have variants for the states where the boolean state changes or the swapped component changes. This also works fine for this specific component.

As soon as I go to make instances of this component and change the nested instance variant (style=color) of the input field, the slot and boolean stay the same in every state, rather than maintaining the properties in the main component.

Here you see each of the input components that all use the atom.Input-Frame as a base I’ve pulled tools.SearchList-Single out into a frame for reference. The green version works as expected, but when I change to the ‘Laser’ atom.Input-Frame the swap component is either on or off in all states and only whatever the swap component I selected at the moment. If I change the state and change the swap that new swap is seen in all states.

Does anyone know a workaround?