merge

Author: cal-smith

src/combobox/combobox.component.ts

@@ -37,7 +37,8 @@ import { NG_VALUE_ACCESSOR } from "@angular/forms";
 			tabindex="0"
 			type="button"
 			aria-label="close menu"
-			aria-haspopup="true">
+			aria-haspopup="true"
+			(click)="toggleDropdown()">
 			<div
 				*ngIf="type === 'multi' && pills.length > 0"
 				(click)="clearSelected()"
@@ -60,7 +61,6 @@ import { NG_VALUE_ACCESSOR } from "@angular/forms";
 			</div>
 			<input
 				[disabled]="disabled"
-				(click)="toggleDropdown()"
 				(keyup)="onSearch($event.target.value)"
 				[value]="selectedValue"
 				class="bx--text-input"
@@ -248,7 +248,7 @@ export class ComboBox implements OnChanges, OnInit, AfterViewInit, AfterContentI
 						this.selectedValue = "";
 						this.propagateChangeCallback(null);
 					}
-					// not gaurding these since the nativeElement has to be loaded
+					// not guarding these since the nativeElement has to be loaded
 					// for select to even fire
 					this.elementRef.nativeElement.querySelector("input").focus();
 					this.closeDropdown();
@@ -286,12 +286,15 @@ export class ComboBox implements OnChanges, OnInit, AfterViewInit, AfterContentI
 	hostkeys(ev: KeyboardEvent) {
 		if (ev.key === "Escape") {
 			this.closeDropdown();
-		} else if (ev.key === "ArrowDown" && !this.dropdownMenu.nativeElement.contains(ev.target)) {
+		} else if ((ev.key === "ArrowDown" || ev.key === "Down") // `"Down"` is IE specific value
+			&& (!this.dropdownMenu || !this.dropdownMenu.nativeElement.contains(ev.target))) {
 			ev.stopPropagation();
 			this.openDropdown();
 			setTimeout(() => this.view.getCurrentElement().focus(), 0);
-		} else if (ev.key === "ArrowUp" && this.dropdownMenu.nativeElement.contains(ev.target) && !this.view.hasPrevElement()) {
-			this.elementRef.nativeElement.querySelector(".combobox_input").focus();
+		} else if ((ev.key === "ArrowUp" || ev.key === "Up") // `"Up"` is IE specific value
+			&& this.dropdownMenu.nativeElement.contains(ev.target)
+			&& !this.view.hasPrevElement()) {
+			this.elementRef.nativeElement.querySelector(".bx--text-input").focus();
 		}
 	}
 

src/tiles/clickable-tile.component.ts

@@ -30,6 +30,7 @@ import {
 		(click)="onClick($event)"
 		(keydown)="onKeyDown($event)"
 		[href]="href"
+		[target]="target"
 		[attr.aria-disabled]="disabled">
 		<ng-content></ng-content>
 	</a>`
@@ -42,6 +43,13 @@ export class ClickableTile {
 	 */
 	@Input() href: string;
 
+	/**
+	 * Sets the `target` attribute on the `ibm-clickable-tile` element.
+	 * @type {string}
+	 * @memberof ClickableTile
+	 */
+	@Input() target: string;
+
 	/**
 	 * Set to `true` to disable the clickable tile.
 	 * @type {boolean}

src/tiles/tiles.stories.ts

@@ -36,8 +36,8 @@ storiesOf("Tiles", module)
 	}))
 	.add("Clickable", () => ({
 		template: `
-		<ibm-clickable-tile href="#">
-			clickable tile content goes here...
+		<ibm-clickable-tile href="https://www.carbondesignsystem.com/" target="_blank">
+			Click the tile to open the Carbon Design System
 		</ibm-clickable-tile>
 		`
 	}));