@gechiui/block-editor/src/components/link-control/search-create-button.js

Generic block editor.

/**
 * External dependencies
 */
import classnames from 'classnames';
import { isFunction } from 'lodash';

/**
 * GeChiUI dependencies
 */
import { __, sprintf } from '@gechiui/i18n';
import { Button } from '@gechiui/components';
import { createInterpolateElement } from '@gechiui/element';
import { Icon, plus } from '@gechiui/icons';

export const LinkControlSearchCreate = ( {
	searchTerm,
	onClick,
	itemProps,
	isSelected,
	buttonText,
} ) => {
	if ( ! searchTerm ) {
		return null;
	}

	let text;
	if ( buttonText ) {
		text = isFunction( buttonText ) ? buttonText( searchTerm ) : buttonText;
	} else {
		text = createInterpolateElement(
			sprintf(
				/* translators: %s: search term. */
				__( '创建：<mark>%s</mark>' ),
				searchTerm
			),
			{ mark: <mark /> }
		);
	}

	return (
		<Button
			{ ...itemProps }
			className={ classnames(
				'block-editor-link-control__search-create block-editor-link-control__search-item',
				{
					'is-selected': isSelected,
				}
			) }
			onClick={ onClick }
		>
			<Icon
				className="block-editor-link-control__search-item-icon"
				icon={ plus }
			/>

			<span className="block-editor-link-control__search-item-header">
				<span className="block-editor-link-control__search-item-title">
					{ text }
				</span>
			</span>
		</Button>
	);
};

export default LinkControlSearchCreate;