Image = ({ fileid, block, srctype, url, alt, style, customClass }) => {
  const {
    selected,
    connectors: { connect, drag },
  } = useNode((node) => ({ selected: node.events.selected }));
  const theurl = srctype === "File" ? `/files/serve/${fileid}` : url;
  return fileid === 0 ? (
    <span
      {...blockProps(block)}
      className={`${style && style.width ? "" : "w-100"} ${customClass || ""} image-widget ${
        selected ? "selected-node" : ""
      }`}
      ref={(dom) => connect(drag(dom))}
      style={reactifyStyles(style || {})}
    >
      No images Available
    </span>
  ) : (
    <img
      {...blockProps(block)}
      ref={(dom) => connect(drag(dom))}
      className={`${style && style.width ? "" : "w-100"} ${customClass || ""} image-widget ${
        selected ? "selected-node" : ""
      }`}
      style={reactifyStyles(style || {})}
      src={theurl}
      alt={alt}
    ></img>
  );
}
@param {object} props
@param {string} props.fileid
@param {boolean} props.block
@param {string} props.srctype
@param {string} props.url
@param {string} props.alt
@returns {span}
@namespace
@category saltcorn-builder
@subcategory components