@wordpress/block-editor 15.8.1-next.16d95556a.0 → 15.8.1-next.dc3f6d3c1.0

package/build-module/utils/fit-text-utils.js

@@ -4,10 +4,17 @@ function findOptimalFontSize(textElement, applyFontSize) {
   let minSize = 5;
   let maxSize = 2400;
   let bestSize = minSize;
+  const computedStyle = window.getComputedStyle(textElement);
+  const paddingLeft = parseFloat(computedStyle.paddingLeft) || 0;
+  const paddingRight = parseFloat(computedStyle.paddingRight) || 0;
+  const range = document.createRange();
+  range.selectNodeContents(textElement);
   while (minSize <= maxSize) {
     const midSize = Math.floor((minSize + maxSize) / 2);
     applyFontSize(midSize);
-    const fitsWidth = textElement.scrollWidth <= textElement.clientWidth;
+    const rect = range.getBoundingClientRect();
+    const textWidth = rect.width;
+    const fitsWidth = textElement.scrollWidth <= textElement.clientWidth && textWidth <= textElement.clientWidth - paddingLeft - paddingRight;
     const fitsHeight = alreadyHasScrollableHeight || textElement.scrollHeight <= textElement.clientHeight;
     if (fitsWidth && fitsHeight) {
       bestSize = midSize;
@@ -16,6 +23,7 @@ function findOptimalFontSize(textElement, applyFontSize) {
       maxSize = midSize - 1;
     }
   }
+  range.detach();
   return bestSize;
 }
 function optimizeFitText(textElement, applyFontSize) {

package/build-module/utils/fit-text-utils.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/utils/fit-text-utils.js"],
-  "sourcesContent": ["/**\n * Shared utility functions for fit text functionality.\n * Uses callback-based approach for maximum code reuse between editor and frontend.\n */\n\n/**\n * Find optimal font size using simple binary search between 5-600px.\n *\n * @param {HTMLElement} textElement   The text element\n * @param {Function}    applyFontSize Function that receives font size in pixels\n * @return {number} Optimal font size\n */\nfunction findOptimalFontSize( textElement, applyFontSize ) {\n\tconst alreadyHasScrollableHeight =\n\t\ttextElement.scrollHeight > textElement.clientHeight;\n\tlet minSize = 5;\n\tlet maxSize = 2400;\n\tlet bestSize = minSize;\n\n\twhile ( minSize <= maxSize ) {\n\t\tconst midSize = Math.floor( ( minSize + maxSize ) / 2 );\n\t\tapplyFontSize( midSize );\n\n\t\tconst fitsWidth = textElement.scrollWidth <= textElement.clientWidth;\n\t\tconst fitsHeight =\n\t\t\talreadyHasScrollableHeight ||\n\t\t\ttextElement.scrollHeight <= textElement.clientHeight;\n\n\t\tif ( fitsWidth && fitsHeight ) {\n\t\t\tbestSize = midSize;\n\t\t\tminSize = midSize + 1;\n\t\t} else {\n\t\t\tmaxSize = midSize - 1;\n\t\t}\n\t}\n\n\treturn bestSize;\n}\n\n/**\n * Complete fit text optimization for a single text element.\n * Handles the full flow using callbacks for font size application.\n *\n * @param {HTMLElement} textElement   The text element (paragraph, heading, etc.)\n * @param {Function}    applyFontSize Function that receives font size in pixels (0 to clear, >0 to apply)\n */\nexport function optimizeFitText( textElement, applyFontSize ) {\n\tif ( ! textElement ) {\n\t\treturn;\n\t}\n\n\tapplyFontSize( 0 );\n\n\tconst optimalSize = findOptimalFontSize( textElement, applyFontSize );\n\n\tapplyFontSize( optimalSize );\n\treturn optimalSize;\n}\n"],
-  "mappings": ";AAYA,SAAS,oBAAqB,aAAa,eAAgB;AAC1D,QAAM,6BACL,YAAY,eAAe,YAAY;AACxC,MAAI,UAAU;AACd,MAAI,UAAU;AACd,MAAI,WAAW;AAEf,SAAQ,WAAW,SAAU;AAC5B,UAAM,UAAU,KAAK,OAAS,UAAU,WAAY,CAAE;AACtD,kBAAe,OAAQ;AAEvB,UAAM,YAAY,YAAY,eAAe,YAAY;AACzD,UAAM,aACL,8BACA,YAAY,gBAAgB,YAAY;AAEzC,QAAK,aAAa,YAAa;AAC9B,iBAAW;AACX,gBAAU,UAAU;AAAA,IACrB,OAAO;AACN,gBAAU,UAAU;AAAA,IACrB;AAAA,EACD;AAEA,SAAO;AACR;AASO,SAAS,gBAAiB,aAAa,eAAgB;AAC7D,MAAK,CAAE,aAAc;AACpB;AAAA,EACD;AAEA,gBAAe,CAAE;AAEjB,QAAM,cAAc,oBAAqB,aAAa,aAAc;AAEpE,gBAAe,WAAY;AAC3B,SAAO;AACR;",
+  "sourcesContent": ["/**\n * Shared utility functions for fit text functionality.\n * Uses callback-based approach for maximum code reuse between editor and frontend.\n */\n\n/**\n * Find optimal font size using simple binary search between 5-600px.\n *\n * @param {HTMLElement} textElement   The text element\n * @param {Function}    applyFontSize Function that receives font size in pixels\n * @return {number} Optimal font size\n */\nfunction findOptimalFontSize( textElement, applyFontSize ) {\n\tconst alreadyHasScrollableHeight =\n\t\ttextElement.scrollHeight > textElement.clientHeight;\n\tlet minSize = 5;\n\tlet maxSize = 2400;\n\tlet bestSize = minSize;\n\n\tconst computedStyle = window.getComputedStyle( textElement );\n\tconst paddingLeft = parseFloat( computedStyle.paddingLeft ) || 0;\n\tconst paddingRight = parseFloat( computedStyle.paddingRight ) || 0;\n\tconst range = document.createRange();\n\trange.selectNodeContents( textElement );\n\n\twhile ( minSize <= maxSize ) {\n\t\tconst midSize = Math.floor( ( minSize + maxSize ) / 2 );\n\t\tapplyFontSize( midSize );\n\n\t\t// When there is padding if the text overflows to the\n\t\t// padding area, it should be considered overflowing.\n\t\t// Use Range API to measure actual text content dimensions.\n\t\tconst rect = range.getBoundingClientRect();\n\t\tconst textWidth = rect.width;\n\n\t\t// Check if text fits within the element's width and is not\n\t\t// overflowing into the padding area.\n\t\tconst fitsWidth =\n\t\t\ttextElement.scrollWidth <= textElement.clientWidth &&\n\t\t\ttextWidth <= textElement.clientWidth - paddingLeft - paddingRight;\n\t\t// Check if text fits within the element's height.\n\t\tconst fitsHeight =\n\t\t\talreadyHasScrollableHeight ||\n\t\t\ttextElement.scrollHeight <= textElement.clientHeight;\n\n\t\tif ( fitsWidth && fitsHeight ) {\n\t\t\tbestSize = midSize;\n\t\t\tminSize = midSize + 1;\n\t\t} else {\n\t\t\tmaxSize = midSize - 1;\n\t\t}\n\t}\n\trange.detach();\n\n\treturn bestSize;\n}\n\n/**\n * Complete fit text optimization for a single text element.\n * Handles the full flow using callbacks for font size application.\n *\n * @param {HTMLElement} textElement   The text element (paragraph, heading, etc.)\n * @param {Function}    applyFontSize Function that receives font size in pixels (0 to clear, >0 to apply)\n */\nexport function optimizeFitText( textElement, applyFontSize ) {\n\tif ( ! textElement ) {\n\t\treturn;\n\t}\n\n\tapplyFontSize( 0 );\n\n\tconst optimalSize = findOptimalFontSize( textElement, applyFontSize );\n\n\tapplyFontSize( optimalSize );\n\treturn optimalSize;\n}\n"],
+  "mappings": ";AAYA,SAAS,oBAAqB,aAAa,eAAgB;AAC1D,QAAM,6BACL,YAAY,eAAe,YAAY;AACxC,MAAI,UAAU;AACd,MAAI,UAAU;AACd,MAAI,WAAW;AAEf,QAAM,gBAAgB,OAAO,iBAAkB,WAAY;AAC3D,QAAM,cAAc,WAAY,cAAc,WAAY,KAAK;AAC/D,QAAM,eAAe,WAAY,cAAc,YAAa,KAAK;AACjE,QAAM,QAAQ,SAAS,YAAY;AACnC,QAAM,mBAAoB,WAAY;AAEtC,SAAQ,WAAW,SAAU;AAC5B,UAAM,UAAU,KAAK,OAAS,UAAU,WAAY,CAAE;AACtD,kBAAe,OAAQ;AAKvB,UAAM,OAAO,MAAM,sBAAsB;AACzC,UAAM,YAAY,KAAK;AAIvB,UAAM,YACL,YAAY,eAAe,YAAY,eACvC,aAAa,YAAY,cAAc,cAAc;AAEtD,UAAM,aACL,8BACA,YAAY,gBAAgB,YAAY;AAEzC,QAAK,aAAa,YAAa;AAC9B,iBAAW;AACX,gBAAU,UAAU;AAAA,IACrB,OAAO;AACN,gBAAU,UAAU;AAAA,IACrB;AAAA,EACD;AACA,QAAM,OAAO;AAEb,SAAO;AACR;AASO,SAAS,gBAAiB,aAAa,eAAgB;AAC7D,MAAK,CAAE,aAAc;AACpB;AAAA,EACD;AAEA,gBAAe,CAAE;AAEjB,QAAM,cAAc,oBAAqB,aAAa,aAAc;AAEpE,gBAAe,WAAY;AAC3B,SAAO;AACR;",
   "names": []
 }

package/build-style/style-rtl.css

@@ -1623,6 +1623,138 @@ iframe[name=editor-canvas] {
   }
 }
 
+.block-editor-content-only-controls__link {
+  width: 100%;
+  box-shadow: inset 0 0 0 1px #ccc;
+}
+.block-editor-content-only-controls__link:focus:not(:disabled) {
+  box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+}
+
+.block-editor-content-only-controls__link-row {
+  align-items: center;
+}
+
+.block-editor-content-only-controls__link-title {
+  width: 100%;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+.block-editor-content-only-controls__media {
+  width: 100%;
+  box-shadow: inset 0 0 0 1px #ccc;
+}
+.block-editor-content-only-controls__media:focus:not(:disabled) {
+  box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+}
+
+.block-editor-content-only-controls__media-replace-flow {
+  display: block;
+}
+
+.block-editor-content-only-controls__media-row {
+  align-items: center;
+}
+
+.block-editor-content-only-controls__media-placeholder {
+  width: 24px;
+  height: 24px;
+  border-radius: 2px;
+  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
+  display: inline-block;
+  padding: 0;
+  background: #fff linear-gradient(45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
+}
+
+.block-editor-content-only-controls__media-title {
+  width: 100%;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+block-editor-content-only-controls__media-thumbnail {
+  width: 100%;
+  height: 100%;
+  border-radius: 2px;
+  align-self: center;
+}
+
+.block-editor-content-only-controls__rich-text {
+  width: 100%;
+  margin: 0;
+  background: #fff;
+  color: #1e1e1e;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+  padding: 6px 8px;
+  /* Fonts smaller than 16px causes mobile safari to zoom. */
+  font-size: 16px;
+  /* Override core line-height. To be reviewed. */
+  line-height: normal;
+  box-shadow: 0 0 0 transparent;
+  border-radius: 2px;
+  border: 1px solid #949494;
+}
+@media not (prefers-reduced-motion) {
+  .block-editor-content-only-controls__rich-text {
+    transition: box-shadow 0.1s linear;
+  }
+}
+@media (min-width: 600px) {
+  .block-editor-content-only-controls__rich-text {
+    font-size: 13px;
+    /* Override core line-height. To be reviewed. */
+    line-height: normal;
+  }
+}
+.block-editor-content-only-controls__rich-text:focus {
+  border-color: var(--wp-admin-theme-color, #3858e9);
+  box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color, #3858e9);
+  outline: 2px solid transparent;
+}
+.block-editor-content-only-controls__rich-text::-webkit-input-placeholder {
+  color: rgba(30, 30, 30, 0.62);
+}
+.block-editor-content-only-controls__rich-text::-moz-placeholder {
+  color: rgba(30, 30, 30, 0.62);
+}
+.block-editor-content-only-controls__rich-text:-ms-input-placeholder {
+  color: rgba(30, 30, 30, 0.62);
+}
+.block-editor-content-only-controls__rich-text {
+  border-color: #949494;
+}
+.block-editor-content-only-controls__rich-text::placeholder {
+  color: color-mix(in srgb, #1e1e1e, transparent 38%);
+}
+.block-editor-content-only-controls__rich-text {
+  min-height: 40px;
+  padding: 12px;
+}
+
+.block-editor-content-only-controls__screen.components-navigator-screen {
+  padding: 8px 0 0 0;
+}
+.block-editor-content-only-controls__screen {
+  border-top: 1px solid #e0e0e0;
+}
+.block-editor-content-only-controls__screen .components-tools-panel {
+  border-top: none;
+  padding-top: 8px;
+}
+
+.block-editor-content-only-controls__button-panel {
+  padding: 4px;
+  font-weight: 500 !important;
+}
+
+.block-editor-content-only-controls__back-button,
+.block-editor-content-only-controls__drill-down-button {
+  width: 100%;
+}
+
 .block-editor-date-format-picker {
   margin: 0 0 16px;
   padding: 0;

package/build-style/style.css

@@ -1623,6 +1623,138 @@ iframe[name=editor-canvas] {
   }
 }
 
+.block-editor-content-only-controls__link {
+  width: 100%;
+  box-shadow: inset 0 0 0 1px #ccc;
+}
+.block-editor-content-only-controls__link:focus:not(:disabled) {
+  box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+}
+
+.block-editor-content-only-controls__link-row {
+  align-items: center;
+}
+
+.block-editor-content-only-controls__link-title {
+  width: 100%;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+.block-editor-content-only-controls__media {
+  width: 100%;
+  box-shadow: inset 0 0 0 1px #ccc;
+}
+.block-editor-content-only-controls__media:focus:not(:disabled) {
+  box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+}
+
+.block-editor-content-only-controls__media-replace-flow {
+  display: block;
+}
+
+.block-editor-content-only-controls__media-row {
+  align-items: center;
+}
+
+.block-editor-content-only-controls__media-placeholder {
+  width: 24px;
+  height: 24px;
+  border-radius: 2px;
+  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
+  display: inline-block;
+  padding: 0;
+  background: #fff linear-gradient(-45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
+}
+
+.block-editor-content-only-controls__media-title {
+  width: 100%;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+block-editor-content-only-controls__media-thumbnail {
+  width: 100%;
+  height: 100%;
+  border-radius: 2px;
+  align-self: center;
+}
+
+.block-editor-content-only-controls__rich-text {
+  width: 100%;
+  margin: 0;
+  background: #fff;
+  color: #1e1e1e;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+  padding: 6px 8px;
+  /* Fonts smaller than 16px causes mobile safari to zoom. */
+  font-size: 16px;
+  /* Override core line-height. To be reviewed. */
+  line-height: normal;
+  box-shadow: 0 0 0 transparent;
+  border-radius: 2px;
+  border: 1px solid #949494;
+}
+@media not (prefers-reduced-motion) {
+  .block-editor-content-only-controls__rich-text {
+    transition: box-shadow 0.1s linear;
+  }
+}
+@media (min-width: 600px) {
+  .block-editor-content-only-controls__rich-text {
+    font-size: 13px;
+    /* Override core line-height. To be reviewed. */
+    line-height: normal;
+  }
+}
+.block-editor-content-only-controls__rich-text:focus {
+  border-color: var(--wp-admin-theme-color, #3858e9);
+  box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color, #3858e9);
+  outline: 2px solid transparent;
+}
+.block-editor-content-only-controls__rich-text::-webkit-input-placeholder {
+  color: rgba(30, 30, 30, 0.62);
+}
+.block-editor-content-only-controls__rich-text::-moz-placeholder {
+  color: rgba(30, 30, 30, 0.62);
+}
+.block-editor-content-only-controls__rich-text:-ms-input-placeholder {
+  color: rgba(30, 30, 30, 0.62);
+}
+.block-editor-content-only-controls__rich-text {
+  border-color: #949494;
+}
+.block-editor-content-only-controls__rich-text::placeholder {
+  color: color-mix(in srgb, #1e1e1e, transparent 38%);
+}
+.block-editor-content-only-controls__rich-text {
+  min-height: 40px;
+  padding: 12px;
+}
+
+.block-editor-content-only-controls__screen.components-navigator-screen {
+  padding: 8px 0 0 0;
+}
+.block-editor-content-only-controls__screen {
+  border-top: 1px solid #e0e0e0;
+}
+.block-editor-content-only-controls__screen .components-tools-panel {
+  border-top: none;
+  padding-top: 8px;
+}
+
+.block-editor-content-only-controls__button-panel {
+  padding: 4px;
+  font-weight: 500 !important;
+}
+
+.block-editor-content-only-controls__back-button,
+.block-editor-content-only-controls__drill-down-button {
+  width: 100%;
+}
+
 .block-editor-date-format-picker {
   margin: 0 0 16px;
   padding: 0;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-editor",
-	"version": "15.8.1-next.16d95556a.0",
+	"version": "15.8.1-next.dc3f6d3c1.0",
 	"description": "Generic block editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -55,41 +55,41 @@
 		"@emotion/react": "^11.7.1",
 		"@emotion/styled": "^11.6.0",
 		"@react-spring/web": "^9.4.5",
-		"@wordpress/a11y": "^4.35.1-next.16d95556a.0",
-		"@wordpress/api-fetch": "^7.35.1-next.16d95556a.0",
-		"@wordpress/base-styles": "^6.11.1-next.16d95556a.0",
-		"@wordpress/blob": "^4.35.1-next.16d95556a.0",
-		"@wordpress/block-serialization-default-parser": "^5.35.1-next.16d95556a.0",
-		"@wordpress/blocks": "^15.8.1-next.16d95556a.0",
-		"@wordpress/commands": "^1.35.1-next.16d95556a.0",
-		"@wordpress/components": "^30.8.1-next.16d95556a.0",
-		"@wordpress/compose": "^7.35.1-next.16d95556a.0",
-		"@wordpress/data": "^10.35.1-next.16d95556a.0",
-		"@wordpress/date": "^5.35.1-next.16d95556a.0",
-		"@wordpress/deprecated": "^4.35.1-next.16d95556a.0",
-		"@wordpress/dom": "^4.35.1-next.16d95556a.0",
-		"@wordpress/element": "^6.35.1-next.16d95556a.0",
-		"@wordpress/escape-html": "^3.35.1-next.16d95556a.0",
-		"@wordpress/global-styles-engine": "^1.2.1-next.16d95556a.0",
-		"@wordpress/hooks": "^4.35.1-next.16d95556a.0",
-		"@wordpress/html-entities": "^4.35.1-next.16d95556a.0",
-		"@wordpress/i18n": "^6.8.1-next.16d95556a.0",
-		"@wordpress/icons": "^11.2.1-next.16d95556a.0",
-		"@wordpress/interactivity": "^6.35.1-next.16d95556a.0",
-		"@wordpress/is-shallow-equal": "^5.35.1-next.16d95556a.0",
-		"@wordpress/keyboard-shortcuts": "^5.35.1-next.16d95556a.0",
-		"@wordpress/keycodes": "^4.35.1-next.16d95556a.0",
-		"@wordpress/notices": "^5.35.1-next.16d95556a.0",
-		"@wordpress/preferences": "^4.35.1-next.16d95556a.0",
-		"@wordpress/priority-queue": "^3.35.1-next.16d95556a.0",
-		"@wordpress/private-apis": "^1.35.1-next.16d95556a.0",
-		"@wordpress/rich-text": "^7.35.1-next.16d95556a.0",
-		"@wordpress/style-engine": "^2.35.1-next.16d95556a.0",
-		"@wordpress/token-list": "^3.35.1-next.16d95556a.0",
-		"@wordpress/upload-media": "^0.20.1-next.16d95556a.0",
-		"@wordpress/url": "^4.35.1-next.16d95556a.0",
-		"@wordpress/warning": "^3.35.1-next.16d95556a.0",
-		"@wordpress/wordcount": "^4.35.1-next.16d95556a.0",
+		"@wordpress/a11y": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/api-fetch": "^7.35.1-next.dc3f6d3c1.0",
+		"@wordpress/base-styles": "^6.11.1-next.dc3f6d3c1.0",
+		"@wordpress/blob": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/block-serialization-default-parser": "^5.35.1-next.dc3f6d3c1.0",
+		"@wordpress/blocks": "^15.8.1-next.dc3f6d3c1.0",
+		"@wordpress/commands": "^1.35.1-next.dc3f6d3c1.0",
+		"@wordpress/components": "^30.8.2-next.dc3f6d3c1.0",
+		"@wordpress/compose": "^7.35.1-next.dc3f6d3c1.0",
+		"@wordpress/data": "^10.35.1-next.dc3f6d3c1.0",
+		"@wordpress/date": "^5.35.1-next.dc3f6d3c1.0",
+		"@wordpress/deprecated": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/dom": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/element": "^6.35.1-next.dc3f6d3c1.0",
+		"@wordpress/escape-html": "^3.35.1-next.dc3f6d3c1.0",
+		"@wordpress/global-styles-engine": "^1.2.1-next.dc3f6d3c1.0",
+		"@wordpress/hooks": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/html-entities": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/i18n": "^6.8.1-next.dc3f6d3c1.0",
+		"@wordpress/icons": "^11.2.1-next.dc3f6d3c1.0",
+		"@wordpress/interactivity": "^6.35.1-next.dc3f6d3c1.0",
+		"@wordpress/is-shallow-equal": "^5.35.1-next.dc3f6d3c1.0",
+		"@wordpress/keyboard-shortcuts": "^5.35.1-next.dc3f6d3c1.0",
+		"@wordpress/keycodes": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/notices": "^5.35.1-next.dc3f6d3c1.0",
+		"@wordpress/preferences": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/priority-queue": "^3.35.1-next.dc3f6d3c1.0",
+		"@wordpress/private-apis": "^1.35.1-next.dc3f6d3c1.0",
+		"@wordpress/rich-text": "^7.35.1-next.dc3f6d3c1.0",
+		"@wordpress/style-engine": "^2.35.1-next.dc3f6d3c1.0",
+		"@wordpress/token-list": "^3.35.1-next.dc3f6d3c1.0",
+		"@wordpress/upload-media": "^0.20.1-next.dc3f6d3c1.0",
+		"@wordpress/url": "^4.35.1-next.dc3f6d3c1.0",
+		"@wordpress/warning": "^3.35.1-next.dc3f6d3c1.0",
+		"@wordpress/wordcount": "^4.35.1-next.dc3f6d3c1.0",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.7.0",
@@ -112,5 +112,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "59a9383612bbe16e21af84d13b035bfbca7fe833"
+	"gitHead": "f73b5e69b34fbaccfb8c47783f4f993059ff1a41"
 }

package/src/components/block-inspector/edit-contents.js

@@ -2,40 +2,21 @@
  * WordPress dependencies
  */
 import { Button, __experimentalVStack as VStack } from '@wordpress/components';
-import { useDispatch, useSelect } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 
 /**
  * Internal dependencies
  */
-import { store as blockEditorStore } from '../../store';
-import { unlock } from '../../lock-unlock';
+import useContentOnlySectionEdit from '../../hooks/use-content-only-section-edit';
 
 export default function EditContents( { clientId } ) {
-	const { editContentOnlySection, stopEditingContentOnlySection } = unlock(
-		useDispatch( blockEditorStore )
-	);
-	const { isWithinSection, isWithinEditedSection, editedContentOnlySection } =
-		useSelect(
-			( select ) => {
-				const {
-					isSectionBlock,
-					getParentSectionBlock,
-					getEditedContentOnlySection,
-					isWithinEditedContentOnlySection,
-				} = unlock( select( blockEditorStore ) );
-
-				return {
-					isWithinSection:
-						isSectionBlock( clientId ) ||
-						!! getParentSectionBlock( clientId ),
-					isWithinEditedSection:
-						isWithinEditedContentOnlySection( clientId ),
-					editedContentOnlySection: getEditedContentOnlySection(),
-				};
-			},
-			[ clientId ]
-		);
+	const {
+		isWithinSection,
+		isWithinEditedSection,
+		editedContentOnlySection,
+		editContentOnlySection,
+		stopEditingContentOnlySection,
+	} = useContentOnlySectionEdit( clientId );
 
 	if ( ! isWithinSection && ! isWithinEditedSection ) {
 		return null;
@@ -56,8 +37,8 @@ export default function EditContents( { clientId } ) {
 				} }
 			>
 				{ editedContentOnlySection
-					? __( 'Exit pattern' )
-					: __( 'Edit pattern' ) }
+					? __( 'Exit section' )
+					: __( 'Edit section' ) }
 			</Button>
 		</VStack>
 	);

package/src/components/block-inspector/index.js

@@ -29,7 +29,6 @@ import PositionControls from '../inspector-controls-tabs/position-controls-panel
 import useBlockInspectorAnimationSettings from './useBlockInspectorAnimationSettings';
 import { useBorderPanelLabel } from '../../hooks/border';
 import ContentTab from '../inspector-controls-tabs/content-tab';
-
 import { unlock } from '../../lock-unlock';
 
 function BlockStylesPanel( { clientId } ) {
@@ -368,7 +367,10 @@ const BlockInspectorSingleBlock = ( {
 					{ hasBlockStyles && (
 						<BlockStylesPanel clientId={ clientId } />
 					) }
-					<ContentTab contentClientIds={ contentClientIds } />
+					<ContentTab
+						rootClientId={ clientId }
+						contentClientIds={ contentClientIds }
+					/>
 					{ ! isSectionBlock && (
 						<StyleInspectorSlots
 							blockName={ blockName }

package/src/components/block-list/block.js

@@ -563,6 +563,7 @@ function BlockListBlockProvider( props ) {
 				isSelectionEnabled,
 				getTemplateLock,
 				isSectionBlock: _isSectionBlock,
+				getParentSectionBlock,
 				getBlockWithoutAttributes,
 				getBlockAttributes,
 				canRemoveBlock,
@@ -674,6 +675,9 @@ function BlockListBlockProvider( props ) {
 				isSelectionEnabled: isSelectionEnabled(),
 				isLocked: !! getTemplateLock( rootClientId ),
 				isSectionBlock: _isSectionBlock( clientId ),
+				isWithinSectionBlock:
+					_isSectionBlock( clientId ) ||
+					!! getParentSectionBlock( clientId ),
 				canRemove,
 				canMove,
 				isSelected: _isSelected,
@@ -756,6 +760,7 @@ function BlockListBlockProvider( props ) {
 		isDragging,
 		hasChildSelected,
 		isSectionBlock,
+		isWithinSectionBlock,
 		isEditingDisabled,
 		hasEditableOutline,
 		className,
@@ -802,6 +807,7 @@ function BlockListBlockProvider( props ) {
 		isDragging,
 		hasChildSelected,
 		isSectionBlock,
+		isWithinSectionBlock,
 		isEditingDisabled,
 		hasEditableOutline,
 		isEditingContentOnlySection,

package/src/components/block-list/use-block-props/index.js

@@ -100,6 +100,7 @@ export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
 		isEditingContentOnlySection,
 		defaultClassName,
 		isSectionBlock,
+		isWithinSectionBlock,
 		canMove,
 		isBlockHidden,
 	} = useContext( PrivateBlockContext );
@@ -108,13 +109,14 @@ export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
 	const blockLabel = sprintf( __( 'Block: %s' ), blockTitle );
 	const htmlSuffix = mode === 'html' && ! __unstableIsHtml ? '-visual' : '';
 	const ffDragRef = useFirefoxDraggableCompatibility();
+	const isHoverEnabled = ! isWithinSectionBlock;
 	const mergedRefs = useMergeRefs( [
 		props.ref,
 		useFocusFirstElement( { clientId, initialPosition } ),
 		useBlockRefProvider( clientId ),
 		useFocusHandler( clientId ),
 		useEventHandlers( { clientId, isSelected } ),
-		useIsHovered(),
+		useIsHovered( { isEnabled: isHoverEnabled } ),
 		useIntersectionObserver(),
 		useMovingAnimation( { triggerAnimationOnChange: index, clientId } ),
 		useDisabled( { isDisabled: ! hasOverlay } ),

package/src/components/block-list/use-block-props/use-is-hovered.js

@@ -15,21 +15,33 @@ function listener( event ) {
 	);
 }
 
-/*
+/**
  * Adds `is-hovered` class when the block is hovered and in navigation or
  * outline mode.
+ *
+ * @param {Object}  options                  Options object.
+ * @param {boolean} [options.isEnabled=true] Whether to enable hover detection.
+ *
+ * @return {Function} Ref callback.
  */
-export function useIsHovered() {
-	return useRefEffect( ( node ) => {
-		node.addEventListener( 'mouseout', listener );
-		node.addEventListener( 'mouseover', listener );
+export function useIsHovered( { isEnabled = true } = {} ) {
+	return useRefEffect(
+		( node ) => {
+			if ( ! isEnabled ) {
+				return;
+			}
+
+			node.addEventListener( 'mouseout', listener );
+			node.addEventListener( 'mouseover', listener );
 
-		return () => {
-			node.removeEventListener( 'mouseout', listener );
-			node.removeEventListener( 'mouseover', listener );
+			return () => {
+				node.removeEventListener( 'mouseout', listener );
+				node.removeEventListener( 'mouseover', listener );
 
-			// Remove class in case it lingers.
-			node.classList.remove( 'is-hovered' );
-		};
-	}, [] );
+				// Remove class in case it lingers.
+				node.classList.remove( 'is-hovered' );
+			};
+		},
+		[ isEnabled ]
+	);
 }

package/src/components/block-settings-menu-controls/edit-section-menu-item.js

@@ -0,0 +1,39 @@
+/**
+ * WordPress dependencies
+ */
+import { MenuItem } from '@wordpress/components';
+import { _x } from '@wordpress/i18n';
+
+/**
+ * Internal dependencies
+ */
+import useContentOnlySectionEdit from '../../hooks/use-content-only-section-edit';
+
+export function EditSectionMenuItem( { clientId, onClose } ) {
+	const {
+		isSectionBlock,
+		isEditingContentOnlySection,
+		editContentOnlySection,
+	} = useContentOnlySectionEdit( clientId );
+
+	// Only show when the experiment is enabled, the block is a section block,
+	// and we're not already editing it
+	if (
+		! window?.__experimentalContentOnlyPatternInsertion ||
+		! isSectionBlock ||
+		isEditingContentOnlySection
+	) {
+		return null;
+	}
+
+	return (
+		<MenuItem
+			onClick={ () => {
+				editContentOnlySection( clientId );
+				onClose();
+			} }
+		>
+			{ _x( 'Edit section', 'Editing a section in the Editor' ) }
+		</MenuItem>
+	);
+}

package/src/components/block-settings-menu-controls/index.js

@@ -22,6 +22,7 @@ import BlockModeToggle from '../block-settings-menu/block-mode-toggle';
 import { ModifyContentOnlySectionMenuItem } from '../content-lock';
 import { BlockRenameControl, useBlockRename } from '../block-rename';
 import { BlockVisibilityMenuItem } from '../block-visibility';
+import { EditSectionMenuItem } from './edit-section-menu-item';
 
 const { Fill, Slot } = createSlotFill( 'BlockSettingsMenuControls' );
 
@@ -98,6 +99,12 @@ const BlockSettingsMenuControlsSlot = ( { fillProps, clientIds = null } ) => {
 								onClose={ fillProps?.onClose }
 							/>
 						) }
+						{ selectedClientIds.length === 1 && (
+							<EditSectionMenuItem
+								clientId={ selectedClientIds[ 0 ] }
+								onClose={ fillProps?.onClose }
+							/>
+						) }
 						{ showLockButton && (
 							<BlockLockMenuItem
 								clientId={ selectedClientIds[ 0 ] }