Update: Remove duplicate style mappings from global styles #25145
Conversation
|
Size Change: -12 B (0%) Total Size: 1.2 MB
ℹ️ View Unchanged
|
| return reduce( | ||
| __EXPERIMENTAL_STYLE_MAPPINGS, | ||
| function ( declarations, stylePath, rawKey ) { | ||
| const key = kebabCase( rawKey ); |
There was a problem hiding this comment.
According to the docs, kebabCase("--wp--style--color--link") becomes wp-style-color-link, which causes issues both with blockSupports check and generating the declaration.
There was a problem hiding this comment.
Nice catch the issue was fixed 👍
| @@ -1,22 +1,9 @@ | |||
| /* CSS properties */ | |||
| export const FONT_SIZE = 'font-size'; | |||
| export const LINK_COLOR = '--wp--style--color--link'; | |||
There was a problem hiding this comment.
Don't we move the link color prop as well?
There was a problem hiding this comment.
The link color is used on this file and the other file so it makes sense to keep it as is and share it.
| } from '../editor/utils'; | ||
| import { LINK_COLOR } from '../editor/utils'; | ||
|
|
||
| const BACKGROUND_COLOR = 'background-color'; |
There was a problem hiding this comment.
Shouldn't these variables be moved to hooks/utils as well?
There was a problem hiding this comment.
I think it is fine to use background-color when needed. We are at the panel label so probably the panel should know the supports key is background-color. Moving the variables would only mean one uses BACKGROUND_COLOR instead of background-color which is not a big win.
|
The color and typography panels access the properties they need by using the strings |
|
The |
jorgefilipecosta
force-pushed
the
update/remove-duplicate-style-mappings-from-global-styles
branch
from
9fa5fb4 to
2980b27
Compare
I think both the style attributes of the block and the theme.json are the same thing. They are styles just saved in different locations (for now). So I guess we should promote reusability but in the future I expect the component used in style attributes and the components used in global styles become the same. I guess these components will probably be part of the block editor. As I think the path will probably the block editor exposing functionality used by global styles I think for now we can try to add things in the block editor. I expect in the future we may not need to expose the mappings and just expose components/functions from block editor. |
Trying the follow this feedback I end up submitting PR #25159, as currently, things are not in the array format so we could not use the paths we have in the central mapping. |
|
Hey @jorgefilipecosta I've slept on this and created an alternative at #25185 It builds upon some of the ideas you proposed here and added others that I missed :) |
|
Close in favor of #25185. |
youknowriad
deleted the
update/remove-duplicate-style-mappings-from-global-styles
branch
This updates the global styles compile mechanism to take advantage of the centralized style mappings instead of duplicating them.
How has this been tested?
I verified the global styles sidebar still works as expected.