feat: focus a specific path

[jeremysf]

First off, thank you so much for this project!

I'm trying to use it to implement a real-time debugger for our graphical editor which can convert the graphical data being edited to JSON.

Somewhat related to #326, I'd like to be able to specify a path (similar string|number format to the onChange() function) that will cause the viewer to expand objects and scroll to focus the path.

I want to use this to be able to do a custom search inside the JSON and tell the json-viewer to jump to the location, but I also want to be able to interact with our graphical data and jump the json-viewer to correlate to the graphical element. Somewhat like "inspect element" in the Webkit Inspector.

Happy to do the work, but would love any pointers/ideas for the best way to approach such a patch.

[pionxzh]

Hi, thanks for using json-viewer.

I think we will need an API to control the collapse/expansion of a field programmatically to achieve this. #326 describes a need to pre-define a rule to control the expansion. I need time to think about how to support both use cases. And for the "jumping to", it's a little bit tricky, to be honest. The viewer itself shouldn't provide APIs to "scroll", the cleanest approach will be provides enough information on the DOM structure for people to construct the selector. So that you can do things like

setExpansion(path, true)
setTimeout(()=> {
  scrollToElement(selector)
}, 0)

For the interaction part, could you elaborate more? You should be able to customize the appearance of graphical data already.

[jeremysf]

Thank you so much for the speedy reply!

What you describe would be awesome.

As for the interaction, I was being unclear. The setExpansion() type API and ability to construct a selector you describe would cover everything I want to be able to do.