ViewLink = ({
  name,
  block,
  minRole,
  link_style,
  link_size,
  link_icon,
  inModal,
  label,
  textStyle,
  link_bgcol,
  link_bordercol,
  link_textcol,
}) => {
  const {
    selected,
    connectors: { connect, drag },
  } = useNode((node) => ({ selected: node.events.selected }));
  const names = name.split(":");

  const displabel = label || (names.length > 1 ? names[1] : names[0]);
  return (
    <span
      className={`${textStyle} ${
        selected ? "selected-node" : "is-builder-link"
      } ${link_style} ${link_size || ""} ${block ? "d-block" : ""}`}
      ref={(dom) => connect(drag(dom))}
      style={
        link_style === "btn btn-custom-color"
          ? {
              backgroundColor: link_bgcol || "#000000",
              borderColor: link_bordercol || "#000000",
              color: link_textcol || "#000000",
            }
          : {}
      }
    >
      {link_icon ? <i className={`${link_icon} me-1`}></i> : ""}
      {displabel}
    </span>
  );
}
@param {object} props
@param {string} props.name
@param {boolean} props.block
@param {*} props.minRole
@param {string} props.link_style
@param {string} props.link_size
@param {string} [props.link_icon]
@param {boolean} props.inModal
@param {string} [props.label]
@param {string} props.textStyle
@param {string} [props.link_bgcol]
@param {string} [props.link_bordercol]
@param {string} [props.link_textcol]
@returns {tr}
@category saltcorn-builder
@subcategory components
@namespace