Merged PR 225: Implement translations

Implement translations with useContext in React
+Add events to allow changing the language in the app
+Refactor AppEvents
+Redesign vertical bars in elements

public/smartcomponent/svg-layout-designer.ts

@@ -5,6 +5,7 @@
     type IHistoryState = SVGLD.IHistoryState;
     type IEditorState = SVGLD.IEditorState;
     type IConfiguration = SVGLD.IConfiguration;
+    type ILanguage = SVGLD.ILanguage;
 
     export class SVGLayoutDesigner extends Components.ComponentBase {
 
@@ -210,6 +211,43 @@
             const component = this.GetAppComponent();
             component.dispatchEvent(new CustomEvent(eventType, { detail: configuration }));
         }
+
+        /**
+         * Add a language to the app
+         * @param option Displayed string of the language
+         * @param language Language containing an id and a dictionary
+         * @param callback Callback
+         */
+        public AddLanguage(option: string, language: ILanguage, callback?: () => void) {
+            const eventType = 'addLanguage';
+            this.app.AddEventListener(eventType, callback);
+            const component = this.GetAppComponent();
+            component.dispatchEvent(new CustomEvent(eventType, { detail: { language, option } }));
+        }
+
+        /**
+         * Set the language of the app (defaults: ['fr', 'en'])
+         * @param languageId Language identifier for the language to select
+         * @param callback Callback
+         */
+        public SetLanguage(languageId: string, callback?: (success: boolean) => void) {
+            const eventType = 'setLanguage';
+            this.app.AddEventListener(eventType, callback);
+            const component = this.GetAppComponent();
+            component.dispatchEvent(new CustomEvent(eventType, { detail: languageId }));
+        }
+
+         /**
+         * Set the language of the app (defaults: ['fr', 'en'])
+         * @param languageId Language identifier for the language to select
+         * @param callback Callback
+         */
+        public GetLanguages(callback: (languages: Record<string, Record<string, string>>) => void) {
+            const eventType = 'getLanguages';
+            this.app.AddEventListener(eventType, callback);
+            const component = this.GetAppComponent();
+            component.dispatchEvent(new CustomEvent(eventType));
+        }
     }