React Sematic-UI Dropdown renderLabel popup / tooltip on mouse hover - reactjs

Question

I'm making a react Sematic-UI Dropdown with multiselect and custom renderLabel function, I want to add tooltip / popup to these labels which show additional details of the item that the label represents. I have some rough idea how I might be able to do this, but I'm asking here first if someone has already done this or something similar and wants to share the knowledge.
http://react.semantic-ui.com/modules/dropdown/
currently I have this code:
renderLabel = (label) => {
return({
color: 'teal',
content: `${label.value}`,
icon: 'user'
})}
and it looks like:
I imagine I would need to do something like:
renderLabel = (label) => {
return({
color: 'teal',
content: `${label.value}`,
icon: 'user'
description: 'this is tooltip text...'
})}
and make an oldschool css tooltip of the description prop, something like:
[description] {position: -ms-device-fixed;}
[description]:before {
content:'';
/* hides the tooltip when not hovered */
display:none;
content:'';
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid #fff;
position:absolute;
top:30px;
left:35px;
z-index: 2;
font-size:0;
line-height:0;
width: .71428571em;
height: .71428571em;}
[description]:after {
display:none;
content:attr(description);
position:absolute;
top:35px;
left:0px;
padding:5px 10px;
background: #fff;
color: rgba(0,0,0,.87);
z-index:9;
font-size: 14px;
line-height: 1.4285em;
white-space:nowrap;
word-wrap:normal;
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;}
[description]:hover:before,[description]:hover:after {
display:block;}
but this is unpractical and hard coded, sematic-ui has popup module already in it, but I can't figure how to implement that here.

Answer 1

renderLabel={(a, b, c) => {
return (
<Popup
content={<div>Whatever i want here</div>}
eventsEnabled={true}
on="click"
onClose={() => setOpen(false)}
onOpen={() => setOpen(true)}
open={open}
trigger={<Label content={a.text} {...c} />}
/>
);
}}
You will need to improve setOpen method to just open the popop you want to be opened, maybe passing some id