@gechiui/block-editor/src/components/caption/index.native.js

Generic block editor.

/**
 * External dependencies
 */
import { View } from 'react-native';

/**
 * GeChiUI dependencies
 */
import { createBlock } from '@gechiui/blocks';
import { RichText } from '@gechiui/block-editor';
import { __ } from '@gechiui/i18n';

const Caption = ( {
	accessibilityLabelCreator,
	accessible,
	inlineToolbar,
	isSelected,
	onBlur,
	onChange,
	onFocus,
	placeholder = __( '添加说明文字' ),
	placeholderTextColor,
	shouldDisplay = true,
	style,
	value,
	insertBlocksAfter = () => {},
} ) => (
	<View
		accessibilityLabel={
			accessibilityLabelCreator
				? accessibilityLabelCreator( value )
				: undefined
		}
		accessibilityRole="button"
		accessible={ accessible }
		style={ { flex: 1, display: shouldDisplay ? 'flex' : 'none' } }
	>
		<RichText
			__unstableMobileNoFocusOnMount
			fontSize={ style && style.fontSize ? style.fontSize : 14 }
			inlineToolbar={ inlineToolbar }
			isSelected={ isSelected }
			onBlur={ onBlur }
			onChange={ onChange }
			placeholder={ placeholder }
			placeholderTextColor={ placeholderTextColor }
			rootTagsToEliminate={ [ 'p' ] }
			style={ style }
			tagName="p"
			textAlign="center"
			underlineColorAndroid="transparent"
			unstableOnFocus={ onFocus }
			value={ value }
			__unstableOnSplitAtEnd={ () =>
				insertBlocksAfter( createBlock( 'core/paragraph' ) )
			}
			deleteEnter={ true }
		/>
	</View>
);

export default Caption;