feat(progress-indicator): adds 'vertical' variant

fixes #384

Author: Andrew Nelson

package-lock.json

@@ -66,7 +66,7 @@
     "core-js": "^2.5.3",
     "rxjs": "^6.0.0",
     "zone.js": "^0.8.26",
-    "carbon-components": "^9.20.0"
+    "carbon-components": "^9.70.0"
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "0.7.1",
@@ -98,7 +98,7 @@
     "@types/node": "8.5.2",
     "angular2-template-loader": "0.6.2",
     "babel-loader": "8.0.4",
-    "carbon-components": "9.68.16",
+    "carbon-components": "^9.70.0",
     "codelyzer": "4.5.0",
     "commitizen": "2.10.1",
     "core-js": "2.5.5",

package.json

@@ -9,7 +9,8 @@ import { ExperimentalService } from "./../experimental.module";
 		data-progress-current
 		class="bx--progress"
 		[ngClass]="{
-			'bx--skeleton': skeleton
+			'bx--skeleton': skeleton,
+			'bx--progress--vertical': vertical
 		}">
 		<li
 		class="bx--progress-step bx--progress-step--{{step.state}}"
@@ -59,7 +60,7 @@ export class ProgressIndicator {
 	}
 
 	@Input() steps = [];
-
+	@Input() vertical = false;
 	@Input() skeleton = false;
 
 	get isExperimental() {

src/progress-indicator/progress-indicator.component.ts

@@ -82,4 +82,38 @@ storiesOf("ProgressIndicator", module)
 		<app-experimental-component></app-experimental-component>
 		<app-skeleton-progress-indicator></app-skeleton-progress-indicator>
 		`
+	}))
+	.add("Vertical", () => ({
+		template: `
+		<app-experimental-component></app-experimental-component>
+		<ibm-progress-indicator [vertical]="true" [steps]="steps"></ibm-progress-indicator>
+		`,
+		props: {
+			steps : [
+				{
+					text: "1. ONE",
+					state: ["complete"]
+				},
+				{
+					text: "2. TWO",
+					state: ["complete"]
+				},
+				{
+					text: "3. THREE",
+					state: ["current"]
+				},
+				{
+					text: "4. FOUR",
+					state: ["incomplete"]
+				},
+				{
+					text: "5. FIVE",
+					state: ["incomplete"]
+				},
+				{
+					text: "6. SIX",
+					state: ["incomplete"]
+				}
+			]
+		}
 	}));