Repository navigation
Block Supports: Add the transform block support with a rotate feature - #15408
aaronrobertshaw wants to merge 5 commits into
Conversation
8b7e95c to
5abcdc3
Compare
Test using WordPress PlaygroundThe changes in this pull request can previewed and tested using a WordPress Playground instance. WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser. Some things to be aware of
For more details about these limitations and more, check out the Limitations page in the WordPress Playground documentation. |
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. Core Committers: Use this line as a base for the props when committing in SVN: To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. Props Bot commandsYou can trigger Props Bot actions by commenting on this PR:
|
Backports the PHP side of Gutenberg PR 86240: the transform block support, the transform.rotate setting and style in WP_Theme_JSON (blocks and block style variations only), the style engine rotate definition, and rotate in KSES limited to a single angle.
Adds the D modifier to WP_Style_Engine::VALID_ANGLE_PATTERN. Without it, $ matches before a final newline, so "45deg\n" passed validation.
47db68b to
9d0468a
Compare
Backport of Gutenberg PR WordPress/gutenberg#86240
Trac ticket: https://core.trac.wordpress.org/ticket/66468
Adds a transform block support with a single
rotatefeature. Blocks that opt in can be rotated by one angle. It outputs therotateCSS property, not thetransformshorthand, so existing block transforms still apply.This PR backports:
transformblock support,transform.rotateinWP_Theme_JSONsettings and styles, for blocks and block style variations only (not the root or elements),transform.rotatestyle engine definition, limited to a single angle,rotateinsafecss_filter_attr(), limited to a single angle,WP_Theme_JSONtests.The block opt-ins (Group, Heading, Image and Video
block.json), thetransform.rotatesetting in Core'stheme.jsonand the editor UI arrive later with the Gutenberg package update.Testing instructions
No Core block opts in yet, so test through theme.json styles.
theme.json, add"transform": { "rotate": "15deg" }understyles.blocks.core/group."transform": { "rotate": "5deg" }at the top level ofstyles.global-styles-inline-cssstyle tag contains:root :where(.wp-block-group){rotate: 15deg;}.rotate: 5degrule. Root transforms are dropped.calc(10deg + 5deg)and confirm the rule disappears. Only a single angle is output.Without this PR there is no
rotaterule at all.Use of AI
AI assistance: Yes
Tool(s): Claude Code
Model(s): Claude Opus 5
Used for: The mechanical port, tests and this description; I reviewed and edited the PR.