ImagePlaceholder.jsx
33 lines
| 1 | import { MediaPlaceholder } from '@wordpress/block-editor'; |
| 2 | import { __ } from '@wordpress/i18n'; |
| 3 | import getIcon from '../../../utils/get-icon'; |
| 4 | |
| 5 | export function ImagePlaceholder( props ) { |
| 6 | const { |
| 7 | onSelectImage, |
| 8 | onSelectURL, |
| 9 | onUploadError, |
| 10 | uniqueId, |
| 11 | } = props; |
| 12 | |
| 13 | const placeholder = <MediaPlaceholder |
| 14 | labels={ { |
| 15 | title: __( 'Image', 'generateblocks' ), |
| 16 | instructions: __( 'Choose an image from your media library or add one with a URL.', 'generateblocks' ), |
| 17 | } } |
| 18 | icon={ getIcon( 'image' ) } |
| 19 | onSelect={ onSelectImage } |
| 20 | onSelectURL={ onSelectURL } |
| 21 | onError={ onUploadError } |
| 22 | accept="image/*" |
| 23 | allowedTypes={ [ 'image' ] } |
| 24 | />; |
| 25 | |
| 26 | return <div |
| 27 | className="gblocks-image__placeholder" |
| 28 | data-gb-id={ uniqueId } |
| 29 | > |
| 30 | { placeholder } |
| 31 | </div>; |
| 32 | } |
| 33 |