diff --git a/packages/block-library/src/heading/edit.native.js b/packages/block-library/src/heading/edit.native.js
index 7ead0d8bf074b..fd17945cc6384 100644
--- a/packages/block-library/src/heading/edit.native.js
+++ b/packages/block-library/src/heading/edit.native.js
@@ -16,20 +16,58 @@ import { Component } from '@wordpress/element';
import { RichText, BlockControls } from '@wordpress/block-editor';
import { createBlock } from '@wordpress/blocks';
-/**
- * Internal dependencies
- */
-import './editor.scss';
+import styles from './editor.scss';
-const minHeight = 24;
+const name = 'core/heading';
class HeadingEdit extends Component {
constructor( props ) {
super( props );
- this.state = {
- aztecHeight: 0,
- };
+ this.splitBlock = this.splitBlock.bind( this );
+ }
+
+ /**
+ * Split handler for RichText value, namely when content is pasted or the
+ * user presses the Enter key.
+ *
+ * @param {?Array} before Optional before value, to be used as content
+ * in place of what exists currently for the
+ * block. If undefined, the block is deleted.
+ * @param {?Array} after Optional after value, to be appended in a new
+ * paragraph block to the set of blocks passed
+ * as spread.
+ * @param {...WPBlock} blocks Optional blocks inserted between the before
+ * and after value blocks.
+ */
+ splitBlock( before, after, ...blocks ) {
+ const {
+ attributes,
+ insertBlocksAfter,
+ setAttributes,
+ onReplace,
+ } = this.props;
+
+ if ( after !== null ) {
+ // Append "After" content as a new paragraph block to the end of
+ // any other blocks being inserted after the current paragraph.
+ const newBlock = createBlock( name, { content: after } );
+ blocks.push( newBlock );
+ }
+
+ if ( blocks.length && insertBlocksAfter ) {
+ insertBlocksAfter( blocks );
+ }
+
+ const { content } = attributes;
+ if ( before === null ) {
+ onReplace( [] );
+ } else if ( content !== before ) {
+ // Only update content if it has in-fact changed. In case that user
+ // has created a new paragraph at end of an existing one, the value
+ // of before will be strictly equal to the current content.
+ setAttributes( { content: before } );
+ }
}
render() {
@@ -37,7 +75,7 @@ class HeadingEdit extends Component {
attributes,
setAttributes,
mergeBlocks,
- insertBlocksAfter,
+ style,
} = this.props;
const {
@@ -47,6 +85,7 @@ class HeadingEdit extends Component {
} = attributes;
const tagName = 'h' + level;
+
return (
@@ -56,28 +95,16 @@ class HeadingEdit extends Component {
tagName={ tagName }
value={ content }
isSelected={ this.props.isSelected }
+ style={ {
+ ...style,
+ minHeight: styles[ 'wp-block-heading' ].minHeight,
+ } }
onFocus={ this.props.onFocus } // always assign onFocus as a props
onBlur={ this.props.onBlur } // always assign onBlur as a props
onCaretVerticalPositionChange={ this.props.onCaretVerticalPositionChange }
- style={ {
- minHeight: Math.max( minHeight, this.state.aztecHeight ),
- } }
onChange={ ( value ) => setAttributes( { content: value } ) }
onMerge={ mergeBlocks }
- onSplit={
- insertBlocksAfter ?
- ( before, after, ...blocks ) => {
- setAttributes( { content: before } );
- insertBlocksAfter( [
- ...blocks,
- createBlock( 'core/paragraph', { content: after } ),
- ] );
- } :
- undefined
- }
- onContentSizeChange={ ( event ) => {
- this.setState( { aztecHeight: event.aztecHeight } );
- } }
+ onSplit={ this.splitBlock }
placeholder={ placeholder || __( 'Write heading…' ) }
/>
diff --git a/packages/block-library/src/heading/style.native.scss b/packages/block-library/src/heading/style.native.scss
new file mode 100644
index 0000000000000..f4801b92a6bc5
--- /dev/null
+++ b/packages/block-library/src/heading/style.native.scss
@@ -0,0 +1,4 @@
+
+.blockText {
+ min-height: $min-height-heading;
+}
diff --git a/packages/block-library/src/image/edit.native.js b/packages/block-library/src/image/edit.native.js
index 2481d1ce3184a..8158a3612af92 100644
--- a/packages/block-library/src/image/edit.native.js
+++ b/packages/block-library/src/image/edit.native.js
@@ -347,14 +347,6 @@ class ImageEdit extends React.Component {
imageHeightWithinContainer,
} = sizes;
- if ( imageWidthWithinContainer === undefined ) {
- return (
-
-
-
- );
- }
-
let finalHeight = imageHeightWithinContainer;
if ( height > 0 && height < imageHeightWithinContainer ) {
finalHeight = height;
@@ -369,6 +361,9 @@ class ImageEdit extends React.Component {
{ getInspectorControls() }
{ getMediaOptions() }
+ { ! imageWidthWithinContainer &&
+
+ }
{
setAttributes( {
content: nextContent,
@@ -122,9 +112,6 @@ class ParagraphEdit extends Component {
onSplit={ this.splitBlock }
onMerge={ mergeBlocks }
onReplace={ this.onReplace }
- onContentSizeChange={ ( event ) => {
- this.setState( { aztecHeight: event.aztecHeight } );
- } }
placeholder={ placeholder || __( 'Start writing…' ) }
/>
diff --git a/packages/block-library/src/paragraph/style.native.scss b/packages/block-library/src/paragraph/style.native.scss
index a732fa2608dd1..87d8ccedc8dc8 100644
--- a/packages/block-library/src/paragraph/style.native.scss
+++ b/packages/block-library/src/paragraph/style.native.scss
@@ -1,3 +1,4 @@
+
.blockText {
- min-height: 24;
+ min-height: $min-height-paragraph;
}