Merge branch 'master' of github.com:cal-smith/carbon-components-angular

Author: cal-smith

package-lock.json

@@ -13,12 +13,16 @@
     "test:watch": "karma start --auto-watch --no-single-run",
     "utils:add": "git subtree add --prefix=src/utils [email protected]:peretz/utils.git master --squash",
     "utils:update": "git subtree pull --prefix=src/utils [email protected]:peretz/utils.git master --squash",
-    "prepush": "bash scripts/prepush.sh",
     "build-storybook": "build-storybook -c .storybook -s .storybook/public -o dist/docs/storybook",
     "semantic-release": "semantic-release",
-    "commitmsg": "commitlint -E GIT_PARAMS",
     "commit": "git-cz"
   },
+  "husky": {
+    "hooks": {
+      "pre-push": "bash scripts/prepush.sh",
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+    }
+  },
   "release": {
     "pkgRoot": "dist"
   },
@@ -80,7 +84,7 @@
     "@angular/router": "6.1.0",
     "@commitlint/cli": "7.0.0",
     "@commitlint/config-conventional": "7.0.1",
-    "@compodoc/compodoc": "^1.1.5",
+    "@compodoc/compodoc": "1.1.5",
     "@storybook/addon-actions": "3.4.8",
     "@storybook/addon-knobs": "3.4.8",
     "@storybook/addon-links": "3.4.8",
@@ -106,7 +110,7 @@
     "gulp-tap": "1.0.1",
     "html-loader": "0.5.5",
     "html-webpack-plugin": "3.2.0",
-    "husky": "0.14.3",
+    "husky": "1.1.2",
     "jasmine-core": "3.1.0",
     "karma": "2.0.2",
     "karma-chrome-launcher": "2.2.0",
@@ -118,7 +122,7 @@
     "karma-sourcemap-loader": "0.3.7",
     "karma-spec-reporter": "0.0.32",
     "karma-webpack": "3.0.0",
-    "node-sass": "^4.9.3",
+    "node-sass": "4.9.3",
     "postcss-loader": "2.1.4",
     "raw-loader": "0.5.1",
     "run-sequence": "2.2.0",

package.json

@@ -67,7 +67,7 @@ import { NG_VALUE_ACCESSOR } from "@angular/forms";
 				class="bx--text-input"
 				aria-label="ListBox input field"
 				autocomplete="off"
-				placeholder="Filter..."/>
+				[placeholder]="placeholder"/>
 			<div
 				[ngClass]="{'bx--list-box__menu-icon--open': open}"
 				class="bx--list-box__menu-icon">
@@ -132,7 +132,7 @@ export class ComboBox implements OnChanges, OnInit, AfterViewInit, AfterContentI
 	 * Text to show when nothing is selected.
 	 * @memberof ComboBox
 	 */
-	@Input() placeholder = "";
+	@Input() placeholder = "Filter...";
 	/**
 	 * Combo box type (supporting single or multi selection of items).
 	 * @type {("single" | "multi")}
@@ -351,6 +351,9 @@ export class ComboBox implements OnChanges, OnInit, AfterViewInit, AfterContentI
 		});
 		this.view["updateList"](this.items);
 		this.updatePills();
+		// clearSelected can only fire on type=multi
+		// so we just emit getSelected() (just in case there's any disabled but selected items)
+		this.selected.emit(this.view.getSelected() as any);
 	}
 
 	/**

src/combobox/combobox.component.ts

@@ -16,7 +16,7 @@ storiesOf("Combobox", module)
 	.addDecorator(withKnobs)
 	.add("Basic", () => ({
 		template: `
-			<ibm-combo-box [items]="items">
+			<ibm-combo-box [items]="items" (selected)="selected($event)">
 				<ibm-dropdown-list></ibm-dropdown-list>
 			</ibm-combo-box>
 		`,
@@ -40,7 +40,7 @@ storiesOf("Combobox", module)
 	}))
 	.add("Multi-select", () => ({
 		template: `
-			<ibm-combo-box [items]="items" type="multi">
+			<ibm-combo-box [items]="items" type="multi" (selected)="selected($event)">
 				<ibm-dropdown-list></ibm-dropdown-list>
 			</ibm-combo-box>
 		`,

src/combobox/combobox.stories.ts

@@ -9,7 +9,8 @@ import {
 	TemplateRef,
 	ViewContainerRef,
 	HostListener,
-	OnChanges
+	OnChanges,
+	HostBinding
 } from "@angular/core";
 import { fromEvent } from "rxjs";
 import { DialogService } from "./dialog.service";
@@ -94,6 +95,9 @@ export class DialogDirective implements OnInit, OnDestroy, OnChanges {
 	@Output() onClose: EventEmitter<any> = new EventEmitter<any>();
 	dialogConfig: DialogConfig;
 
+	@HostBinding("attr.role") role = "button";
+	@HostBinding("attr.aria-expanded") expanded = false;
+
 	/**
 	 * Creates an instance of DialogDirective.
 	 * @param {ElementRef} elementRef
@@ -158,7 +162,7 @@ export class DialogDirective implements OnInit, OnDestroy, OnChanges {
 		this.dialogService.isClosed.subscribe(value => {
 			if (value) {
 				this.onClose.emit();
-				this.elementRef.nativeElement.setAttribute("aria-expanded", "false");
+				this.expanded = false;
 			}
 		});
 
@@ -182,7 +186,7 @@ export class DialogDirective implements OnInit, OnDestroy, OnChanges {
 	 */
 	open() {
 		this.dialogService.open(this.viewContainerRef, this.dialogConfig);
-		this.elementRef.nativeElement.setAttribute("aria-expanded", "true");
+		this.expanded = true;
 	}
 
 	/**
@@ -192,7 +196,7 @@ export class DialogDirective implements OnInit, OnDestroy, OnChanges {
 	 */
 	toggle() {
 		this.dialogService.toggle(this.viewContainerRef, this.dialogConfig);
-		this.elementRef.nativeElement.setAttribute("aria-expanded", this.dialogService.isOpen);
+		this.expanded = this.dialogService.isOpen;
 	}
 
 	/**
@@ -202,7 +206,7 @@ export class DialogDirective implements OnInit, OnDestroy, OnChanges {
 	 */
 	close() {
 		this.dialogService.close(this.viewContainerRef);
-		this.elementRef.nativeElement.setAttribute("aria-expanded", "false");
+		this.expanded = false;
 	}
 
 	/**

src/dialog/dialog.directive.ts

@@ -5,7 +5,8 @@ import {
 	ElementRef,
 	Injector,
 	ComponentFactoryResolver,
-	ViewContainerRef
+	ViewContainerRef,
+	HostBinding
 } from "@angular/core";
 import { DialogDirective } from "./../dialog.directive";
 import { Tooltip } from "./tooltip.component";
@@ -64,6 +65,8 @@ export class TooltipDirective extends DialogDirective {
 	// tslint:disable-next-line:no-input-rename
 	@Input("tooltip-type") tooltipType: "warning" | "error" | "" = "";
 
+	@HostBinding("attr.aria-describedby") descriptorId: string;
+
 	/**
 	 * Creates an instance of `TooltipDirective`.
 	 * @param {ElementRef} elementRef
@@ -89,6 +92,6 @@ export class TooltipDirective extends DialogDirective {
 		this.dialogConfig.compID = "tooltip-" + TooltipDirective.tooltipCounter;
 		this.dialogConfig.content = this.ibmTooltip;
 		this.dialogConfig.type = this.tooltipType !== undefined ? this.tooltipType : this.type;
-		this.elementRef.nativeElement.setAttribute("aria-describedby", this.dialogConfig.compID);
+		this.descriptorId = this.dialogConfig.compID;
 	}
 }

src/dialog/tooltip/tooltip.directive.ts

@@ -63,10 +63,10 @@
 			"RESET_SEARCH": "Reset search"
 		}
 	},
-	"MODAL" : {
+	"MODAL": {
 		"CLOSE": "Close modal"
 	},
-	"OVERFLOW_MENU" : {
+	"OVERFLOW_MENU": {
 		"OVERFLOW": "Overflow"
 	},
 	"SIDENAV": {

src/i18n/en.json

@@ -20,10 +20,10 @@ storiesOf("Input", module).addDecorator(
 	}))
 	.add("Input", () => ({
 		template: `
-			<input ibmText placeholder="Optional placeholder text"/>
+			<input ibmText aria-label="input" placeholder="Optional placeholder text"/>
 		`
 	})).add("TextArea", () => ({
 		template: `
-		<textarea ibmTextArea placeholder="Optional placeholder text" rows="4" cols="50"></textarea>
+		<textarea ibmTextArea aria-label="textarea" placeholder="Optional placeholder text" rows="4" cols="50"></textarea>
 		`
 	}));