Support for embedding i18n-editor in other Vue apps

[nwittwer]

Hi, this project looks awesome!

Was wondering if it's currently possible—or a goal of the project—to be able to embed this entire editor within another Vue app? i.e. npm install @dasmikko/i18n-editor?

I would be interested in a Figma Plugin context, using this editor as a Vue component and passing translation files to it and then saving the resulting translation data back into a Figma frame essentially. If the component usage is already possible, is there documentation on the props and setup methods for people who want to use this as a library component?

[dasmikko]

Hi! Thanks for the feedback, it's always appreciated! :)

It's actually not a bad idea. I will make the editor into a library, that's you can use via a NPM package.

I'll do my best to write some proper documentation for when, once i've made it.

[nwittwer]

@dasmikko That would be awesome! Even some simple documentation would be fine to start, like how to install it, how to set it up in another Vue app, and basic methods & props to interact with. Could you maybe update this Github Issue when that is usable?

P.S. have you considered using TypeScript for the project? It might make the technical documentation easier later, help spot errors early, and be more appealing for contributors. I could try making a PR to simply setup TypeScript if that would help?

[dasmikko]

I will update this github issue when it's ready. No ETA's as i'm pretty busy with other stuff atm.

I'm not so sure about the typescript stuff, as I'm not a fan of it, and don't have much experience writing it. Feel free to make an example.

[nwittwer]

No worries, totally understand.

If I get some time I'll try to create a example of how the TypeScript version could look. I was also quite hesitant about TS a year ago, but what's great is you can slowly opt-in to its features. At first it's basically about just changing the .js files to .ts, and already you get a lot of nice stuff out-of-the-box if you're using VS Code, such as error highlighting if a local file is missing or your JS code has issues. Then later you can document the library/Vue component API with interfaces and then VS Code will show end-users autocomplete when they're implementing your library (more info).