From bc2958e3fe6c0c48e659f532850e520456eb1fbd Mon Sep 17 00:00:00 2001 From: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com> Date: Thu, 1 Oct 2026 09:16:57 +0800 Subject: [PATCH] Embed: Add minimum width and height support --- docs/reference-guides/core-blocks/README.md | 2 +- packages/block-library/src/embed/README.md | 3 +++ packages/block-library/src/embed/block.json | 4 ++++ packages/block-library/src/embed/style.scss | 8 +++++++- 4 files changed, 15 insertions(+), 2 deletions(-) diff --git a/docs/reference-guides/core-blocks/README.md b/docs/reference-guides/core-blocks/README.md index 6d2046b8e725a6..b0b490eb9094b5 100644 --- a/docs/reference-guides/core-blocks/README.md +++ b/docs/reference-guides/core-blocks/README.md @@ -321,7 +321,7 @@ Add a block that displays content pulled from other sites, like Twitter or YouTu - **Name:** [core/embed](https://developer.wordpress.org/block-editor/reference-guides/core-blocks/core-blocks-embed/core-block-embed/) - **Category:** [embed](https://developer.wordpress.org/block-editor/reference-guides/core-blocks/core-blocks-embed/) -- **Supports:** align, anchor, interactivity (clientNavigation), spacing (margin, padding) +- **Supports:** align, anchor, dimensions (minHeight, minWidth), interactivity (clientNavigation), spacing (margin, padding) - **Attributes:** allowResponsive, caption, previewable, providerNameSlug, responsive, type, url ## File diff --git a/packages/block-library/src/embed/README.md b/packages/block-library/src/embed/README.md index edd38fda28fcda..b92e2683b49caa 100644 --- a/packages/block-library/src/embed/README.md +++ b/packages/block-library/src/embed/README.md @@ -28,6 +28,9 @@ _Defined via the [`supports`](https://developer.wordpress.org/block-editor/refer - [`anchor`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#anchor): `true` - [`align`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#align): `true` +- [`dimensions`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#dimensions): + - `minHeight`: `true` + - `minWidth`: `true` - [`spacing`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#spacing): - `margin`: `true` - `padding`: `true` diff --git a/packages/block-library/src/embed/block.json b/packages/block-library/src/embed/block.json index a7e161f430f915..41db597f299496 100644 --- a/packages/block-library/src/embed/block.json +++ b/packages/block-library/src/embed/block.json @@ -43,6 +43,10 @@ "supports": { "anchor": true, "align": true, + "dimensions": { + "minHeight": true, + "minWidth": true + }, "spacing": { "margin": true, "padding": true diff --git a/packages/block-library/src/embed/style.scss b/packages/block-library/src/embed/style.scss index eb3261f8655652..da0bd5fcd4e336 100644 --- a/packages/block-library/src/embed/style.scss +++ b/packages/block-library/src/embed/style.scss @@ -17,7 +17,9 @@ } // Supply a min-width when inside a cover block, to prevent it from collapsing. -.wp-block-cover .wp-block-embed { +// :root :where() matches Global Styles specificity so a minimum set there can +// win, since block library styles load first. +:root :where(.wp-block-cover .wp-block-embed) { min-width: 320px; min-height: 240px; } @@ -25,6 +27,10 @@ // Allow embeds to grow and shrink inside flex group blocks (Stack/Row), preventing collapse while fitting available space. .wp-block-group.is-layout-flex .wp-block-embed { flex: 1 1 0%; +} + +// Lowered like the cover minimums above. +:root :where(.wp-block-group.is-layout-flex .wp-block-embed) { min-width: 0; }