When editing multiple components, adding new entries into props.styles overrides the entire props.styles object for all components instead of just adding the new key to each.
Pretty sure this has been an issue for many versions prior to this as well and it likely affects all object type props Nope, it doesn’t affect for example props.params - params keys can be added and params key values can be modified without affecting the other keys which affirms my position this is a bug.
Hello Nick!
Thanks for reporting this. I am able to replicate the behavior and have submitted a bug ticket for review. I’ll update this post again when there is more to share. Thanks!
@nminchin Can you please clarify what this bug report means? I am unclear. Are you using the “Modify Style” button or the “Add Object Member…” button? or something else entirely?
ok, right, the styles editor popup thinks of a “style” object as an atomic thing. When you hit OK, it is setting the style object on the components in the selection, not doing some sort of merge.
The other button (the “add member” button) isn’t “setting” the object, it is injecting a new child into the object, so any other keys in there will remain untouched. it should work the same for styles as it does for custom or anything else.
That’s what I assumed, but this isn’t how I would have assumed it to work as a user. I guess it’s not so much a bug as it is a feature request to have it changed in approach it feels a bit inconsistent as it is, as both methods are adding styling to a selection of components, one graphically and one manually, but both implement them differently
Yeah, I can see your point, but I think an argument could be made either way. I think the problem with your idea is that it falls apart for the common case: single component selection.
Consider this: let’s say that the styles popup did a “merge” of the styles you’d selected in the UI and the styles that already existed on the selection.
Now, you select a component that has a style, let’s say, it has margin set on it. You decide that instead of margin, you want padding. So you remove margin in the UI and add padding. Now you hit OK. The style editor does a “merge” of the style you’d designed and the existing object. Now you have margin and padding on your style object.
Pretty sure in that case you’d also be filing a bug report.