Skip to content

Block Editor: Prevent negative width values in Spacer block when used inside a row block #68845

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

Merged

Conversation

himanshupathak95
Copy link
Contributor

@himanshupathak95 himanshupathak95 commented Jan 23, 2025

Fixes: #68847 (Point 1)

What?

Prevent negative width values in the Spacer block when used inside Row blocks.

Why?

Currently, when a Spacer block is placed in a Row block, it can accept negative width values, which is not ideal.

Testing Instructions

  • Create or open a post/page
  • Add a Row block
  • Insert a Spacer block inside the Row
  • Try to set a negative width value using the resize handle
  • Verify that the minimum width remains at 0

Screencast

Before

Screen.Recording.2025-01-23.at.13.00.11.mov

After

Screen.Recording.2025-01-23.at.12.59.23.mov

@himanshupathak95 himanshupathak95 marked this pull request as ready for review January 23, 2025 09:00
Copy link

github-actions bot commented Jan 23, 2025

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: himanshupathak95 <abcd95@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
Co-authored-by: yogeshbhutkar <yogeshbhutkar@git.wordpress.org>

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

@carolinan carolinan added [Block] Spacer Affects the Spacer Block [Type] Bug An existing feature does not function as intended labels Jan 29, 2025
Copy link
Member

@Mamaduka Mamaduka left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you, @himanshupathak95!

The fix looks good, and I think we can simplify it further. Could you also rebase this branch on top of the latest trunk?

Thanks

@@ -188,6 +192,7 @@ function FlexControls( {
} );
} }
value={ flexSize }
min={ minUnitValue }
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
min={ minUnitValue }
min={ 0 }

Suggestion: We can just hardcode value here and there's no need to pass minUnitValue. I cannot think of a case where negative height/width values should be allowed here.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The thought behind not hardcoding was to provide maximum flexibility. Thanks for the simplification :)

Copy link
Member

@Mamaduka Mamaduka Apr 17, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some leftovers for the minUnitValue prop remain. We should also remove those, as they no longer serve a purpose.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, @Mamaduka, I am on it.

@himanshupathak95 himanshupathak95 force-pushed the fix/spacer-row-negative-width-values branch from f0d0c0e to 2b6385e Compare April 17, 2025 07:35
Copy link
Member

@Mamaduka Mamaduka left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the follow-ups, @himanshupathak95!

@Mamaduka Mamaduka merged commit f207be9 into WordPress:trunk Apr 17, 2025
61 checks passed
@github-actions github-actions bot added this to the Gutenberg 20.8 milestone Apr 17, 2025
chriszarate pushed a commit to chriszarate/gutenberg that referenced this pull request Jul 1, 2025
… inside a row block (WordPress#68845)

Co-authored-by: himanshupathak95 <abcd95@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
Co-authored-by: yogeshbhutkar <yogeshbhutkar@git.wordpress.org>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Spacer Affects the Spacer Block [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Accessibility: Spacer Block's width attribute accepts and saves negative value
3 participants