bigbite / themer

GNU General Public License v2.0
2 stars 0 forks source link

Spacing is cleared when editing block styles #112

Open g-elwell opened 2 weeks ago

g-elwell commented 2 weeks ago

Expected Behavior

When navigating through the UI and editing different styles, no changes should be made unless specifically updated by a user.

Actual Behavior

When navigating to a block with spacing set in the theme.json, the styles update to clear the spacing.

Step-by-step reproduction instructions

  1. Set theme to Twenty Twenty Four
  2. Activate Themer
  3. Go to Appearance > Styles Editor
  4. Navigate to Blocks > Quote
  5. Notice the quote block will update to remove existing spacing values

Screenshots, screen recordings, code snippets

This is noticeable in the visual preview from #111 and less obvious when viewing the 'code preview'. However, note that the original spacing in theme.json is:

"spacing": {
  "padding": {
    "bottom": "calc(var(--wp--preset--spacing--30) + 0.75rem)",
    "left": "calc(var(--wp--preset--spacing--30) + 0.75rem)",
    "right": "calc(var(--wp--preset--spacing--30) + 0.75rem)",
    "top": "calc(var(--wp--preset--spacing--30) + 0.75rem)"
  }
},

But when navigating to the Quote block, the styles will show:

"spacing": {
  "padding": {
    "bottom": "0px",
    "left": "0px",
    "right": "0px",
    "top": "0px"
  }
}

https://github.com/user-attachments/assets/dce05ea3-99fb-4066-a0fc-5eaafc029595

g-elwell commented 2 weeks ago

It's likely this is due to the component failing to parse the original value, perhaps due to use of calc or var. As well as (or instead of?) fixing this instance, we should prevent the value from updating when the parsing has failed, or we could unexpectedly hit this issue again.