JoinField = ({ name, block, fieldview, textStyle }) => {
  const {
    selected,
    node_id,
    connectors: { connect, drag },
  } = useNode((node) => ({ selected: node.events.selected, node_id: node.id }));
  const { previews, setPreviews } = useContext(previewCtx);
  const myPreview = previews[node_id];
  const options = useContext(optionsCtx);

  useEffect(() => {
    fetchFieldPreview({
      options,
      name,
      fieldview,
      configuration: {},
      setPreviews,
      node_id,
    })();
  }, []);
  return (
    <span
      className={`${textStyle} ${selected ? "selected-node" : ""}`}
      {...blockProps(block)}
      ref={(dom) => connect(drag(dom))}
    >
      {myPreview ? (
        <div
          className="d-inline"
          dangerouslySetInnerHTML={{ __html: myPreview }}
        ></div>
      ) : (
        `[${name}]`
      )}
    </span>
  );
}
@param {object} props
@param {string} props.name
@param {boolean} props.block
@param {object} props.fieldview
@param {string} props.textStyle
@returns {span}
@namespace
@category saltcorn-builder
@subcategory components