Function Tooltip

component/ui/tooltip.tsx:51–98

(props: any)

}

export default function Tooltip(props: any) {
  const handleConfirm = () => {
    props.onConfirm()
  }

  const navigateElement = (direction: "parent" | "child" | "prev" | "next") => {
    props.onNavigate(direction)
  }

  const handleCancel = () => {
    props.onCancel()
  }

  const setTooltipStyle = () => {
    return { ...tooltipStyles.tooltip, left: props.left, top: props.top }
  }

  return (
    <div style={setTooltipStyle()} className="codebox-tooltip">
      <button style={tooltipStyles.blueButton} onClick={handleConfirm}>
        <CheckOutlined /> 确定
      </button>
      <button
        style={tooltipStyles.button}
        onClick={() => navigateElement("parent")}>
        <UpSquareOutlined /> 父节点
      </button>
      <button
        style={tooltipStyles.button}
        onClick={() => navigateElement("child")}>
        <DownSquareOutlined /> 子节点
      </button>
      <button
        style={tooltipStyles.button}
        onClick={() => navigateElement("prev")}>
        <LeftSquareOutlined /> 上一个
      </button>
      <button
        style={tooltipStyles.button}
        onClick={() => navigateElement("next")}>
        <RightSquareOutlined /> 下一个
      </button>
      <button style={tooltipStyles.redButton} onClick={handleCancel}>
        <CloseOutlined /> 取消
      </button>
    </div>
  )
}