diff --git a/packages/block-editor/src/components/block-inspector/index.js b/packages/block-editor/src/components/block-inspector/index.js index 199f4f4628b4b..b6ac55afa6712 100644 --- a/packages/block-editor/src/components/block-inspector/index.js +++ b/packages/block-editor/src/components/block-inspector/index.js @@ -356,6 +356,7 @@ const BlockInspectorSingleBlock = ( { clientId, blockName } ) => { ) } + { return ( props ) => { const hasAnchor = hasBlockSupport( props.name, 'anchor' ); + const blockEditingMode = useBlockEditingMode(); if ( hasAnchor && props.isSelected ) { const isWeb = Platform.OS === 'web'; @@ -104,7 +106,7 @@ export const withInspectorControl = createHigherOrderComponent( return ( <> - { isWeb && ( + { isWeb && blockEditingMode === 'default' && ( { textControl } diff --git a/packages/block-editor/src/hooks/custom-class-name.js b/packages/block-editor/src/hooks/custom-class-name.js index fa1a1cadc5712..5505c5fcae2cc 100644 --- a/packages/block-editor/src/hooks/custom-class-name.js +++ b/packages/block-editor/src/hooks/custom-class-name.js @@ -16,6 +16,7 @@ import { createHigherOrderComponent } from '@wordpress/compose'; * Internal dependencies */ import { InspectorControls } from '../components'; +import { useBlockEditingMode } from '../components/block-editing-mode'; /** * Filters registered block settings, extending attributes to include `className`. @@ -50,6 +51,7 @@ export function addAttribute( settings ) { export const withInspectorControl = createHigherOrderComponent( ( BlockEdit ) => { return ( props ) => { + const blockEditingMode = useBlockEditingMode(); const hasCustomClassName = hasBlockSupport( props.name, 'customClassName', @@ -59,25 +61,27 @@ export const withInspectorControl = createHigherOrderComponent( return ( <> - - { - props.setAttributes( { - className: - nextValue !== '' - ? nextValue - : undefined, - } ); - } } - help={ __( - 'Separate multiple classes with spaces.' - ) } - /> - + { blockEditingMode === 'default' && ( + + { + props.setAttributes( { + className: + nextValue !== '' + ? nextValue + : undefined, + } ); + } } + help={ __( + 'Separate multiple classes with spaces.' + ) } + /> + + ) } ); } diff --git a/packages/block-editor/src/hooks/layout.js b/packages/block-editor/src/hooks/layout.js index 815b36e785a81..e02e34caf8291 100644 --- a/packages/block-editor/src/hooks/layout.js +++ b/packages/block-editor/src/hooks/layout.js @@ -329,8 +329,11 @@ export const withInspectorControls = createHigherOrderComponent( layoutBlockSupportKey ); + const blockEditingMode = useBlockEditingMode(); return [ - supportLayout && , + supportLayout && blockEditingMode === 'default' && ( + + ), , ]; }, diff --git a/packages/block-editor/src/hooks/style.js b/packages/block-editor/src/hooks/style.js index edf28773e14d5..11946ff53a6de 100644 --- a/packages/block-editor/src/hooks/style.js +++ b/packages/block-editor/src/hooks/style.js @@ -34,6 +34,7 @@ import { } from './dimensions'; import useDisplayBlockControls from '../components/use-display-block-controls'; import { shouldSkipSerialization } from './utils'; +import { useBlockEditingMode } from '../components/block-editing-mode'; const styleSupportKeys = [ ...TYPOGRAPHY_SUPPORT_KEYS, @@ -347,10 +348,11 @@ export function addEditProps( settings ) { export const withBlockControls = createHigherOrderComponent( ( BlockEdit ) => ( props ) => { const shouldDisplayControls = useDisplayBlockControls(); + const blockEditingMode = useBlockEditingMode(); return ( <> - { shouldDisplayControls && ( + { shouldDisplayControls && blockEditingMode === 'default' && ( <> diff --git a/packages/edit-site/src/hooks/push-changes-to-global-styles/index.js b/packages/edit-site/src/hooks/push-changes-to-global-styles/index.js index 5ee0efcd6fa7c..11a765b9807d6 100644 --- a/packages/edit-site/src/hooks/push-changes-to-global-styles/index.js +++ b/packages/edit-site/src/hooks/push-changes-to-global-styles/index.js @@ -29,7 +29,9 @@ import { store as noticesStore } from '@wordpress/notices'; import { useSupportedStyles } from '../../components/global-styles/hooks'; import { unlock } from '../../private-apis'; -const { GlobalStylesContext } = unlock( blockEditorPrivateApis ); +const { GlobalStylesContext, useBlockEditingMode } = unlock( + blockEditorPrivateApis +); // TODO: Temporary duplication of constant in @wordpress/block-editor. Can be // removed by moving PushChangesToGlobalStylesControl to @@ -208,15 +210,19 @@ function PushChangesToGlobalStylesControl( { } const withPushChangesToGlobalStyles = createHigherOrderComponent( - ( BlockEdit ) => ( props ) => - ( + ( BlockEdit ) => ( props ) => { + const blockEditingMode = useBlockEditingMode(); + return ( <> - - - + { blockEditingMode === 'default' && ( + + + + ) } - ) + ); + } ); addFilter(