feat(toggle): Add translations to toggle states

Author: youda97

src/i18n/en.json

@@ -123,6 +123,10 @@
 		"BUTTON_ARIA_LEFT": "Go to the previous tab",
 		"BUTTON_ARIA_RIGHT": "Go to the next tab"
 	},
+	"TOGGLE": {
+		"LEFTTEXT": "Off",
+		"RIGHTTEXT": "On"
+	},
 	"TOPNAV": {
 		"SKIP_TO_MAIN": "Skip to main content",
 		"HAMBURGER": {

src/toggle/toggle.component.ts

@@ -8,6 +8,7 @@ import {
 } from "@angular/core";
 import { NG_VALUE_ACCESSOR } from "@angular/forms";
 
+import { I18n } from "../i18n/i18n.module";
 
 /**
  * Defines the set of states for a toggle component.
@@ -76,9 +77,9 @@ export class ToggleChange {
 			[ngClass]="{
 				'bx--skeleton': skeleton
 			}">
-			<span class="bx--toggle__text--left">{{ !skeleton ? "Off" : null }}</span>
+			<span class="bx--toggle__text--left">{{!skeleton ? leftText : null}}</span>
 			<span class="bx--toggle__appearance"></span>
-			<span class="bx--toggle__text--right">{{ !skeleton ? "On" : null }}</span>
+			<span class="bx--toggle__text--right">{{!skeleton ? rightText : null}}</span>
 		</label>
 
 		<label
@@ -112,6 +113,18 @@ export class Toggle extends Checkbox {
 	 */
 	static toggleCount = 0;
 
+	/**
+	 * Text that is set on the left side of the toggle.
+	 * @type {(string)}
+	 * @memberof Toggle
+	 */
+	@Input() leftText = this.i18n.get().TOGGLE.LEFTTEXT;
+	/**
+	 * Text that is set on the right side of the toggle.
+	 * @type {(string)}
+	 * @memberof Toggle
+	 */
+	@Input() rightText = this.i18n.get().TOGGLE.RIGHTTEXT;
 	/**
 	 * Size of the toggle component.
 	 * @type {("sm" | "md" | "default")}
@@ -143,7 +156,7 @@ export class Toggle extends Checkbox {
 	 * @param {ChangeDetectorRef} changeDetectorRef
 	 * @memberof Toggle
 	 */
-	constructor(protected changeDetectorRef: ChangeDetectorRef) {
+	constructor(protected changeDetectorRef: ChangeDetectorRef, protected i18n: I18n) {
 		super(changeDetectorRef);
 		Toggle.toggleCount++;
 	}

src/toggle/toggle.module.ts

@@ -4,6 +4,7 @@ import { FormsModule } from "@angular/forms";
 import { CommonModule } from "@angular/common";
 
 // imports
+import { I18nModule } from "../i18n/i18n.module";
 import { Toggle } from "../toggle/toggle.component";
 
 // exports
@@ -18,7 +19,8 @@ export { Toggle } from "../toggle/toggle.component";
 	],
 	imports: [
 		CommonModule,
-		FormsModule
+		FormsModule,
+		I18nModule
 	]
 })
 export class ToggleModule { }