homegrade_blocks_production/blocks/card-free/src/figure/edit.js

52 lines
1.1 KiB
JavaScript

import { __ } from "@wordpress/i18n";
import "./editor.scss";
import { useBlockProps, RichText } from "@wordpress/block-editor";
export default function Edit({ attributes, setAttributes, ...props }) {
let { figure, title, caption } = attributes;
function onTitleChange(title) {
setAttributes({ title });
}
function onFigureChange(figure) {
setAttributes({ figure });
}
function onCaptionChange(caption) {
setAttributes({ caption });
}
return (
<>
<figure
{...useBlockProps({
className: `homegrade-blocks-figure`,
})}
>
<RichText
tagName="h3"
onChange={onFigureChange}
value={figure}
className="homegrade-blocks-figure__figure"
placeholder="Chiffre"
/>
<RichText
tagName="p"
onChange={onTitleChange}
value={title}
placeholder="Sous titre du chiffre"
className="homegrade-blocks-figure__title"
/>
<figcaption className="homegrade-blocks-figure__caption">
<RichText
tagName="p"
onChange={onCaptionChange}
value={caption}
placeholder="explication"
/>
</figcaption>
</figure>
</>
);
}