diff --git a/packages/block-editor/src/components/block-list/block-list-item-cell.native.js b/packages/block-editor/src/components/block-list/block-list-item-cell.native.js
index c399643a633996..e32d793af46d67 100644
--- a/packages/block-editor/src/components/block-list/block-list-item-cell.native.js
+++ b/packages/block-editor/src/components/block-list/block-list-item-cell.native.js
@@ -13,7 +13,7 @@ import { useEffect, useCallback } from '@wordpress/element';
*/
import { useBlockListContext } from './block-list-context';
-function BlockListItemCell( { children, clientId, rootClientId } ) {
+function BlockListItemCell( { children, clientId, rootClientId, onLayout } ) {
const { blocksLayouts, updateBlocksLayouts } = useBlockListContext();
useEffect( () => {
@@ -25,18 +25,25 @@ function BlockListItemCell( { children, clientId, rootClientId } ) {
};
}, [] );
- const onLayout = useCallback(
- ( { nativeEvent: { layout } } ) => {
+ const onCellLayout = useCallback(
+ ( event ) => {
+ const {
+ nativeEvent: { layout },
+ } = event;
updateBlocksLayouts( blocksLayouts, {
clientId,
rootClientId,
...layout,
} );
+
+ if ( onLayout ) {
+ onLayout( event );
+ }
},
- [ clientId, rootClientId, updateBlocksLayouts ]
+ [ clientId, rootClientId, updateBlocksLayouts, onLayout ]
);
- return { children };
+ return { children };
}
export default BlockListItemCell;
diff --git a/packages/block-editor/src/components/block-list/index.native.js b/packages/block-editor/src/components/block-list/index.native.js
index 3ec3fefc8207b3..a4248327589ed1 100644
--- a/packages/block-editor/src/components/block-list/index.native.js
+++ b/packages/block-editor/src/components/block-list/index.native.js
@@ -162,12 +162,13 @@ export class BlockList extends Component {
return this.extraData;
}
- getCellRendererComponent( { children, item } ) {
+ getCellRendererComponent( { children, item, onLayout } ) {
const { rootClientId } = this.props;
return (
);