-
Notifications
You must be signed in to change notification settings - Fork 4.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Global Styles: Abstract preset variable retrieving and setting #26970
Global Styles: Abstract preset variable retrieving and setting #26970
Conversation
Size Change: +6 B (0%) Total Size: 1.2 MB
ℹ️ View Unchanged
|
context, | ||
propertyName, | ||
origin = 'merged', | ||
resolveVars = true |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why do we need this? I'd think resolving variables is always part of the algorithm this function has to perform (same for setStyleProperty
).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Feedback applied 👍 resolveVars was removed.
@@ -53,33 +60,42 @@ export function useEditorFeature( featurePath, blockName = GLOBAL_CONTEXT ) { | |||
); | |||
} | |||
|
|||
export function getPresetVariable( presetCategory, presets, value ) { | |||
export function getPresetVariable( styles, blockName, propertyName, value ) { | |||
if ( ! value ) { | |||
return; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can we make it so this function returns the preset variable or the input value? I've noticed in all the places this is used we need a fallback for when we return undefined, which won't be needed if we return the input value when there's no need for processing it.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Same for getValueFromVariable
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Feedback applied 👍
packages/edit-site/src/components/editor/global-styles-provider.js
Outdated
Show resolved
Hide resolved
561736a
to
81ebe91
Compare
Hi @nosolosw thank you for the review, all the feedback was applied. |
81ebe91
to
3dfc717
Compare
Squashed commits: [dadc751ac5] Global Styles: Abstract preset variable retrieving and setting
3dfc717
to
4560791
Compare
All the feedback was applied so I merged this PR. If there is any further feedback feel free to leave a comment and I will propose a follow-up PR. |
This PR abstracts the retrieving and setting of preset variables inside getStyleProperty and setStyleProperty. With this change, the code inside the Global Style panels does not even need to know about presets, custom vars, etc.
How has this been tested?
I verified the variable styles set in 2021 are correctly reflected on the global styles UI.
I changed some values on the global styles UI to use some of the presets (font sizes, font family, colors, gradients) and verified using the browser dev tools the CSS vars are output in the generated CSS code.