I am encountering a weird behavior, where child components sometimes resolve the wrong value for a field mapped from their respective child properties. Still, the actual child property has been switched.

Example:

I have a component that looks like this:

The Aa in the upper box is an Icon that is part of a larger Iconography component, which in turn has all sorts of props like size and color. When the Icon is white, it is called “light-vivid” and maps to the “Icon/Light/Vivid” variable.

This works everywhere perfectly fine, just in this component, when switching props in the parent (like making the menu left or right for example), the icon’s color gets wrongly mapped to the default color “Icon/Dark/Vivid”. However, the child property is still “light-vivid”:

The props:

Any Idea why this might happen?

Best Sam