Displays a selector for setting the image size and the corresponding url.
import { ImageSizeSelector } from '@t2/editor';
function Edit({ attributes, setAttributes }) {
const {imageId, imageUrl, sizeSlug} = attributes;
<InspectorControls>
<PanelBody title={__('Settings', 't2')}>
<ImageSizeSelector
value={sizeSlug}
imageId={imageId}
onChange={(slug, url) =>
setAttributes({ sizeSlug: slug, imageUrl: url })
}
/>
</PanelBody>
</InspectorControls>
}
Prop | Type | Description |
---|---|---|
label? | string | The control label. |
value? | string | The image size slug. |
imageId | number | The image id. |
onChange | (slug, url) => void | Returns the image size slug and url. |