gcg-website/static/admin/shortcodes/image.js
Denys Konovalov b66a27e3b9
All checks were successful
website-main / prod-build (push) Successful in 2m2s
website-main / test-build (push) Successful in 2m2s
website-main / auto-rebuild (push) Has been skipped
CMS refactor
2023-05-29 16:22:34 +02:00

65 lines
1.4 KiB
JavaScript

import { Card, Image } from "./components/index.js";
import { md5 } from "../previews/page-previews/components/index.js";
const ImageShortcode = {
label: "Bild",
openTag: "{{< ",
closeTag: " >}}",
separator: " ",
toProps: (args) => {
if (args.length > 0) {
return {
src:
args
.find((arg) => arg.startsWith("src="))
?.split("=")[1]
.replaceAll('"', "") ?? "",
};
}
return { src: "" };
},
toArgs: ({ src }) => {
return [`src=\"${src}\"`];
},
control: ({ src, onChange, controlProps }) => {
const { collection, field, entry } = controlProps;
const handleChange = ({ path }) => {
onChange({ src: path });
};
const handleOpenMediaLibrary = useMediaInsert(
src,
{ collection, field },
handleChange
);
const assetSource = useMediaAsset(src, collection, field, entry);
return Card(
Image({
label: "Bild",
assetSource,
handleOpenMediaLibrary,
})
);
},
preview: ({ src }) => {
return h(
"div",
{ className: "col-lg-3 col-md-4 col-sm-6" },
h(
"a",
{ className: "vb-gallery", "data-gall": md5(src) },
h("img", {
className: "img-thumbnail w-100 h-100",
style: { objectFit: "cover" },
src,
})
)
);
},
};
export default ImageShortcode;