import SvgIcon from "../SvgIcon";

const ImageSwitcher = ( { type = "image", onClick, ...props } ) => {

    const altType = type === "image" ? "dynamicimage" : "image";

    return (
        <div
            className="safi-image-switcher flex items-center gap-1 cursor-pointer transition"
            onClick={onClick}
            onMouseDown={e => e.stopPropagation()} // prevent mouse click from going up to the actual object
            title={`Turn into ${type === "image" ? "a content-based image" : "an image"}`}
        >
            <SvgIcon icon={type} />
            ⭢
            <SvgIcon icon={altType} />
        </div>
    );
};

export default ImageSwitcher;