@wordpress/block-editor 12.3.0 → 12.3.1

package/build-module/utils/object.js

@@ -1,3 +1,7 @@
+/**
+ * External dependencies
+ */
+import { paramCase } from 'change-case';
 /**
  * Converts a path to an array of its fragments.
  * Supports strings, numbers and arrays:
@@ -9,6 +13,7 @@
  * @param {string|number|Array} path Path
  * @return {Array} Normalized path.
  */
+
 function normalizePath(path) {
   if (Array.isArray(path)) {
     return path;
@@ -18,6 +23,38 @@ function normalizePath(path) {
 
   return [path];
 }
+/**
+ * Converts any string to kebab case.
+ * Backwards compatible with Lodash's `_.kebabCase()`.
+ * Backwards compatible with `_wp_to_kebab_case()`.
+ *
+ * @see https://lodash.com/docs/4.17.15#kebabCase
+ * @see https://developer.wordpress.org/reference/functions/_wp_to_kebab_case/
+ *
+ * @param {string} str String to convert.
+ * @return {string} Kebab-cased string
+ */
+
+
+export function kebabCase(str) {
+  let input = str;
+
+  if (typeof str !== 'string') {
+    var _str$toString;
+
+    input = (_str$toString = str?.toString?.()) !== null && _str$toString !== void 0 ? _str$toString : '';
+  } // See https://github.com/lodash/lodash/blob/b185fcee26b2133bd071f4aaca14b455c2ed1008/lodash.js#L4970
+
+
+  input = input.replace(/['\u2019]/, '');
+  return paramCase(input, {
+    splitRegexp: [/(?!(?:1ST|2ND|3RD|[4-9]TH)(?![a-z]))([a-z0-9])([A-Z])/g, // fooBar => foo-bar, 3Bar => 3-bar
+    /(?!(?:1st|2nd|3rd|[4-9]th)(?![a-z]))([0-9])([a-z])/g, // 3bar => 3-bar
+    /([A-Za-z])([0-9])/g, // Foo3 => foo-3, foo3 => foo-3
+    /([A-Z])([A-Z][a-z])/g // FOOBar => foo-bar
+    ]
+  });
+}
 /**
  * Clones an object.
  * Non-object values are returned unchanged.
@@ -26,7 +63,6 @@ function normalizePath(path) {
  * @return {*} Cloned object, or original literal non-object value.
  */
 
-
 function cloneObject(object) {
   if (object && typeof object === 'object') {
     return { ...Object.fromEntries(Object.entries(object).map(([key, value]) => [key, cloneObject(value)]))

package/build-module/utils/object.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/utils/object.js"],"names":["normalizePath","path","Array","isArray","toString","cloneObject","object","Object","fromEntries","entries","map","key","value","setImmutably","normalizedPath","newObject","reduce","acc","i","undefined","length"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,aAAT,CAAwBC,IAAxB,EAA+B;AAC9B,MAAKC,KAAK,CAACC,OAAN,CAAeF,IAAf,CAAL,EAA6B;AAC5B,WAAOA,IAAP;AACA,GAFD,MAEO,IAAK,OAAOA,IAAP,KAAgB,QAArB,EAAgC;AACtC,WAAO,CAAEA,IAAI,CAACG,QAAL,EAAF,CAAP;AACA;;AAED,SAAO,CAAEH,IAAF,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASI,WAAT,CAAsBC,MAAtB,EAA+B;AAC9B,MAAKA,MAAM,IAAI,OAAOA,MAAP,KAAkB,QAAjC,EAA4C;AAC3C,WAAO,EACN,GAAGC,MAAM,CAACC,WAAP,CACFD,MAAM,CAACE,OAAP,CAAgBH,MAAhB,EAAyBI,GAAzB,CAA8B,CAAE,CAAEC,GAAF,EAAOC,KAAP,CAAF,KAAsB,CACnDD,GADmD,EAEnDN,WAAW,CAAEO,KAAF,CAFwC,CAApD,CADE;AADG,KAAP;AAQA;;AAED,SAAON,MAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,SAASO,YAAT,CAAuBP,MAAvB,EAA+BL,IAA/B,EAAqCW,KAArC,EAA6C;AACnD,QAAME,cAAc,GAAGd,aAAa,CAAEC,IAAF,CAApC;AACA,QAAMc,SAAS,GAAGT,MAAM,GAAGD,WAAW,CAAEC,MAAF,CAAd,GAA2B,EAAnD;AAEAQ,EAAAA,cAAc,CAACE,MAAf,CAAuB,CAAEC,GAAF,EAAON,GAAP,EAAYO,CAAZ,KAAmB;AACzC,QAAKD,GAAG,CAAEN,GAAF,CAAH,KAAeQ,SAApB,EAAgC;AAC/BF,MAAAA,GAAG,CAAEN,GAAF,CAAH,GAAa,EAAb;AACA;;AACD,QAAKO,CAAC,KAAKJ,cAAc,CAACM,MAAf,GAAwB,CAAnC,EAAuC;AACtCH,MAAAA,GAAG,CAAEN,GAAF,CAAH,GAAaC,KAAb;AACA;;AACD,WAAOK,GAAG,CAAEN,GAAF,CAAV;AACA,GARD,EAQGI,SARH;AAUA,SAAOA,SAAP;AACA","sourcesContent":["/**\n * Converts a path to an array of its fragments.\n * Supports strings, numbers and arrays:\n *\n * 'foo' => [ 'foo' ]\n * 2 => [ '2' ]\n * [ 'foo', 'bar' ] => [ 'foo', 'bar' ]\n *\n * @param {string|number|Array} path Path\n * @return {Array} Normalized path.\n */\nfunction normalizePath( path ) {\n\tif ( Array.isArray( path ) ) {\n\t\treturn path;\n\t} else if ( typeof path === 'number' ) {\n\t\treturn [ path.toString() ];\n\t}\n\n\treturn [ path ];\n}\n\n/**\n * Clones an object.\n * Non-object values are returned unchanged.\n *\n * @param {*} object Object to clone.\n * @return {*} Cloned object, or original literal non-object value.\n */\nfunction cloneObject( object ) {\n\tif ( object && typeof object === 'object' ) {\n\t\treturn {\n\t\t\t...Object.fromEntries(\n\t\t\t\tObject.entries( object ).map( ( [ key, value ] ) => [\n\t\t\t\t\tkey,\n\t\t\t\t\tcloneObject( value ),\n\t\t\t\t] )\n\t\t\t),\n\t\t};\n\t}\n\n\treturn object;\n}\n\n/**\n * Immutably sets a value inside an object. Like `lodash#set`, but returning a\n * new object. Treats nullish initial values as empty objects. Clones any\n * nested objects.\n *\n * @param {Object}              object Object to set a value in.\n * @param {number|string|Array} path   Path in the object to modify.\n * @param {*}                   value  New value to set.\n * @return {Object} Cloned object with the new value set.\n */\nexport function setImmutably( object, path, value ) {\n\tconst normalizedPath = normalizePath( path );\n\tconst newObject = object ? cloneObject( object ) : {};\n\n\tnormalizedPath.reduce( ( acc, key, i ) => {\n\t\tif ( acc[ key ] === undefined ) {\n\t\t\tacc[ key ] = {};\n\t\t}\n\t\tif ( i === normalizedPath.length - 1 ) {\n\t\t\tacc[ key ] = value;\n\t\t}\n\t\treturn acc[ key ];\n\t}, newObject );\n\n\treturn newObject;\n}\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/utils/object.js"],"names":["paramCase","normalizePath","path","Array","isArray","toString","kebabCase","str","input","replace","splitRegexp","cloneObject","object","Object","fromEntries","entries","map","key","value","setImmutably","normalizedPath","newObject","reduce","acc","i","undefined","length"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,aAA1B;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,aAAT,CAAwBC,IAAxB,EAA+B;AAC9B,MAAKC,KAAK,CAACC,OAAN,CAAeF,IAAf,CAAL,EAA6B;AAC5B,WAAOA,IAAP;AACA,GAFD,MAEO,IAAK,OAAOA,IAAP,KAAgB,QAArB,EAAgC;AACtC,WAAO,CAAEA,IAAI,CAACG,QAAL,EAAF,CAAP;AACA;;AAED,SAAO,CAAEH,IAAF,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,SAASI,SAAT,CAAoBC,GAApB,EAA0B;AAChC,MAAIC,KAAK,GAAGD,GAAZ;;AACA,MAAK,OAAOA,GAAP,KAAe,QAApB,EAA+B;AAAA;;AAC9BC,IAAAA,KAAK,oBAAGD,GAAG,EAAEF,QAAL,IAAH,yDAAwB,EAA7B;AACA,GAJ+B,CAMhC;;;AACAG,EAAAA,KAAK,GAAGA,KAAK,CAACC,OAAN,CAAe,WAAf,EAA4B,EAA5B,CAAR;AAEA,SAAOT,SAAS,CAAEQ,KAAF,EAAS;AACxBE,IAAAA,WAAW,EAAE,CACZ,wDADY,EAC8C;AAC1D,yDAFY,EAE2C;AACvD,wBAHY,EAGU;AACtB,0BAJY,CAIY;AAJZ;AADW,GAAT,CAAhB;AAQA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,WAAT,CAAsBC,MAAtB,EAA+B;AAC9B,MAAKA,MAAM,IAAI,OAAOA,MAAP,KAAkB,QAAjC,EAA4C;AAC3C,WAAO,EACN,GAAGC,MAAM,CAACC,WAAP,CACFD,MAAM,CAACE,OAAP,CAAgBH,MAAhB,EAAyBI,GAAzB,CAA8B,CAAE,CAAEC,GAAF,EAAOC,KAAP,CAAF,KAAsB,CACnDD,GADmD,EAEnDN,WAAW,CAAEO,KAAF,CAFwC,CAApD,CADE;AADG,KAAP;AAQA;;AAED,SAAON,MAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,SAASO,YAAT,CAAuBP,MAAvB,EAA+BV,IAA/B,EAAqCgB,KAArC,EAA6C;AACnD,QAAME,cAAc,GAAGnB,aAAa,CAAEC,IAAF,CAApC;AACA,QAAMmB,SAAS,GAAGT,MAAM,GAAGD,WAAW,CAAEC,MAAF,CAAd,GAA2B,EAAnD;AAEAQ,EAAAA,cAAc,CAACE,MAAf,CAAuB,CAAEC,GAAF,EAAON,GAAP,EAAYO,CAAZ,KAAmB;AACzC,QAAKD,GAAG,CAAEN,GAAF,CAAH,KAAeQ,SAApB,EAAgC;AAC/BF,MAAAA,GAAG,CAAEN,GAAF,CAAH,GAAa,EAAb;AACA;;AACD,QAAKO,CAAC,KAAKJ,cAAc,CAACM,MAAf,GAAwB,CAAnC,EAAuC;AACtCH,MAAAA,GAAG,CAAEN,GAAF,CAAH,GAAaC,KAAb;AACA;;AACD,WAAOK,GAAG,CAAEN,GAAF,CAAV;AACA,GARD,EAQGI,SARH;AAUA,SAAOA,SAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport { paramCase } from 'change-case';\n\n/**\n * Converts a path to an array of its fragments.\n * Supports strings, numbers and arrays:\n *\n * 'foo' => [ 'foo' ]\n * 2 => [ '2' ]\n * [ 'foo', 'bar' ] => [ 'foo', 'bar' ]\n *\n * @param {string|number|Array} path Path\n * @return {Array} Normalized path.\n */\nfunction normalizePath( path ) {\n\tif ( Array.isArray( path ) ) {\n\t\treturn path;\n\t} else if ( typeof path === 'number' ) {\n\t\treturn [ path.toString() ];\n\t}\n\n\treturn [ path ];\n}\n\n/**\n * Converts any string to kebab case.\n * Backwards compatible with Lodash's `_.kebabCase()`.\n * Backwards compatible with `_wp_to_kebab_case()`.\n *\n * @see https://lodash.com/docs/4.17.15#kebabCase\n * @see https://developer.wordpress.org/reference/functions/_wp_to_kebab_case/\n *\n * @param {string} str String to convert.\n * @return {string} Kebab-cased string\n */\nexport function kebabCase( str ) {\n\tlet input = str;\n\tif ( typeof str !== 'string' ) {\n\t\tinput = str?.toString?.() ?? '';\n\t}\n\n\t// See https://github.com/lodash/lodash/blob/b185fcee26b2133bd071f4aaca14b455c2ed1008/lodash.js#L4970\n\tinput = input.replace( /['\\u2019]/, '' );\n\n\treturn paramCase( input, {\n\t\tsplitRegexp: [\n\t\t\t/(?!(?:1ST|2ND|3RD|[4-9]TH)(?![a-z]))([a-z0-9])([A-Z])/g, // fooBar => foo-bar, 3Bar => 3-bar\n\t\t\t/(?!(?:1st|2nd|3rd|[4-9]th)(?![a-z]))([0-9])([a-z])/g, // 3bar => 3-bar\n\t\t\t/([A-Za-z])([0-9])/g, // Foo3 => foo-3, foo3 => foo-3\n\t\t\t/([A-Z])([A-Z][a-z])/g, // FOOBar => foo-bar\n\t\t],\n\t} );\n}\n\n/**\n * Clones an object.\n * Non-object values are returned unchanged.\n *\n * @param {*} object Object to clone.\n * @return {*} Cloned object, or original literal non-object value.\n */\nfunction cloneObject( object ) {\n\tif ( object && typeof object === 'object' ) {\n\t\treturn {\n\t\t\t...Object.fromEntries(\n\t\t\t\tObject.entries( object ).map( ( [ key, value ] ) => [\n\t\t\t\t\tkey,\n\t\t\t\t\tcloneObject( value ),\n\t\t\t\t] )\n\t\t\t),\n\t\t};\n\t}\n\n\treturn object;\n}\n\n/**\n * Immutably sets a value inside an object. Like `lodash#set`, but returning a\n * new object. Treats nullish initial values as empty objects. Clones any\n * nested objects.\n *\n * @param {Object}              object Object to set a value in.\n * @param {number|string|Array} path   Path in the object to modify.\n * @param {*}                   value  New value to set.\n * @return {Object} Cloned object with the new value set.\n */\nexport function setImmutably( object, path, value ) {\n\tconst normalizedPath = normalizePath( path );\n\tconst newObject = object ? cloneObject( object ) : {};\n\n\tnormalizedPath.reduce( ( acc, key, i ) => {\n\t\tif ( acc[ key ] === undefined ) {\n\t\t\tacc[ key ] = {};\n\t\t}\n\t\tif ( i === normalizedPath.length - 1 ) {\n\t\t\tacc[ key ] = value;\n\t\t}\n\t\treturn acc[ key ];\n\t}, newObject );\n\n\treturn newObject;\n}\n"]}

package/build-style/style-rtl.css

@@ -189,11 +189,6 @@
   flex: 1 1 0px;
 }
 
-.block-editor-block-inspector__block-buttons-container {
-  border-top: 1px solid #e0e0e0;
-  padding: 16px;
-}
-
 /**
  * Insertion Point.
  */
@@ -587,10 +582,16 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 
 .block-editor-block-lock-toolbar .components-button.has-icon {
   min-width: 36px !important;
-  padding-right: 0 !important;
 }
-.block-editor-block-lock-toolbar .components-button.has-icon:focus::before {
-  left: 8px !important;
+
+.block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar {
+  margin-right: -6px !important;
+}
+
+.show-icon-labels .block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar {
+  border-right: 1px solid #1e1e1e;
+  margin-right: 6px !important;
+  margin-left: -6px;
 }
 
 .block-editor-block-breadcrumb {
@@ -1853,12 +1854,12 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 }
 .block-editor-link-control {
   position: relative;
-  min-width: 360px;
+  min-width: 350px;
 }
 .components-popover__content .block-editor-link-control {
   min-width: auto;
   width: 90vw;
-  max-width: 360px;
+  max-width: 350px;
 }
 .show-icon-labels .block-editor-link-control .components-button.has-icon svg {
   display: none;
@@ -2320,6 +2321,9 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 .block-editor-list-view-leaf .block-editor-list-view-block-select-button:hover {
   color: var(--wp-admin-theme-color);
 }
+.is-dragging-components-draggable .block-editor-list-view-leaf:not(.is-selected) .block-editor-list-view-block-select-button:hover {
+  color: inherit;
+}
 .block-editor-list-view-leaf.is-selected td {
   background: var(--wp-admin-theme-color);
 }
@@ -2336,10 +2340,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents, .block-editor-list-view-leaf.is-selected .components-button.has-icon {
   color: #fff;
 }
-.is-dragging-components-draggable .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents {
-  background: none;
-  color: #1e1e1e;
-}
 .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus::after {
   box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 }
@@ -2349,9 +2349,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 .block-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus {
   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #fff;
 }
-.block-editor-list-view-leaf.is-dragging {
-  display: none;
-}
 .block-editor-list-view-leaf.is-first-selected td:first-child {
   border-top-right-radius: 2px;
 }
@@ -2570,7 +2567,8 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__anchor {
   background: rgba(0, 0, 0, 0.3);
 }
-.block-editor-list-view-leaf .block-editor-list-view-block-select-button__lock {
+.block-editor-list-view-leaf .block-editor-list-view-block-select-button__lock,
+.block-editor-list-view-leaf .block-editor-list-view-block-select-button__sticky {
   line-height: 0;
 }
 
@@ -3379,9 +3377,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
   width: 24px !important;
   margin: 0 !important;
 }
-.block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar {
-  margin-right: -6px !important;
-}
 .block-editor-block-toolbar__block-controls .components-toolbar-group {
   padding: 0;
 }

package/build-style/style.css

@@ -189,11 +189,6 @@
   flex: 1 1 0px;
 }
 
-.block-editor-block-inspector__block-buttons-container {
-  border-top: 1px solid #e0e0e0;
-  padding: 16px;
-}
-
 /**
  * Insertion Point.
  */
@@ -587,10 +582,16 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 
 .block-editor-block-lock-toolbar .components-button.has-icon {
   min-width: 36px !important;
-  padding-left: 0 !important;
 }
-.block-editor-block-lock-toolbar .components-button.has-icon:focus::before {
-  right: 8px !important;
+
+.block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar {
+  margin-left: -6px !important;
+}
+
+.show-icon-labels .block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar {
+  border-left: 1px solid #1e1e1e;
+  margin-left: 6px !important;
+  margin-right: -6px;
 }
 
 .block-editor-block-breadcrumb {
@@ -1854,12 +1855,12 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 }
 .block-editor-link-control {
   position: relative;
-  min-width: 360px;
+  min-width: 350px;
 }
 .components-popover__content .block-editor-link-control {
   min-width: auto;
   width: 90vw;
-  max-width: 360px;
+  max-width: 350px;
 }
 .show-icon-labels .block-editor-link-control .components-button.has-icon svg {
   display: none;
@@ -2321,6 +2322,9 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 .block-editor-list-view-leaf .block-editor-list-view-block-select-button:hover {
   color: var(--wp-admin-theme-color);
 }
+.is-dragging-components-draggable .block-editor-list-view-leaf:not(.is-selected) .block-editor-list-view-block-select-button:hover {
+  color: inherit;
+}
 .block-editor-list-view-leaf.is-selected td {
   background: var(--wp-admin-theme-color);
 }
@@ -2337,10 +2341,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents, .block-editor-list-view-leaf.is-selected .components-button.has-icon {
   color: #fff;
 }
-.is-dragging-components-draggable .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents {
-  background: none;
-  color: #1e1e1e;
-}
 .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus::after {
   box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 }
@@ -2350,9 +2350,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 .block-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus {
   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #fff;
 }
-.block-editor-list-view-leaf.is-dragging {
-  display: none;
-}
 .block-editor-list-view-leaf.is-first-selected td:first-child {
   border-top-left-radius: 2px;
 }
@@ -2571,7 +2568,8 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
 .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__anchor {
   background: rgba(0, 0, 0, 0.3);
 }
-.block-editor-list-view-leaf .block-editor-list-view-block-select-button__lock {
+.block-editor-list-view-leaf .block-editor-list-view-block-select-button__lock,
+.block-editor-list-view-leaf .block-editor-list-view-block-select-button__sticky {
   line-height: 0;
 }
 
@@ -3380,9 +3378,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
   width: 24px !important;
   margin: 0 !important;
 }
-.block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar {
-  margin-left: -6px !important;
-}
 .block-editor-block-toolbar__block-controls .components-toolbar-group {
   padding: 0;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-editor",
-	"version": "12.3.0",
+	"version": "12.3.1",
 	"description": "Generic block editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -33,35 +33,35 @@
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
 		"@react-spring/web": "^9.4.5",
-		"@wordpress/a11y": "^3.35.0",
-		"@wordpress/api-fetch": "^6.32.0",
-		"@wordpress/blob": "^3.35.0",
-		"@wordpress/blocks": "^12.12.0",
-		"@wordpress/components": "^25.1.0",
-		"@wordpress/compose": "^6.12.0",
-		"@wordpress/data": "^9.5.0",
-		"@wordpress/date": "^4.35.0",
-		"@wordpress/deprecated": "^3.35.0",
-		"@wordpress/dom": "^3.35.0",
-		"@wordpress/element": "^5.12.0",
-		"@wordpress/escape-html": "^2.35.0",
-		"@wordpress/hooks": "^3.35.0",
-		"@wordpress/html-entities": "^3.35.0",
-		"@wordpress/i18n": "^4.35.0",
-		"@wordpress/icons": "^9.26.0",
-		"@wordpress/is-shallow-equal": "^4.35.0",
-		"@wordpress/keyboard-shortcuts": "^4.12.0",
-		"@wordpress/keycodes": "^3.35.0",
-		"@wordpress/notices": "^4.3.0",
-		"@wordpress/preferences": "^3.12.0",
-		"@wordpress/private-apis": "^0.17.0",
-		"@wordpress/rich-text": "^6.12.0",
-		"@wordpress/shortcode": "^3.35.0",
-		"@wordpress/style-engine": "^1.18.0",
-		"@wordpress/token-list": "^2.35.0",
-		"@wordpress/url": "^3.36.0",
-		"@wordpress/warning": "^2.35.0",
-		"@wordpress/wordcount": "^3.35.0",
+		"@wordpress/a11y": "^3.35.1",
+		"@wordpress/api-fetch": "^6.32.1",
+		"@wordpress/blob": "^3.35.1",
+		"@wordpress/blocks": "^12.12.1",
+		"@wordpress/components": "^25.1.1",
+		"@wordpress/compose": "^6.12.1",
+		"@wordpress/data": "^9.5.1",
+		"@wordpress/date": "^4.35.1",
+		"@wordpress/deprecated": "^3.35.1",
+		"@wordpress/dom": "^3.35.1",
+		"@wordpress/element": "^5.12.1",
+		"@wordpress/escape-html": "^2.35.1",
+		"@wordpress/hooks": "^3.35.1",
+		"@wordpress/html-entities": "^3.35.1",
+		"@wordpress/i18n": "^4.35.1",
+		"@wordpress/icons": "^9.26.1",
+		"@wordpress/is-shallow-equal": "^4.35.1",
+		"@wordpress/keyboard-shortcuts": "^4.12.1",
+		"@wordpress/keycodes": "^3.35.1",
+		"@wordpress/notices": "^4.3.1",
+		"@wordpress/preferences": "^3.12.1",
+		"@wordpress/private-apis": "^0.17.1",
+		"@wordpress/rich-text": "^6.12.1",
+		"@wordpress/shortcode": "^3.35.1",
+		"@wordpress/style-engine": "^1.18.1",
+		"@wordpress/token-list": "^2.35.1",
+		"@wordpress/url": "^3.36.1",
+		"@wordpress/warning": "^2.35.1",
+		"@wordpress/wordcount": "^3.35.1",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
@@ -84,5 +84,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "a92f606309b1541b834ff9b0a76ed2a466fc45ed"
+	"gitHead": "ce5639111c30763dbdf07f40eeb136ea6030ecf1"
 }

package/src/autocompleters/block.js

@@ -40,11 +40,13 @@ function createBlockCompleter() {
 					const {
 						getSelectedBlockClientId,
 						getBlockName,
-						getBlockInsertionPoint,
 						getBlockListSettings,
+						getBlockRootClientId,
 					} = select( blockEditorStore );
 					const selectedBlockClientId = getSelectedBlockClientId();
-					const _rootClientId = getBlockInsertionPoint().rootClientId;
+					const _rootClientId = getBlockRootClientId(
+						selectedBlockClientId
+					);
 					return {
 						selectedBlockName: selectedBlockClientId
 							? getBlockName( selectedBlockClientId )

package/src/components/alignment-control/ui.js

@@ -24,8 +24,7 @@ const DEFAULT_ALIGNMENT_CONTROLS = [
 ];
 
 const POPOVER_PROPS = {
-	position: 'bottom right',
-	variant: 'toolbar',
+	placement: 'bottom-start',
 };
 
 function AlignmentUI( {

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

@@ -32,6 +32,15 @@ export default function BlockActions( {
 
 	const blocks = getBlocksByClientId( clientIds );
 	const rootClientId = getBlockRootClientId( clientIds[ 0 ] );
+
+	const canCopyStyles = blocks.every( ( block ) => {
+		return (
+			!! block &&
+			( hasBlockSupport( block.name, 'color' ) ||
+				hasBlockSupport( block.name, 'typography' ) )
+		);
+	} );
+
 	const canDuplicate = blocks.every( ( block ) => {
 		return (
 			!! block &&
@@ -64,6 +73,7 @@ export default function BlockActions( {
 	const pasteStyles = usePasteStyles();
 
 	return children( {
+		canCopyStyles,
 		canDuplicate,
 		canInsertDefaultBlock,
 		canMove,

package/src/components/block-alignment-control/constants.js

@@ -39,7 +39,3 @@ export const BLOCK_ALIGNMENTS_CONTROLS = {
 };
 
 export const DEFAULT_CONTROL = 'none';
-
-export const POPOVER_PROPS = {
-	variant: 'toolbar',
-};

package/src/components/block-alignment-control/ui.js

@@ -18,11 +18,7 @@ import {
  * Internal dependencies
  */
 import useAvailableAlignments from './use-available-alignments';
-import {
-	BLOCK_ALIGNMENTS_CONTROLS,
-	DEFAULT_CONTROL,
-	POPOVER_PROPS,
-} from './constants';
+import { BLOCK_ALIGNMENTS_CONTROLS, DEFAULT_CONTROL } from './constants';
 
 function BlockAlignmentUI( {
 	value,
@@ -69,7 +65,6 @@ function BlockAlignmentUI( {
 		  }
 		: {
 				toggleProps: { describedBy: __( 'Change alignment' ) },
-				popoverProps: POPOVER_PROPS,
 				children: ( { onClose } ) => {
 					return (
 						<>

package/src/components/block-alignment-matrix-control/index.js

@@ -23,7 +23,7 @@ function BlockAlignmentMatrixControl( props ) {
 
 	return (
 		<Dropdown
-			popoverProps={ { variant: 'toolbar', placement: 'bottom-start' } }
+			popoverProps={ { placement: 'bottom-start' } }
 			renderToggle={ ( { onToggle, isOpen } ) => {
 				const openOnArrowDown = ( event ) => {
 					if ( ! isOpen && event.keyCode === DOWN ) {

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

@@ -26,15 +26,11 @@ function BlockBreadcrumb( { rootLabelText } ) {
 		const {
 			getSelectionStart,
 			getSelectedBlockClientId,
-			getBlockParents,
-			getBlockEditingMode,
+			getEnabledBlockParents,
 		} = unlock( select( blockEditorStore ) );
 		const selectedBlockClientId = getSelectedBlockClientId();
 		return {
-			parents: getBlockParents( selectedBlockClientId ).filter(
-				( parentClientId ) =>
-					getBlockEditingMode( parentClientId ) !== 'disabled'
-			),
+			parents: getEnabledBlockParents( selectedBlockClientId ),
 			clientId: selectedBlockClientId,
 			hasSelection: !! getSelectionStart().clientId,
 		};

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

@@ -29,11 +29,9 @@ export default function BlockEdit( props ) {
 		__unstableLayoutClassNames,
 	} = props;
 	const { layout = null } = attributes;
-	const layoutSupport = hasBlockSupport(
-		name,
-		'__experimentalLayout',
-		false
-	);
+	const layoutSupport =
+		hasBlockSupport( name, 'layout', false ) ||
+		hasBlockSupport( name, '__experimentalLayout', false );
 	const context = {
 		name,
 		isSelected,

package/src/components/block-heading-level-dropdown/README.md

@@ -0,0 +1,52 @@
+# Heading Level Dropdown
+
+`<HeadingLevelDropdown>` Adds a dropdown for selecting H1-H6 and paragraph HTML tags from the block toolbar.
+Uses `<ToolbarDropdownMenu>`.
+
+## Usage
+
+```jsx
+
+import { BlockControls, HeadingLevelDropdown } from '@wordpress/block-editor';
+
+const HEADING_LEVELS = [ 0, 1, 2, 3, 4, 5, 6 ];
+
+const MyHeadingLevelToolbar = () => (
+	<BlockControls group="block">
+		<HeadingLevelDropdown
+			options={ HEADING_LEVELS }
+			value={ tag }
+			onChange={ ( newTag ) =>
+				setAttributes( { tag: newTag } )
+			}
+		/>
+	</BlockControls>
+);
+```
+
+### Props
+
+#### options
+
+The list of available HTML tags, passed from the block.
+
+-   Type: `Object`
+-   Required: no
+
+#### value
+
+The chosen HTML tag.
+
+-   Type: `string`
+-   Required: no
+
+#### onChange
+
+Callback to run when toolbar value is changed.
+
+-   Type: `string`
+-   Required: yes
+
+## Related components
+
+Block Editor components are components that can be used to compose the UI of your block editor. Thus, they can only be used under a [`BlockEditorProvider`](https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/provider/README.md) in the components tree.

package/src/components/block-heading-level-dropdown/heading-level-icon.js

@@ -0,0 +1,43 @@
+/**
+ * WordPress dependencies
+ */
+import {
+	headingLevel1,
+	headingLevel2,
+	headingLevel3,
+	headingLevel4,
+	headingLevel5,
+	headingLevel6,
+	paragraph,
+} from '@wordpress/icons';
+
+/** @typedef {import('@wordpress/element').WPComponent} WPComponent */
+
+/**
+ * HeadingLevelIcon props.
+ *
+ * @typedef WPHeadingLevelIconProps
+ *
+ * @property {number} level The heading level to show an icon for.
+ */
+
+const LEVEL_TO_PATH = {
+	0: paragraph,
+	1: headingLevel1,
+	2: headingLevel2,
+	3: headingLevel3,
+	4: headingLevel4,
+	5: headingLevel5,
+	6: headingLevel6,
+};
+
+/**
+ * Heading level icon.
+ *
+ * @param {WPHeadingLevelIconProps} props Component props.
+ *
+ * @return {?WPComponent} The icon.
+ */
+export default function HeadingLevelIcon( { level } ) {
+	return LEVEL_TO_PATH[ level ] ?? null;
+}

package/src/components/block-heading-level-dropdown/index.js

@@ -0,0 +1,77 @@
+/**
+ * WordPress dependencies
+ */
+import { ToolbarDropdownMenu } from '@wordpress/components';
+import { __, sprintf } from '@wordpress/i18n';
+
+/**
+ * Internal dependencies
+ */
+import HeadingLevelIcon from './heading-level-icon';
+
+const HEADING_LEVELS = [ 1, 2, 3, 4, 5, 6 ];
+
+const POPOVER_PROPS = {
+	className: 'block-library-heading-level-dropdown',
+};
+
+/** @typedef {import('@wordpress/element').WPComponent} WPComponent */
+
+/**
+ * HeadingLevelDropdown props.
+ *
+ * @typedef WPHeadingLevelDropdownProps
+ *
+ * @property {number}                 value    The chosen heading level.
+ * @property {number[]}               options  An array of supported heading levels.
+ * @property {(newValue:number)=>any} onChange Callback to run when
+ *                                             toolbar value is changed.
+ */
+
+/**
+ * Dropdown for selecting a heading level (1 through 6) or paragraph (0).
+ *
+ * @param {WPHeadingLevelDropdownProps} props Component props.
+ *
+ * @return {WPComponent} The toolbar.
+ */
+export default function HeadingLevelDropdown( {
+	options = HEADING_LEVELS,
+	value,
+	onChange,
+} ) {
+	return (
+		<ToolbarDropdownMenu
+			popoverProps={ POPOVER_PROPS }
+			icon={ <HeadingLevelIcon level={ value } /> }
+			label={ __( 'Change level' ) }
+			controls={ options.map( ( targetLevel ) => {
+				{
+					const isActive = targetLevel === value;
+
+					return {
+						icon: (
+							<HeadingLevelIcon
+								level={ targetLevel }
+								isPressed={ isActive }
+							/>
+						),
+						label:
+							targetLevel === 0
+								? __( 'Paragraph' )
+								: sprintf(
+										// translators: %s: heading level e.g: "1", "2", "3"
+										__( 'Heading %d' ),
+										targetLevel
+								  ),
+						isActive,
+						onClick() {
+							onChange( targetLevel );
+						},
+						role: 'menuitemradio',
+					};
+				}
+			} ) }
+		/>
+	);
+}