Full Site Editing: Add a Site Logo block (#18811)

* Add a site logo block

This uses some filters to non-destructively override the theme mod value
when the experiment is enabled and the site logo setting has a value.

* show a preview while the image uploads

* change the block icon

* show an inline error message in the site logo block

* hide the error when a file is successful

* use mediaflow to replace the image in the logo block

* fix typo in dismissible prop

* update the entity fetching mechanism

* use lightBlockWrapper flag

* fix image resizing

* match the front/back end markup

* fix alignment in the BlockControls

* fix alignment in the BlockControls

* uopdate icon

* simplify code

* Hide the spinner when the site logo has loaded

* Use the real url for the site logo

* remove dead code

* remove unused CSS

* combine the useSelect calls

* pass an empty array to useSelect to stop it firing on every render

* Linter fixes

* add fixtures for the site-logo block

* remove unused code

* fix for linter

lib/blocks.php

@@ -86,6 +86,7 @@ function gutenberg_reregister_core_block_types() {
 				'query.php'               => 'core/query',
 				'query-loop.php'          => 'core/query-loop',
 				'query-pagination.php'    => 'core/query-pagination',
+				'site-logo.php'           => 'core/site-logo',
 				'site-title.php'          => 'core/site-title',
 				'template-part.php'       => 'core/template-part',
 			)

packages/block-library/src/editor.scss

@@ -37,6 +37,7 @@
 @import "./search/editor.scss";
 @import "./separator/editor.scss";
 @import "./shortcode/editor.scss";
+@import "./site-logo/editor.scss";
 @import "./social-link/editor.scss";
 @import "./social-links/editor.scss";
 @import "./spacer/editor.scss";

packages/block-library/src/index.js

@@ -65,6 +65,7 @@ import * as socialLink from './social-link';
 import * as widgetArea from './widget-area';
 
 // Full Site Editing Blocks
+import * as siteLogo from './site-logo';
 import * as siteTitle from './site-title';
 import * as templatePart from './template-part';
 import * as query from './query';
@@ -199,6 +200,7 @@ export const __experimentalRegisterExperimentalCoreBlocks =
 					...( __experimentalEnableFullSiteEditing
 						? [
 								siteTitle,
+								siteLogo,
 								templatePart,
 								query,
 								queryLoop,

packages/block-library/src/site-logo/block.json

@@ -0,0 +1,16 @@
+{
+	"name": "core/site-logo",
+	"category": "layout",
+	"attributes": {
+		"align": {
+			"type": "string"
+		},
+		"width": {
+			"type": "number"
+		}
+	},
+	"supports": {
+		"html": false,
+		"lightBlockWrapper": true
+	}
+}