homegrade_blocks_production/blocks/content-heading/src/save.js
2025-03-18 11:29:49 +01:00

72 lines
1.6 KiB
JavaScript

import { useBlockProps, RichText } from "@wordpress/block-editor";
import keyIcon from "./img/icon_key.svg";
import chainIcon from "./img/icon_chain.svg";
import houseIcon from "./img/icon_house.svg";
import bulbIcon from "./img/icon_bulb.svg";
import warningIcon from "./img/icon_warning.svg";
import acousticIcon from "./img/icon_acoustic.svg";
import documentationIcon from "./img/icon_documentation.svg";
import notificationIcon from "./img/icon_notification.svg";
import searchIcon from "./img/icon_search.svg";
import infoIcon from "./img/icon_info.svg";
import tipIcon from "./img/icon_tip.svg";
import euroIcon from "./img/icon_euro.svg";
export default function save({ attributes }) {
const { title, headingLevel, hasIcon, iconName, idName } = attributes;
function getIconPicture() {
switch (iconName) {
case "key":
return keyIcon;
case "chain":
return chainIcon;
case "house":
return houseIcon;
case "bulb":
return bulbIcon;
case "warning":
return warningIcon;
case "acoustic":
return acousticIcon;
case "documentation":
return documentationIcon;
case "notification":
return notificationIcon;
case "search":
return searchIcon;
case "info":
return infoIcon;
case "tip":
return tipIcon;
case "euro":
return euroIcon;
}
}
let iconPicture = getIconPicture();
return (
<>
<RichText.Content
id={idName}
tagName={headingLevel}
value={title}
{...useBlockProps.save({
className: `homegrade-blocks-custom-heading ${
hasIcon ? "has-icon has-icon--" + iconName : ""
}`,
})}
/>
</>
);
}