diff --git a/packages/block-editor/src/components/block-list/use-block-props/index.js b/packages/block-editor/src/components/block-list/use-block-props/index.js
index 2f0173d6c29941..b7449439e72348 100644
--- a/packages/block-editor/src/components/block-list/use-block-props/index.js
+++ b/packages/block-editor/src/components/block-list/use-block-props/index.js
@@ -6,7 +6,7 @@ import classnames from 'classnames';
/**
* WordPress dependencies
*/
-import { useContext, useMemo } from '@wordpress/element';
+import { useContext } from '@wordpress/element';
import { __, sprintf } from '@wordpress/i18n';
import {
__unstableGetBlockProps as getBlockProps,
@@ -128,11 +128,6 @@ export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
} ),
] );
- const updatedStyle = { ...wrapperProps.style, ...props.style };
- const style = useMemo( () => updatedStyle, [
- JSON.stringify( updatedStyle ),
- ] );
-
return {
...wrapperProps,
...props,
@@ -157,7 +152,7 @@ export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
useBlockCustomClassName( clientId ),
useBlockMovingModeClassNames( clientId )
),
- style,
+ style: { ...wrapperProps.style, ...props.style },
};
}
diff --git a/packages/block-library/src/paragraph/edit.js b/packages/block-library/src/paragraph/edit.js
index 804e9af1d5a686..e88bfc3c721179 100644
--- a/packages/block-library/src/paragraph/edit.js
+++ b/packages/block-library/src/paragraph/edit.js
@@ -22,7 +22,6 @@ import {
} from '@wordpress/block-editor';
import { createBlock } from '@wordpress/blocks';
import { formatLtr } from '@wordpress/icons';
-import { useCallback } from '@wordpress/element';
const name = 'core/paragraph';
@@ -65,54 +64,20 @@ function ParagraphBlock( {
style: { direction },
} );
- const updateContent = useCallback(
- ( newContent ) => setAttributes( { content: newContent } ),
- [ setAttributes ]
- );
-
- const splitParagraph = useCallback(
- ( value, isOriginal ) => {
- let newAttributes;
-
- if ( isOriginal || value ) {
- newAttributes = {
- ...attributes,
- content: value,
- };
- }
-
- const block = createBlock( name, newAttributes );
-
- if ( isOriginal ) {
- block.clientId = clientId;
- }
-
- return block;
- },
- [ attributes, createBlock ]
- );
-
- const updateAlign = useCallback( ( newAlign ) =>
- setAttributes( { align: newAlign }, [ setAttributes ] )
- );
-
- const setDirection = useCallback(
- ( newDirection ) => setAttributes( { direction: newDirection } ),
- []
- );
-
- const setDropCap = useCallback(
- () => setAttributes( { dropCap: ! dropCap } ),
- [ setAttributes ]
- );
-
return (
<>
-
+
+ setAttributes( { align: newAlign } )
+ }
+ />
+ setAttributes( { direction: newDirection } )
+ }
/>
{ isDropCapFeatureEnabled && (
@@ -121,7 +86,9 @@ function ParagraphBlock( {
+ setAttributes( { dropCap: ! dropCap } )
+ }
help={
dropCap
? __( 'Showing large initial letter.' )
@@ -138,8 +105,27 @@ function ParagraphBlock( {
tagName="p"
{ ...blockProps }
value={ content }
- onChange={ updateContent }
- onSplit={ splitParagraph }
+ onChange={ ( newContent ) =>
+ setAttributes( { content: newContent } )
+ }
+ onSplit={ ( value, isOriginal ) => {
+ let newAttributes;
+
+ if ( isOriginal || value ) {
+ newAttributes = {
+ ...attributes,
+ content: value,
+ };
+ }
+
+ const block = createBlock( name, newAttributes );
+
+ if ( isOriginal ) {
+ block.clientId = clientId;
+ }
+
+ return block;
+ } }
onMerge={ mergeBlocks }
onReplace={ onReplace }
onRemove={ onRemove }