Writing Flow: allow split out of caption on Enter (#22290)

* Image: allow split out of caption on Enter * Mark unstable
WordPress · May 19, 2020 · 7fa12a3 · 7fa12a3
1 parent 4bb758d
commit 7fa12a3
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/packages/block-editor/src/components/rich-text/index.js b/packages/block-editor/src/components/rich-text/index.js
@@ -117,6 +117,7 @@ function RichTextWrapper(
 		onRemove,
 		onMerge,
 		onSplit,
+		__unstableOnSplitAtEnd: onSplitAtEnd,
 		__unstableOnSplitMiddle: onSplitMiddle,
 		identifier,
 		// To do: find a better way to implicitly inherit props.
@@ -360,11 +361,17 @@ function RichTextWrapper(
 				} else {
 					onChange( insertLineSeparator( value ) );
 				}
-			} else if ( shiftKey || ! canSplit ) {
+			} else if ( shiftKey || ( ! canSplit && ! onSplitAtEnd ) ) {
 				if ( ! disableLineBreaks ) {
 					onChange( insert( value, '\n' ) );
 				}
-			} else {
+			} else if ( onSplitAtEnd && ! canSplit ) {
+				const { text, start, end } = value;
+
+				if ( start === end && end === text.length ) {
+					onSplitAtEnd();
+				}
+			} else if ( canSplit ) {
 				splitValue( value );
 			}
 		},

diff --git a/packages/block-library/src/image/edit.js b/packages/block-library/src/image/edit.js
@@ -38,6 +38,7 @@ import { __, sprintf } from '@wordpress/i18n';
 import { getPath } from '@wordpress/url';
 import { withViewportMatch } from '@wordpress/viewport';
 import { image as icon } from '@wordpress/icons';
+import { createBlock } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -334,6 +335,7 @@ export class ImageEdit extends Component {
 			isRTL,
 			onResizeStart,
 			onResizeStop,
+			insertBlocksAfter,
 		} = this.props;
 		const {
 			url,
@@ -672,6 +674,11 @@ export class ImageEdit extends Component {
 							}
 							isSelected={ this.state.captionFocused }
 							inlineToolbar
+							__unstableOnSplitAtEnd={ () =>
+								insertBlocksAfter(
+									createBlock( 'core/paragraph' )
+								)
+							}
 						/>
 					) }