cheminfo / nmrium

React component to display and process nuclear magnetic resonance (NMR) spectra.
https://docs.nmrium.org
MIT License
55 stars 25 forks source link

Step by step userguide - contextual help #1803

Open lpatiny opened 1 year ago

lpatiny commented 1 year ago

@targos What do you think about https://github.com/gilbarbara/react-joyride in order to make a step by step first opening userguide ?

targos commented 1 year ago

I don't know. Never used anything like that.

lpatiny commented 1 year ago

@hamed-musallam could you just evaluate the complexity to add it in NMRium to test ?

hamed-musallam commented 1 year ago

@lpatiny

unfortunately, this package in the current implementation will not work because of Shadow Root that we use in NMRium

lpatiny commented 1 year ago

Can you publish the branch in which you tried so that we can have a look ?

Do you know why Shadow Root prevents it to work ?

If we identify a limitation and a solution you could open an issue in their repo.

Otherwise can you evaluate possible alternatives ?

hamed-musallam commented 1 year ago

@lpatiny

this is a simple example, we use the Joyride with shadow root

https://codesandbox.io/s/joyride-with-shadow-root-4e4dh2?file=/src/App.js

they use docuemnt.querySelector to select the element which will not work if the element is behind the shadow root

https://github.com/gilbarbara/react-joyride/blob/88853fea5d5940ae5e71dc81681406102dceef50/src/modules/dom.js#L48-L55

lpatiny commented 1 year ago

@hamed-musallam The methods allows to give directly an element rather than the name of an element. In the JSON don't you have the possibility once NMRium is rendered to put the elements instead of the names ?