Add caption split at end to all caption blocks (#22934)

* Add caption split at end to all caption blocks

* Add for quote

packages/block-editor/src/components/rich-text/index.js

@@ -385,6 +385,7 @@ function RichTextWrapper(
 			__unstableMarkAutomaticChange,
 			multiline,
 			splitValue,
+			onSplitAtEnd,
 		]
 	);
 

packages/block-library/src/audio/edit.js

@@ -22,6 +22,7 @@ import { useEffect } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import { useSelect } from '@wordpress/data';
 import { audio as icon } from '@wordpress/icons';
+import { createBlock } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -37,6 +38,7 @@ function AudioEdit( {
 	onReplace,
 	isSelected,
 	noticeUI,
+	insertBlocksAfter,
 } ) {
 	const { id, autoplay, caption, loop, preload, src } = attributes;
 
@@ -190,6 +192,9 @@ function AudioEdit( {
 							setAttributes( { caption: value } )
 						}
 						inlineToolbar
+						__unstableOnSplitAtEnd={ () =>
+							insertBlocksAfter( createBlock( 'core/paragraph' ) )
+						}
 					/>
 				) }
 			</Block.figure>

packages/block-library/src/embed/edit.js

@@ -175,6 +175,7 @@ export function getEmbedEditComponent(
 				cannotEmbed,
 				themeSupportsResponsive,
 				tryAgain,
+				insertBlocksAfter,
 			} = this.props;
 
 			if ( fetching ) {
@@ -241,6 +242,7 @@ export function getEmbedEditComponent(
 						isSelected={ isSelected }
 						icon={ icon }
 						label={ label }
+						insertBlocksAfter={ insertBlocksAfter }
 					/>
 				</>
 			);

packages/block-library/src/embed/embed-preview.js

@@ -15,6 +15,7 @@ import { __, sprintf } from '@wordpress/i18n';
 import { Placeholder, SandBox } from '@wordpress/components';
 import { RichText, BlockIcon } from '@wordpress/block-editor';
 import { Component } from '@wordpress/element';
+import { createBlock } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -62,6 +63,7 @@ class EmbedPreview extends Component {
 			className,
 			icon,
 			label,
+			insertBlocksAfter,
 		} = this.props;
 		const { scripts } = preview;
 		const { interactive } = this.state;
@@ -142,6 +144,9 @@ class EmbedPreview extends Component {
 						value={ caption }
 						onChange={ onCaptionChange }
 						inlineToolbar
+						__unstableOnSplitAtEnd={ () =>
+							insertBlocksAfter( createBlock( 'core/paragraph' ) )
+						}
 					/>
 				) }
 			</figure>

packages/block-library/src/gallery/edit.js

@@ -334,7 +334,13 @@ class GalleryEdit extends Component {
 	}
 
 	render() {
-		const { attributes, className, isSelected, noticeUI } = this.props;
+		const {
+			attributes,
+			className,
+			isSelected,
+			noticeUI,
+			insertBlocksAfter,
+		} = this.props;
 		const {
 			columns = defaultColumnsNumber( attributes ),
 			imageCrop,
@@ -425,6 +431,7 @@ class GalleryEdit extends Component {
 					onDeselectImage={ this.onDeselectImage }
 					onSetImageAttributes={ this.setImageAttributes }
 					onFocusGalleryCaption={ this.onFocusGalleryCaption }
+					insertBlocksAfter={ insertBlocksAfter }
 				/>
 			</>
 		);

packages/block-library/src/gallery/gallery.js

@@ -9,6 +9,7 @@ import classnames from 'classnames';
 import { RichText } from '@wordpress/block-editor';
 import { VisuallyHidden } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
+import { createBlock } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -31,6 +32,7 @@ export const Gallery = ( props ) => {
 		onDeselectImage,
 		onSetImageAttributes,
 		onFocusGalleryCaption,
+		insertBlocksAfter,
 	} = props;
 
 	const {
@@ -97,6 +99,9 @@ export const Gallery = ( props ) => {
 				unstableOnFocus={ onFocusGalleryCaption }
 				onChange={ ( value ) => setAttributes( { caption: value } ) }
 				inlineToolbar
+				__unstableOnSplitAtEnd={ () =>
+					insertBlocksAfter( createBlock( 'core/paragraph' ) )
+				}
 			/>
 		</figure>
 	);

packages/block-library/src/pullquote/edit.js

@@ -16,6 +16,8 @@ import {
 	withColors,
 	PanelColorSettings,
 } from '@wordpress/block-editor';
+import { createBlock } from '@wordpress/blocks';
+
 /**
  * Internal dependencies
  */
@@ -103,6 +105,7 @@ class PullQuoteEdit extends Component {
 			setAttributes,
 			isSelected,
 			className,
+			insertBlocksAfter,
 		} = this.props;
 
 		const { value, citation } = attributes;
@@ -165,6 +168,11 @@ class PullQuoteEdit extends Component {
 								className="wp-block-pullquote__citation"
 								__unstableMobileNoFocusOnMount
 								textAlign="center"
+								__unstableOnSplitAtEnd={ () =>
+									insertBlocksAfter(
+										createBlock( 'core/paragraph' )
+									)
+								}
 							/>
 						) }
 					</BlockQuote>

packages/block-library/src/quote/edit.js

@@ -22,6 +22,7 @@ export default function QuoteEdit( {
 	mergeBlocks,
 	onReplace,
 	className,
+	insertBlocksAfter,
 } ) {
 	const { align, value, citation } = attributes;
 
@@ -89,6 +90,9 @@ export default function QuoteEdit( {
 						}
 						className="wp-block-quote__citation"
 						textAlign={ align }
+						__unstableOnSplitAtEnd={ () =>
+							insertBlocksAfter( createBlock( 'core/paragraph' ) )
+						}
 					/>
 				) }
 			</BlockQuotation>

packages/block-library/src/table/edit.js

@@ -39,6 +39,7 @@ import {
 	tableRowDelete,
 	table,
 } from '@wordpress/icons';
+import { createBlock } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -538,6 +539,7 @@ export class TableEdit extends Component {
 			backgroundColor,
 			setBackgroundColor,
 			setAttributes,
+			insertBlocksAfter,
 		} = this.props;
 		const { initialRowCount, initialColumnCount } = this.state;
 		const { hasFixedLayout, caption, head, body, foot } = attributes;
@@ -664,6 +666,9 @@ export class TableEdit extends Component {
 						unstableOnFocus={ () =>
 							this.setState( { selectedCell: null } )
 						}
+						__unstableOnSplitAtEnd={ () =>
+							insertBlocksAfter( createBlock( 'core/paragraph' ) )
+						}
 					/>
 				</figure>
 			</>

packages/block-library/src/video/edit.js

@@ -25,6 +25,7 @@ import { __, sprintf } from '@wordpress/i18n';
 import { compose, withInstanceId } from '@wordpress/compose';
 import { withSelect } from '@wordpress/data';
 import { video as icon } from '@wordpress/icons';
+import { createBlock } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -121,6 +122,7 @@ class VideoEdit extends Component {
 			noticeUI,
 			attributes,
 			setAttributes,
+			insertBlocksAfter,
 		} = this.props;
 		const onSelectVideo = ( media ) => {
 			if ( ! media || ! media.url ) {
@@ -245,6 +247,11 @@ class VideoEdit extends Component {
 								setAttributes( { caption: value } )
 							}
 							inlineToolbar
+							__unstableOnSplitAtEnd={ () =>
+								insertBlocksAfter(
+									createBlock( 'core/paragraph' )
+								)
+							}
 						/>
 					) }
 				</Block.figure>