diff --git a/packages/edit-site/src/components/block-editor/index.js b/packages/edit-site/src/components/block-editor/index.js index 49cab9aef912c6..d4e6c4ed8e54a3 100644 --- a/packages/edit-site/src/components/block-editor/index.js +++ b/packages/edit-site/src/components/block-editor/index.js @@ -204,7 +204,7 @@ export default function BlockEditor() { + + + ); +} diff --git a/packages/edit-site/src/components/canvas-spinner/style.scss b/packages/edit-site/src/components/canvas-spinner/style.scss new file mode 100644 index 00000000000000..3178cbaeec58d4 --- /dev/null +++ b/packages/edit-site/src/components/canvas-spinner/style.scss @@ -0,0 +1,7 @@ +.edit-site-canvas-spinner { + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; +} diff --git a/packages/edit-site/src/components/editor/index.js b/packages/edit-site/src/components/editor/index.js index 4f6ab66c9a2ced..6841716960202a 100644 --- a/packages/edit-site/src/components/editor/index.js +++ b/packages/edit-site/src/components/editor/index.js @@ -37,6 +37,7 @@ import { store as editSiteStore } from '../../store'; import { GlobalStylesRenderer } from '../global-styles-renderer'; import { GlobalStylesProvider } from '../global-styles/global-styles-provider'; import useTitle from '../routes/use-title'; +import CanvasSpinner from '../canvas-spinner'; const interfaceLabels = { /* translators: accessibility text for the editor content landmark region. */ @@ -149,7 +150,7 @@ export default function Editor() { useTitle( isReady && __( 'Editor (beta)' ) ); if ( ! isReady ) { - return null; + return ; } return ( diff --git a/packages/edit-site/src/components/global-styles/global-styles-provider.js b/packages/edit-site/src/components/global-styles/global-styles-provider.js index 0813dc63b2cb86..68e190443d1f35 100644 --- a/packages/edit-site/src/components/global-styles/global-styles-provider.js +++ b/packages/edit-site/src/components/global-styles/global-styles-provider.js @@ -14,6 +14,7 @@ import { store as coreStore } from '@wordpress/core-data'; * Internal dependencies */ import { GlobalStylesContext } from './context'; +import CanvasSpinner from '../canvas-spinner'; function mergeTreesCustomizer( _, srcValue ) { // We only pass as arrays the presets, @@ -165,7 +166,7 @@ function useGlobalStylesContext() { export function GlobalStylesProvider( { children } ) { const context = useGlobalStylesContext(); if ( ! context.isReady ) { - return null; + return ; } return ( diff --git a/packages/edit-site/src/style.scss b/packages/edit-site/src/style.scss index b98f6b817e368c..ceb311f8cd0a45 100644 --- a/packages/edit-site/src/style.scss +++ b/packages/edit-site/src/style.scss @@ -1,6 +1,7 @@ @import "../../interface/src/style.scss"; @import "./components/block-editor/style.scss"; +@import "./components/canvas-spinner/style.scss"; @import "./components/code-editor/style.scss"; @import "./components/global-styles/style.scss"; @import "./components/header-edit-mode/style.scss";