tooltipContent | Text goes out of borders

[enkicoma]

Describe the bug A clear and concise description of what the bug is. Using tooltipContent and inserted a long note/text, the text goes out of the box-border.

To Reproduce Steps to reproduce the behavior: use .tooltipContent((d, node) => Notes: ${node.data.description} )(document.getElementById("chart")); node.data.description should return a long text.

Expected behavior A clear and concise description of what you expected to happen. If, I will play and do <br/> in the text - I see that the text can fulfil the tooltip height. This takes ages... I would prefer to have a hard stop on how many words I can use with tooltipContent or somehow to make the text automatically to take the shape of tooltipContent.

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: [e.g. iOS] MacOS
• Browser [e.g. chrome, safari] Chrome
• Version [e.g. 22] latest

Additional context Add any other context about the problem here. I found the css applied to tooltipContent, but not sure what do I need to change. Maybe we need to put the tooltipContent under a flex div? https://github.com/vasturiano/sunburst-chart/blob/0dc6d375440dbdc700a9c956cc4375fbe43336bf/src/sunburst.css#L40

[vasturiano]

@enkicoma you can just override the white-space to normal, in order to let it wrap in multiple lines.

[enkicoma]

@enkicoma you can just override the white-space to normal, in order to let it wrap in multiple lines. Hi @vasturiano, good point - but how and where to override

      Sunburst()
        .data(newObject) //data[data.length-1]
        .label("name")
        .size("available")
        .color("color")
        // .tooltipContent((d, node) => `Notes: <i>${node.data.description} </i>`)
        (document.getElementById("chart"));      
    } 

[vasturiano]

@enkicoma you can override it in the css of your app. Something along the lines of:

.sunburst-tooltip {
  white-space: normal !important;
}

[adelmemariani]

I guess it is .sunburst-viz .tooltip {..} instead of .sunburst-tooltip {...}