issue #163: light input review feedback

Author: panpan-lin

src/input/input.directive.ts

@@ -15,6 +15,13 @@ import { Directive, HostBinding, Input } from "@angular/core";
 	selector: "[ibmText]"
 })
 export class TextInput {
+	/**
+	 * `light` or `dark` input theme
+	 */
+	@Input() theme: "light" | "dark" = "dark";
+
 	@HostBinding("class.bx--text-input") inputClass = true;
-	@HostBinding("class.bx--text-input--light") @Input() light = false;
+	@HostBinding("class.bx--text-input--light") get isLightTheme() {
+		return this.theme === "light";
+	}
 }

src/input/input.stories.ts

@@ -25,7 +25,7 @@ storiesOf("Input", module).addDecorator(
 	}))
 	.add("Light Input", () => ({
 		template: `
-			<input ibmText [light]="true" aria-label="input" placeholder="Optional placeholder text"/>
+			<input ibmText [theme]="'light'" aria-label="input" placeholder="Optional placeholder text"/>
 		`
 	}))
 	.add("TextArea", () => ({
@@ -35,6 +35,6 @@ storiesOf("Input", module).addDecorator(
 	}))
 	.add("Light TextArea", () => ({
 		template: `
-		<textarea ibmTextArea [light]="true" aria-label="textarea" placeholder="Optional placeholder text" rows="4" cols="50"></textarea>
+		<textarea ibmTextArea [theme]="'light'" aria-label="textarea" placeholder="Optional placeholder text" rows="4" cols="50"></textarea>
 		`
 	}));

src/input/text-area.directive.ts

@@ -15,6 +15,13 @@ import { Directive, HostBinding, Input } from "@angular/core";
 	selector: "[ibmTextArea]"
 })
 export class TextArea {
+	/**
+	 * `light` or `dark` input theme
+	 */
+	@Input() theme: "light" | "dark" = "dark";
+
 	@HostBinding("class.bx--text-area") baseClass = true;
-	@HostBinding("class.bx--text-area--light") @Input() light = false;
+	@HostBinding("class.bx--text-area--light") get isLightTheme() {
+		return this.theme === "light";
+	}
 }