How to use @wordpress/autop - 9 common examples

// Convert 'core/text' blocks in existing content to 'core/paragraph'.
	if ( 'core/text' === name || 'core/cover-text' === name ) {
		name = 'core/paragraph';
	}

	// Try finding the type for known block name, else fall back again.
	let blockType = getBlockType( name );

	const fallbackBlock = getUnknownTypeHandlerName();

	// Fallback content may be upgraded from classic editor expecting implicit
	// automatic paragraphs, so preserve them. Assumes wpautop is idempotent,
	// meaning there are no negative consequences to repeated autop calls.
	if ( name === fallbackBlock ) {
		innerHTML = autop( innerHTML ).trim();
	}

	if ( ! blockType ) {
		// If detected as a block which is not registered, preserve comment
		// delimiters in content of unknown type handler.
		if ( name ) {
			innerHTML = getCommentDelimitedContent( name, attributes, innerHTML );
		}

		name = fallbackBlock;
		blockType = getBlockType( name );
	}

	// Coerce inner blocks from parsed form to canonical form.
	innerBlocks = innerBlocks.map( createBlockWithFallback );

}
										 )
										: (
											/* translators: placeholder is an author name. */
											sprintf( __( 'By %s' ), pluginDetails.Author )
										)
									}

								
							<p></p>
						),
						pluginDetails.Description &amp;&amp; (
							<div>
						),

					].filter( ( child ) =&gt; child ) }

				
			
			
				{
					isOriginallySuppressed ? (
						<p>
							
							{ ' ' }
							
							{ ' ' }
							</p></div>

analyze( id, { paper, relatedKeywords = {} } ) {
		// Automatically add paragraph tags, like Wordpress does, on blocks padded by double newlines or html elements.
		paper._text = autop( paper._text );
		paper._text = string.removeHtmlBlocks( paper._text );
		const paperHasChanges = this._paper === null || ! this._paper.equals( paper );
		const shouldReadabilityUpdate = this.shouldReadabilityUpdate( paper );

		if ( paperHasChanges ) {
			this._paper = paper;
			this._researcher.setPaper( this._paper );

			// Update the configuration locale to the paper locale.
			this.setLocale( this._paper.getLocale() );
		}

		if ( this._configuration.keywordAnalysisActive && this._seoAssessor ) {
			if ( paperHasChanges ) {
				this._seoAssessor.assess( this._paper );

const helpTextString = Array.isArray( helpText ) ? helpText[ 0 ] : helpText;
	const helpLink = ( Array.isArray( helpText ) && !! helpText[ 1 ] )
		? helpText[ 1 ]
		: undefined;

	return (
		<div>
			{ 'heading' !== fieldType &amp;&amp; (
				<div name="">
					<label name="">
						<span>
						{ required &amp;&amp; ( <span>{ '\u00A0' /* &nbsp; */ }*</span> ) }
					</span></label>

					{ shouldShowHelpText &amp;&amp; (
						<span style="{">
							{ '\u00A0' /* &nbsp; */ }
							
						</span>
					) }
				</div>
			) }</div>

<title>{__( 'Update' )}</title>

			{ banner &amp;&amp;  }

			
				
					
						{ updating &amp;&amp;  }
						{ updatingText }
					
				
			

			
				{ __( 'Description' ) }
				
			

		
	)
}

{ banner &&  }

			
				
					
						{ updating &&  }
						{ updatingText }
					
				
			

			
				{ __( 'Description' ) }
				
			

		
	)
}

}

					{ editing &&
						 setEditing( false ) }
						/>
					}

					{ ! editing &&
						<div style="{{">
							
								{contentTitle}
								<div>
							
						</div>
					}
				

			
		
	)
}
</div>

}

					{ editing &&
						 setEditing( false ) }
						/>
					}

					{ ! editing &&
						<div style="{{">
							
								{contentTitle}
								<div>
							
						</div>
					}
				

			
		
	)
}
</div>

);
		}
		case 'TextareaControl': {
			const {
				auto_p: shouldAutoP,
			} = fieldOptions;

			const sanitizedText = sanitizeHtml( fieldValue, plainText );

			return (
				<div name="">
			);
		}
		case 'RichText': {
			return (
				
			);
		}
		case 'CheckboxControl': {
			return (</div>