https://codesandbox.io/s/romantic-shaw-p1thp?file=/src/InteractiveImage/InteractiveImage.js

Здравствуйте! Помогите плиз реализовать задачу. Допустим с сервера приходят svg , у которых все path-ы содержат аттрибут data-name. С этим аттрибутом планируются дальнейшие манипулции. На все path, которые содержат аттрибут data-name, должна быть повешана всплывающая подсказка библиотеки tippy.js . Я так понял реактовскую либу @tippyjs/react в данном случае не применить для path, так как они приходят с сервера в виде html. Но если засовывать в content компонент, то выдаёт [object Object]. Прошу помощи!

Передавай content: TippyContent

это ванильная джс либа, она не сможет отрендерить компонент реакта)

TippyContent д.б. компонентом реакта

можешь передать туда пустую дивку и отрендерить в нее через ReactDOM как вариант))

если речь идет именно о ванильном JS варианте

Я так и сделал 😂 но думаю что это не реакт вэй хех

В процессе разработки проекта мне много такого придется делать походу

можешь циклом пробежаться по path, отрендерить tippy/react и внутри него через innerHTML отрендерить сами свгшки

как вариант

имею ввиду через аттрибут dangerouslySetInnerHTML

Вот это немного не понял расскажи плиз подробнее

ну смотри, я полностью задачу твою не изучил, но тебе с сервера прилетает свг, внутри которых есть path, которые нужно отрендерить внутри подсказок tippyjs, так?

Значит ты можешь сделать что-то такое:

типа бить верстку в свг на массив path, потом циклом просто рендерить эти path внутри свг, но заворачивать каждый path в тултип (надеюсь оно не генерит никакую верстку, ломающую svg)

либо вообще брать контент и аттрибуты path, рендерить path, внутрь него через dangsetinnerhtml вставлять верстку, а аттрибуты спредить на этот path

чтобы лишних элементов не появлялось (ну кроме элемментов типпи, если они есть)

мне прилетают целые свг, а не чисто их path, кроме того атрибутами data-name могут обладать слои тоже, а не только path)

Я подразумевал ручной парсинг и разбивку свг на элементы

Да проще тогда реакт дом рендер сделать и все, хоть у тебя и будет создаваться новый виртуальный дом на каждый микроэлементик, насколько ч понимаю