@wordpress/editor 13.30.0 → 13.32.0

package/build-module/store/utils/get-filtered-template-parts.js

@@ -0,0 +1,64 @@
+/**
+ * External dependencies
+ */
+import memoize from 'memize';
+
+/**
+ * WordPress dependencies
+ */
+import { isTemplatePart } from '@wordpress/blocks';
+const EMPTY_ARRAY = [];
+
+/**
+ * Get a flattened and filtered list of template parts and the matching block for that template part.
+ *
+ * Takes a list of blocks defined within a template, and a list of template parts, and returns a
+ * flattened list of template parts and the matching block for that template part.
+ *
+ * @param {Array}  blocks        Blocks to flatten.
+ * @param {?Array} templateParts Available template parts.
+ * @return {Array} An array of template parts and their blocks.
+ */
+function getFilteredTemplatePartBlocks(blocks = EMPTY_ARRAY, templateParts) {
+  const templatePartsById = templateParts ?
+  // Key template parts by their ID.
+  templateParts.reduce((newTemplateParts, part) => ({
+    ...newTemplateParts,
+    [part.id]: part
+  }), {}) : {};
+  const result = [];
+
+  // Iterate over all blocks, recursing into inner blocks.
+  // Output will be based on a depth-first traversal.
+  const stack = [...blocks];
+  while (stack.length) {
+    const {
+      innerBlocks,
+      ...block
+    } = stack.shift();
+    // Place inner blocks at the beginning of the stack to preserve order.
+    stack.unshift(...innerBlocks);
+    if (isTemplatePart(block)) {
+      const {
+        attributes: {
+          theme,
+          slug
+        }
+      } = block;
+      const templatePartId = `${theme}//${slug}`;
+      const templatePart = templatePartsById[templatePartId];
+
+      // Only add to output if the found template part block is in the list of available template parts.
+      if (templatePart) {
+        result.push({
+          templatePart,
+          block
+        });
+      }
+    }
+  }
+  return result;
+}
+const memoizedGetFilteredTemplatePartBlocks = memoize(getFilteredTemplatePartBlocks);
+export { memoizedGetFilteredTemplatePartBlocks as getFilteredTemplatePartBlocks };
+//# sourceMappingURL=get-filtered-template-parts.js.map

package/build-module/store/utils/get-filtered-template-parts.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["memoize","isTemplatePart","EMPTY_ARRAY","getFilteredTemplatePartBlocks","blocks","templateParts","templatePartsById","reduce","newTemplateParts","part","id","result","stack","length","innerBlocks","block","shift","unshift","attributes","theme","slug","templatePartId","templatePart","push","memoizedGetFilteredTemplatePartBlocks"],"sources":["@wordpress/editor/src/store/utils/get-filtered-template-parts.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport memoize from 'memize';\n\n/**\n * WordPress dependencies\n */\nimport { isTemplatePart } from '@wordpress/blocks';\n\nconst EMPTY_ARRAY = [];\n\n/**\n * Get a flattened and filtered list of template parts and the matching block for that template part.\n *\n * Takes a list of blocks defined within a template, and a list of template parts, and returns a\n * flattened list of template parts and the matching block for that template part.\n *\n * @param {Array}  blocks        Blocks to flatten.\n * @param {?Array} templateParts Available template parts.\n * @return {Array} An array of template parts and their blocks.\n */\nfunction getFilteredTemplatePartBlocks( blocks = EMPTY_ARRAY, templateParts ) {\n\tconst templatePartsById = templateParts\n\t\t? // Key template parts by their ID.\n\t\t  templateParts.reduce(\n\t\t\t\t( newTemplateParts, part ) => ( {\n\t\t\t\t\t...newTemplateParts,\n\t\t\t\t\t[ part.id ]: part,\n\t\t\t\t} ),\n\t\t\t\t{}\n\t\t  )\n\t\t: {};\n\n\tconst result = [];\n\n\t// Iterate over all blocks, recursing into inner blocks.\n\t// Output will be based on a depth-first traversal.\n\tconst stack = [ ...blocks ];\n\twhile ( stack.length ) {\n\t\tconst { innerBlocks, ...block } = stack.shift();\n\t\t// Place inner blocks at the beginning of the stack to preserve order.\n\t\tstack.unshift( ...innerBlocks );\n\n\t\tif ( isTemplatePart( block ) ) {\n\t\t\tconst {\n\t\t\t\tattributes: { theme, slug },\n\t\t\t} = block;\n\t\t\tconst templatePartId = `${ theme }//${ slug }`;\n\t\t\tconst templatePart = templatePartsById[ templatePartId ];\n\n\t\t\t// Only add to output if the found template part block is in the list of available template parts.\n\t\t\tif ( templatePart ) {\n\t\t\t\tresult.push( {\n\t\t\t\t\ttemplatePart,\n\t\t\t\t\tblock,\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\t}\n\n\treturn result;\n}\n\nconst memoizedGetFilteredTemplatePartBlocks = memoize(\n\tgetFilteredTemplatePartBlocks\n);\n\nexport { memoizedGetFilteredTemplatePartBlocks as getFilteredTemplatePartBlocks };\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,OAAO,MAAM,QAAQ;;AAE5B;AACA;AACA;AACA,SAASC,cAAc,QAAQ,mBAAmB;AAElD,MAAMC,WAAW,GAAG,EAAE;;AAEtB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,6BAA6BA,CAAEC,MAAM,GAAGF,WAAW,EAAEG,aAAa,EAAG;EAC7E,MAAMC,iBAAiB,GAAGD,aAAa;EACpC;EACAA,aAAa,CAACE,MAAM,CACpB,CAAEC,gBAAgB,EAAEC,IAAI,MAAQ;IAC/B,GAAGD,gBAAgB;IACnB,CAAEC,IAAI,CAACC,EAAE,GAAID;EACd,CAAC,CAAE,EACH,CAAC,CACD,CAAC,GACD,CAAC,CAAC;EAEL,MAAME,MAAM,GAAG,EAAE;;EAEjB;EACA;EACA,MAAMC,KAAK,GAAG,CAAE,GAAGR,MAAM,CAAE;EAC3B,OAAQQ,KAAK,CAACC,MAAM,EAAG;IACtB,MAAM;MAAEC,WAAW;MAAE,GAAGC;IAAM,CAAC,GAAGH,KAAK,CAACI,KAAK,CAAC,CAAC;IAC/C;IACAJ,KAAK,CAACK,OAAO,CAAE,GAAGH,WAAY,CAAC;IAE/B,IAAKb,cAAc,CAAEc,KAAM,CAAC,EAAG;MAC9B,MAAM;QACLG,UAAU,EAAE;UAAEC,KAAK;UAAEC;QAAK;MAC3B,CAAC,GAAGL,KAAK;MACT,MAAMM,cAAc,GAAI,GAAGF,KAAO,KAAKC,IAAM,EAAC;MAC9C,MAAME,YAAY,GAAGhB,iBAAiB,CAAEe,cAAc,CAAE;;MAExD;MACA,IAAKC,YAAY,EAAG;QACnBX,MAAM,CAACY,IAAI,CAAE;UACZD,YAAY;UACZP;QACD,CAAE,CAAC;MACJ;IACD;EACD;EAEA,OAAOJ,MAAM;AACd;AAEA,MAAMa,qCAAqC,GAAGxB,OAAO,CACpDG,6BACD,CAAC;AAED,SAASqB,qCAAqC,IAAIrB,6BAA6B"}

package/build-style/style-rtl.css

@@ -226,16 +226,22 @@
   min-width: 0;
   background: #f0f0f0;
   border-radius: 4px;
-  width: min(100%, 450px);
+  width: min(100%, 416px);
 }
 .editor-document-bar:hover {
   background-color: #e0e0e0;
 }
 .editor-document-bar .components-button {
   border-radius: 4px;
+  transition: all 0.1s ease-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .editor-document-bar .components-button {
+    transition-duration: 0s;
+    transition-delay: 0s;
+  }
 }
 .editor-document-bar .components-button:hover {
-  color: var(--wp-block-synced-color);
   background: #e0e0e0;
 }
 @media (min-width: 960px) {
@@ -253,20 +259,17 @@
 .editor-document-bar__title {
   flex-grow: 1;
   overflow: hidden;
-  color: #2f2f2f;
+  color: #1e1e1e;
   gap: 4px;
   display: flex;
   justify-content: center;
   align-items: center;
 }
-@media (min-width: 600px) {
+@media (min-width: 782px) {
   .editor-document-bar__title {
-    padding-right: 32px;
+    padding-right: 24px;
   }
 }
-.editor-document-bar__title:hover {
-  color: var(--wp-block-synced-color);
-}
 .editor-document-bar.is-global .editor-document-bar__title {
   color: var(--wp-block-synced-color);
 }
@@ -278,13 +281,13 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  max-width: 50%;
+  max-width: 70%;
   color: currentColor;
 }
 
 .editor-document-bar__shortcut {
   color: #2f2f2f;
-  min-width: 32px;
+  min-width: 24px;
   display: none;
 }
 @media (min-width: 782px) {
@@ -302,7 +305,7 @@
   position: absolute;
 }
 .editor-document-bar__back.components-button.has-icon.has-text:hover {
-  color: var(--wp-block-synced-color);
+  color: #1e1e1e;
   background-color: transparent;
 }
 
@@ -393,11 +396,13 @@
   display: inline-flex;
   align-items: center;
 }
-.editor-document-tools .editor-document-tools__left > .components-button {
+.editor-document-tools .editor-document-tools__left > .editor-history__redo,
+.editor-document-tools .editor-document-tools__left > .editor-history__undo {
   display: none;
 }
-@media (min-width: 600px) {
-  .editor-document-tools .editor-document-tools__left > .components-button {
+@media (min-width: 782px) {
+  .editor-document-tools .editor-document-tools__left > .editor-history__redo,
+.editor-document-tools .editor-document-tools__left > .editor-history__undo {
     display: inline-flex;
   }
 }
@@ -451,16 +456,6 @@
   gap: 8px;
   margin-left: 8px;
 }
-@media (min-width: 782px) {
-  .editor-document-tools__left {
-    padding-right: 20px;
-  }
-}
-@media (min-width: 1280px) {
-  .editor-document-tools__left {
-    padding-left: 8px;
-  }
-}
 
 .editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle.has-icon {
   min-width: 32px;
@@ -584,7 +579,7 @@
   background: #fff;
   order: 1;
   align-self: center;
-  margin-left: 8px;
+  margin-left: 12px;
 }
 
 .editor-list-view-sidebar__tabs-tablist {
@@ -682,6 +677,32 @@
   width: 100%;
 }
 
+.editor-post-card-panel__content {
+  flex-grow: 1;
+}
+.editor-post-card-panel__title {
+  width: 100%;
+}
+.editor-post-card-panel__title.editor-post-card-panel__title {
+  margin: 3px 0 0 0;
+}
+.editor-post-card-panel__icon {
+  flex: 0 0 24px;
+  width: 24px;
+  height: 24px;
+}
+.editor-post-card-panel__header {
+  display: flex;
+  justify-content: space-between;
+  margin: 0 0 8px;
+}
+.editor-post-card-panel__description {
+  color: #757575;
+}
+.editor-post-card-panel__description .components-text {
+  color: inherit;
+}
+
 .editor-post-excerpt__textarea {
   width: 100%;
   margin-bottom: 10px;
@@ -697,10 +718,6 @@
   margin-top: -9px;
   margin-right: -9px;
 }
-.editor-post-featured-image .components-responsive-wrapper__content {
-  max-width: 100%;
-  width: auto;
-}
 
 .editor-post-featured-image__container {
   position: relative;
@@ -716,9 +733,11 @@
   transition: all 0.1s ease-out;
   box-shadow: 0 0 0 0 var(--wp-admin-theme-color);
   overflow: hidden;
+  outline-offset: -1px;
+  min-height: 80px;
+  margin-bottom: 16px;
   display: flex;
   justify-content: center;
-  max-height: 150px;
 }
 @media (prefers-reduced-motion: reduce) {
   .editor-post-featured-image__toggle,
@@ -730,16 +749,19 @@
 
 .editor-post-featured-image__preview {
   height: auto;
+  outline: 1px solid rgba(0, 0, 0, 0.1);
 }
-.editor-post-featured-image__preview .components-responsive-wrapper {
+.editor-post-featured-image__preview .editor-post-featured-image__preview-image {
+  object-fit: cover;
   width: 100%;
-  background: #f0f0f0;
+  object-position: 50% 50%;
+  aspect-ratio: 2/1;
 }
 
 .editor-post-featured-image__toggle {
   border-radius: 2px;
   background-color: #f0f0f0;
-  min-height: 90px;
+  height: 100%;
   line-height: 20px;
   padding: 8px 0;
   text-align: center;
@@ -1449,6 +1471,27 @@
   font-weight: 600;
 }
 
+.editor-template-areas {
+  margin-top: 16px;
+}
+.editor-template-areas__list {
+  margin: 0;
+}
+.editor-template-areas__list > li {
+  margin: 0;
+}
+.editor-template-areas__item {
+  width: 100%;
+}
+.editor-template-areas__item.components-button.has-icon {
+  padding: 0;
+}
+
+h3.components-heading.editor-template-areas__title {
+  font-weight: 500;
+  margin: 0 0 8px;
+}
+
 .editor-template-validation-notice {
   display: flex;
   justify-content: space-between;

package/build-style/style.css

@@ -226,16 +226,22 @@
   min-width: 0;
   background: #f0f0f0;
   border-radius: 4px;
-  width: min(100%, 450px);
+  width: min(100%, 416px);
 }
 .editor-document-bar:hover {
   background-color: #e0e0e0;
 }
 .editor-document-bar .components-button {
   border-radius: 4px;
+  transition: all 0.1s ease-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .editor-document-bar .components-button {
+    transition-duration: 0s;
+    transition-delay: 0s;
+  }
 }
 .editor-document-bar .components-button:hover {
-  color: var(--wp-block-synced-color);
   background: #e0e0e0;
 }
 @media (min-width: 960px) {
@@ -253,20 +259,17 @@
 .editor-document-bar__title {
   flex-grow: 1;
   overflow: hidden;
-  color: #2f2f2f;
+  color: #1e1e1e;
   gap: 4px;
   display: flex;
   justify-content: center;
   align-items: center;
 }
-@media (min-width: 600px) {
+@media (min-width: 782px) {
   .editor-document-bar__title {
-    padding-left: 32px;
+    padding-left: 24px;
   }
 }
-.editor-document-bar__title:hover {
-  color: var(--wp-block-synced-color);
-}
 .editor-document-bar.is-global .editor-document-bar__title {
   color: var(--wp-block-synced-color);
 }
@@ -278,13 +281,13 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  max-width: 50%;
+  max-width: 70%;
   color: currentColor;
 }
 
 .editor-document-bar__shortcut {
   color: #2f2f2f;
-  min-width: 32px;
+  min-width: 24px;
   display: none;
 }
 @media (min-width: 782px) {
@@ -302,7 +305,7 @@
   position: absolute;
 }
 .editor-document-bar__back.components-button.has-icon.has-text:hover {
-  color: var(--wp-block-synced-color);
+  color: #1e1e1e;
   background-color: transparent;
 }
 
@@ -393,11 +396,13 @@
   display: inline-flex;
   align-items: center;
 }
-.editor-document-tools .editor-document-tools__left > .components-button {
+.editor-document-tools .editor-document-tools__left > .editor-history__redo,
+.editor-document-tools .editor-document-tools__left > .editor-history__undo {
   display: none;
 }
-@media (min-width: 600px) {
-  .editor-document-tools .editor-document-tools__left > .components-button {
+@media (min-width: 782px) {
+  .editor-document-tools .editor-document-tools__left > .editor-history__redo,
+.editor-document-tools .editor-document-tools__left > .editor-history__undo {
     display: inline-flex;
   }
 }
@@ -451,16 +456,6 @@
   gap: 8px;
   margin-right: 8px;
 }
-@media (min-width: 782px) {
-  .editor-document-tools__left {
-    padding-left: 20px;
-  }
-}
-@media (min-width: 1280px) {
-  .editor-document-tools__left {
-    padding-right: 8px;
-  }
-}
 
 .editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle.has-icon {
   min-width: 32px;
@@ -584,7 +579,7 @@
   background: #fff;
   order: 1;
   align-self: center;
-  margin-right: 8px;
+  margin-right: 12px;
 }
 
 .editor-list-view-sidebar__tabs-tablist {
@@ -682,6 +677,32 @@
   width: 100%;
 }
 
+.editor-post-card-panel__content {
+  flex-grow: 1;
+}
+.editor-post-card-panel__title {
+  width: 100%;
+}
+.editor-post-card-panel__title.editor-post-card-panel__title {
+  margin: 3px 0 0 0;
+}
+.editor-post-card-panel__icon {
+  flex: 0 0 24px;
+  width: 24px;
+  height: 24px;
+}
+.editor-post-card-panel__header {
+  display: flex;
+  justify-content: space-between;
+  margin: 0 0 8px;
+}
+.editor-post-card-panel__description {
+  color: #757575;
+}
+.editor-post-card-panel__description .components-text {
+  color: inherit;
+}
+
 .editor-post-excerpt__textarea {
   width: 100%;
   margin-bottom: 10px;
@@ -697,10 +718,6 @@
   margin-top: -9px;
   margin-left: -9px;
 }
-.editor-post-featured-image .components-responsive-wrapper__content {
-  max-width: 100%;
-  width: auto;
-}
 
 .editor-post-featured-image__container {
   position: relative;
@@ -716,9 +733,11 @@
   transition: all 0.1s ease-out;
   box-shadow: 0 0 0 0 var(--wp-admin-theme-color);
   overflow: hidden;
+  outline-offset: -1px;
+  min-height: 80px;
+  margin-bottom: 16px;
   display: flex;
   justify-content: center;
-  max-height: 150px;
 }
 @media (prefers-reduced-motion: reduce) {
   .editor-post-featured-image__toggle,
@@ -730,16 +749,19 @@
 
 .editor-post-featured-image__preview {
   height: auto;
+  outline: 1px solid rgba(0, 0, 0, 0.1);
 }
-.editor-post-featured-image__preview .components-responsive-wrapper {
+.editor-post-featured-image__preview .editor-post-featured-image__preview-image {
+  object-fit: cover;
   width: 100%;
-  background: #f0f0f0;
+  object-position: 50% 50%;
+  aspect-ratio: 2/1;
 }
 
 .editor-post-featured-image__toggle {
   border-radius: 2px;
   background-color: #f0f0f0;
-  min-height: 90px;
+  height: 100%;
   line-height: 20px;
   padding: 8px 0;
   text-align: center;
@@ -1453,6 +1475,27 @@
   font-weight: 600;
 }
 
+.editor-template-areas {
+  margin-top: 16px;
+}
+.editor-template-areas__list {
+  margin: 0;
+}
+.editor-template-areas__list > li {
+  margin: 0;
+}
+.editor-template-areas__item {
+  width: 100%;
+}
+.editor-template-areas__item.components-button.has-icon {
+  padding: 0;
+}
+
+h3.components-heading.editor-template-areas__title {
+  font-weight: 500;
+  margin: 0 0 8px;
+}
+
 .editor-template-validation-notice {
   display: flex;
   justify-content: space-between;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/editor",
-	"version": "13.30.0",
+	"version": "13.32.0",
 	"description": "Enhanced block editor for WordPress posts.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -31,38 +31,40 @@
 	],
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.53.0",
-		"@wordpress/api-fetch": "^6.50.0",
-		"@wordpress/blob": "^3.53.0",
-		"@wordpress/block-editor": "^12.21.0",
-		"@wordpress/blocks": "^12.30.0",
-		"@wordpress/commands": "^0.24.0",
-		"@wordpress/components": "^27.1.0",
-		"@wordpress/compose": "^6.30.0",
-		"@wordpress/core-data": "^6.30.0",
-		"@wordpress/data": "^9.23.0",
-		"@wordpress/date": "^4.53.0",
-		"@wordpress/deprecated": "^3.53.0",
-		"@wordpress/dom": "^3.53.0",
-		"@wordpress/element": "^5.30.0",
-		"@wordpress/hooks": "^3.53.0",
-		"@wordpress/html-entities": "^3.53.0",
-		"@wordpress/i18n": "^4.53.0",
-		"@wordpress/icons": "^9.44.0",
-		"@wordpress/keyboard-shortcuts": "^4.30.0",
-		"@wordpress/keycodes": "^3.53.0",
-		"@wordpress/media-utils": "^4.44.0",
-		"@wordpress/notices": "^4.21.0",
-		"@wordpress/patterns": "^1.14.0",
-		"@wordpress/preferences": "^3.30.0",
-		"@wordpress/private-apis": "^0.35.0",
-		"@wordpress/reusable-blocks": "^4.30.0",
-		"@wordpress/rich-text": "^6.30.0",
-		"@wordpress/server-side-render": "^4.30.0",
-		"@wordpress/url": "^3.54.0",
-		"@wordpress/wordcount": "^3.53.0",
+		"@wordpress/a11y": "^3.55.0",
+		"@wordpress/api-fetch": "^6.52.0",
+		"@wordpress/blob": "^3.55.0",
+		"@wordpress/block-editor": "^12.23.0",
+		"@wordpress/blocks": "^12.32.0",
+		"@wordpress/commands": "^0.26.0",
+		"@wordpress/components": "^27.3.0",
+		"@wordpress/compose": "^6.32.0",
+		"@wordpress/core-data": "^6.32.0",
+		"@wordpress/data": "^9.25.0",
+		"@wordpress/date": "^4.55.0",
+		"@wordpress/deprecated": "^3.55.0",
+		"@wordpress/dom": "^3.55.0",
+		"@wordpress/element": "^5.32.0",
+		"@wordpress/hooks": "^3.55.0",
+		"@wordpress/html-entities": "^3.55.0",
+		"@wordpress/i18n": "^4.55.0",
+		"@wordpress/icons": "^9.46.0",
+		"@wordpress/keyboard-shortcuts": "^4.32.0",
+		"@wordpress/keycodes": "^3.55.0",
+		"@wordpress/media-utils": "^4.46.0",
+		"@wordpress/notices": "^4.23.0",
+		"@wordpress/patterns": "^1.16.0",
+		"@wordpress/plugins": "^6.23.0",
+		"@wordpress/preferences": "^3.32.0",
+		"@wordpress/private-apis": "^0.37.0",
+		"@wordpress/reusable-blocks": "^4.32.0",
+		"@wordpress/rich-text": "^6.32.0",
+		"@wordpress/server-side-render": "^4.32.0",
+		"@wordpress/url": "^3.56.0",
+		"@wordpress/warning": "^2.55.0",
+		"@wordpress/wordcount": "^3.55.0",
 		"classnames": "^2.3.1",
-		"date-fns": "^2.28.0",
+		"date-fns": "^3.6.0",
 		"memize": "^2.1.0",
 		"react-autosize-textarea": "^7.1.0",
 		"rememo": "^4.0.2",
@@ -75,5 +77,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "ac3c3e465a083081a86a4da6ee6fb817b41e5130"
+	"gitHead": "ac2b13783c28f959770cf029a797a712f59e1958"
 }

package/src/bindings/index.js

@@ -11,5 +11,8 @@ import patternOverrides from './pattern-overrides';
 import postMeta from './post-meta';
 
 const { registerBlockBindingsSource } = unlock( dispatch( blocksStore ) );
-registerBlockBindingsSource( patternOverrides );
 registerBlockBindingsSource( postMeta );
+
+if ( process.env.IS_GUTENBERG_PLUGIN ) {
+	registerBlockBindingsSource( patternOverrides );
+}