homegrade_blocks_production/blocks/text-image/src/save.js

55 lines
1.4 KiB
JavaScript

import { useBlockProps, InnerBlocks } from "@wordpress/block-editor";
import Image from "../../_components/Image";
export default function save({ attributes }) {
let {
imageAlt,
imageUrl,
imageCaption,
imageDescription,
imageProportion,
contentDisposition,
} = attributes;
return (
<div
{...useBlockProps.save({
className: `homegrade-blocks-text-image`,
})}
>
{contentDisposition === "left" && (
<>
<div className="homegrade-blocks-text-image__column homegrade-blocks-text-image__column--text">
<InnerBlocks.Content />
</div>
<div className="homegrade-blocks-text-image__column homegrade-blocks-text-image__column--image">
<Image
imageAlt={imageAlt}
imageUrl={imageUrl}
imageProportion={imageProportion}
/>
{imageDescription && <p>{imageDescription}</p>}
{imageCaption && <p>{imageCaption}</p>}
</div>
</>
)}
{contentDisposition === "right" && (
<>
<div className="homegrade-blocks-text-image__column homegrade-blocks-text-image__column--image">
<Image
imageAlt={imageAlt}
imageUrl={imageUrl}
imageProportion={imageProportion}
/>
{imageDescription && <p>{imageDescription}</p>}
{imageCaption && <p>{imageCaption}</p>}
</div>
<div className="homegrade-blocks-text-image__column homegrade-blocks-text-image__column--text">
<InnerBlocks.Content />
</div>
</>
)}
</div>
);
}