Getting content of currently active Text component wrapped inside popover of antd

I am using antd components for my react app. I have a Text component wrapped inside of Popover component.

<Popover>
<Text onMouseOver={handleOnMouseOverCommitId}> {someValueThatIAmTryingToRead} </Text>
</Popover>

I want to get hold of the Text component's value whenever I hover over it. I tried getting it with e.target.value via onMouseOver event, but it returned undefined.

I think I get the reason behind it, because the event.target returns an html node of type <span>.

With a normal div element e.target.value has worked in the past for me. But doing the same thing with a predefined component like antd's Text seems a bit trickier.

EDIT 1 : START

Just to elaborate, the Popover has two buttons and based on which button user clicks, I need to render some other components, something like an overlay component ( somewhat similar to that of antd's modal).

But in order to do that I would also need to get hold of the text because the rendered component would be containing data(via some other rest calls) specific to that text that I actually hovered my cursor upon and which originally triggered the Popover.

Below is the code(most of the things removed for preciseness). record.name is what I ultimately need to capture.

    <Popover
        content={
            <>
                <Space>
                    <Button onClick={showSomeOverlayPaneForName}>
                        {"View Details for record.name"}
                    </Button>
                    <Button href={"https://abc.xyz.com/" + record.role}>
                        {"View Role Details"}
                    </Button>
                </Space>
            </>
        }
        trigger={"hover"}
    >
        <Text style= copyable={true} onMouseOver={handleOnMouseOverName}>{record.name}</Text>
    </Popover>

The handleOnMouseOverName function(which doesn't work anyway) :

const handleOnMouseOverName = (e) => {
    //console.log("e.target.value :--- ", e.target.value);
    setCurrentActiveName(e.target.value)
}

And once my currentActiveName variable is set(via useState), I use that value inside my function showSomeOverlayPaneForName

const showSomeOverlayPaneForName = (e) => {
    axios
        .get(
            `some-url`,
            {
                params: {name: currentActiveName}
            }
        )
        .then((response) => {
            setData(response.data);

        }).catch(reason => {
        //xyz
    });
}

EDIT 1 : END