Fix: Remove color styles from typography variation controls - #61217

[hbhalodia]

What?

• Issue - Remove color styles from typography variation controls #61217

Why?

• This would remove the global style colors being added to the typography variation in the style's editor page.

How?

• This PR adds the extra props addGlobalStyles, if this is passed as false, it would not add the style to the iframe preview.
• This is necessary because, the same component reused at multiple instance, hence in order to not make effect to other place, such as the style variations we need to pass it as a prop and do action based on the prop provided.

Testing Instructions

1. Checkout to this branch.
2. Run the NPM run build process.
3. Open the site → editor → styles → typography.
4. You would see that, the typography options have now natural black and white color combination, and it would be the same for each of the style variations.

Testing Instructions for Keyboard

• NIL

Screenshots or screencast

GB.Issue-.61217.webm

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: hbhalodia <hbhalodia@git.wordpress.org>
Co-authored-by: scruffian <scruffian@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[hbhalodia]

Hello @richtabor,

I am passing this prop as true here, because I am thinking we should keep the color combination in the sidebar navigation global screen, Let me know if we need to remove the color from here as well, I will update the PR.

Thank You.

[scruffian]

I think we should remove it here.

[hbhalodia]

Sure, I will work on this PR and update it by removing the color from here as well.

So after update, both the global screen and side panel would not have the color effect in the typography. Am I correct?

Hence, I am guessing that, we should remove the props from all places, if we make it consistent.

[scruffian]

Yeah, I had a different idea for how to do it which I tried here: #61898

I'm not sure which option is better, what do you think?

[hbhalodia]

Yeah, looks like the good option. Just add the styles to iframe whatever we want using this prop.

[scruffian]

I'm not sure about the approach here. Adding a new addGlobalStyles feels quite heavy handed. An alternative could be to pass a styles object from typography variations to the style preview, like this: #61898

[scruffian]

This was closed by #62578