Loading haxcellence..

We've created a way to internationalize ANY web component you create. Because this is a complex topic, and we seek to empower anyone, anywhere to work with web components; i18n is a critical piece of accessibility and improving knowledge access on the web. Doing so without requiring a framework driven approach, or even knowing how our element will be used in production, is a complicated series of decisions.

I18NMixin

• Install the mixin: npm install @haxtheweb/i18n-manager
• create a folder in your element called /locales
• create a file called my-element.es.json for the spanish translation of your element. Japanese would be my-element.ja.json for example.

This invokes a dependency on our manager which you might not want to have in your element. If you want to do a similar approach but without dependencies, you just have to feed a custom event to our manager. You'll still have to use the convention for translatable text, but here's how you can invoke the event needed

Using the vanilla approach, you'll still need to have a /locales directory and the same naming convention. Our mixin just simplifies the integration a bit as well as the timing of what it's initiated but this event registration method will still work within any element that's going to arrive in HAX/HAXcms or any property you make that isn't using HAX at all.