@gechiui/block-editor
Version:
69 lines (65 loc) • 1.73 kB
JavaScript
/**
* External dependencies
*/
import classnames from 'classnames';
/**
* GeChiUI dependencies
*/
import { safeDecodeURI, filterURLForDisplay } from '@gechiui/url';
import { __ } from '@gechiui/i18n';
import { Button, TextHighlight } from '@gechiui/components';
import { Icon, globe } from '@gechiui/icons';
export const LinkControlSearchItem = ( {
itemProps,
suggestion,
isSelected = false,
onClick,
isURL = false,
searchTerm = '',
shouldShowType = false,
} ) => {
return (
<Button
{ ...itemProps }
onClick={ onClick }
className={ classnames( 'block-editor-link-control__search-item', {
'is-selected': isSelected,
'is-url': isURL,
'is-entity': ! isURL,
} ) }
>
{ isURL && (
<Icon
className="block-editor-link-control__search-item-icon"
icon={ globe }
/>
) }
<span className="block-editor-link-control__search-item-header">
<span className="block-editor-link-control__search-item-title">
<TextHighlight
text={ suggestion.title }
highlight={ searchTerm }
/>
</span>
<span
aria-hidden={ ! isURL }
className="block-editor-link-control__search-item-info"
>
{ ! isURL &&
( filterURLForDisplay(
safeDecodeURI( suggestion.url )
) ||
'' ) }
{ isURL && __( '按回车件以添加此链接' ) }
</span>
</span>
{ shouldShowType && suggestion.type && (
<span className="block-editor-link-control__search-item-type">
{ /* Rename 'post_tag' to 'tag'. Ideally, the API would return the localised CPT or taxonomy label. */ }
{ suggestion.type === 'post_tag' ? 'tag' : suggestion.type }
</span>
) }
</Button>
);
};
export default LinkControlSearchItem;