AykutSarac / jsoncrack-vscode

VS Code extension of JSON Crack. Convert your JSON files into graphs with a single click and view them onto graphs.
https://marketplace.visualstudio.com/items?itemName=AykutSarac.jsoncrack-vscode
MIT License
445 stars 49 forks source link

Embedding in external website #21

Closed Andrewknackstedt closed 1 year ago

Andrewknackstedt commented 1 year ago

Feature

I'm the developer of a website that uses Monaco editor, and I would like to display side-by-side the editor and JSON crack for some JSON configuration data in a few scenarios. I know I can accomplish this through hacking into the codebase, but I saw some threads that an embed mechanism is in the works.

Are there plans on creating an angular component or some binding so it can be nearly natively used in an Angular app?

Would also want to fully host the assets since we don't want to depend on CDNs that we don't manage.

Alternative solutions or implementations

If it's not possible to create a native Angular component that can be released, can you create a window:onmessage interface for most events so we can create event-based bindings to load and view the code?

Other context

This particular website uses only Angular. Ideally we would prefer to use a native component, but we can support using other frameworks via loading them in special encapsulated iframes.

I'm willing to write an Angular wrapper if using window messages is the only way to do this, and can publish it for the community.

Andrewknackstedt commented 1 year ago

I'm willing to help, but I'm pretty useless when it comes to React so I wouldn't be of much use on react-specific things ;)

AykutSarac commented 1 year ago

Hello, currently using embeds is the only way to achieve this, there is no javascript library to do this for now. https://jsoncrack.com/docs

AykutSarac commented 1 year ago

I hope embeds at the JSON Crack's docs worked for you, there will be React component too in upcoming months.