From aa33fa0c5f7daea3275963b5e8061cd0c008e780 Mon Sep 17 00:00:00 2001
From: Anna Wen <54281166+annawen1@users.noreply.github.com>
Date: Tue, 28 Jan 2020 12:39:59 -0500
Subject: [PATCH] feat(progress-indicator): update to use carbon icons (#5122)

* feat(progress-indicator): update to use carbon icons

* fix(progress-indicator): remove top margin from icon

Co-authored-by: TJ Egan <tw15egan@gmail.com>
Co-authored-by: Abbey Hart <abbeyhrt@gmail.com>
---
 packages/components/docs/sass.md                |  7 +++++--
 .../progress-indicator/_progress-indicator.scss |  8 +++++---
 .../ProgressIndicator/ProgressIndicator.js      | 17 ++++++++++-------
 3 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/packages/components/docs/sass.md b/packages/components/docs/sass.md
index 2dc80deaf1f6..6a0d04f2f22e 100644
--- a/packages/components/docs/sass.md
+++ b/packages/components/docs/sass.md
@@ -20476,10 +20476,13 @@ Progress indicator styles
   }
 
   .#{$prefix}--progress-step--current svg {
-    width: 14px;
-    height: 14px;
+    stroke: $interactive-01;
     fill: $interactive-01;
     margin-top: rem(9.5px);
+
+    path:last-of-type {
+      stroke-width: 40%;
+    }
   }
 
   //INCOMPLETE STYLING
diff --git a/packages/components/src/components/progress-indicator/_progress-indicator.scss b/packages/components/src/components/progress-indicator/_progress-indicator.scss
index e461c30eb2c7..7b8305024fc9 100644
--- a/packages/components/src/components/progress-indicator/_progress-indicator.scss
+++ b/packages/components/src/components/progress-indicator/_progress-indicator.scss
@@ -143,10 +143,12 @@
   }
 
   .#{$prefix}--progress-step--current svg {
-    width: 14px;
-    height: 14px;
+    stroke: $interactive-01;
     fill: $interactive-01;
-    margin-top: rem(9.5px);
+
+    path:last-of-type {
+      stroke-width: 40%;
+    }
   }
 
   //INCOMPLETE STYLING
diff --git a/packages/react/src/components/ProgressIndicator/ProgressIndicator.js b/packages/react/src/components/ProgressIndicator/ProgressIndicator.js
index 6ec5ee36afd8..f974a8d50c6d 100644
--- a/packages/react/src/components/ProgressIndicator/ProgressIndicator.js
+++ b/packages/react/src/components/ProgressIndicator/ProgressIndicator.js
@@ -9,7 +9,12 @@ import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import classnames from 'classnames';
 import { settings } from 'carbon-components';
-import { CheckmarkOutline16, Warning16 } from '@carbon/icons-react';
+import {
+  CheckmarkOutline16,
+  Warning16,
+  RadioButtonChecked16,
+  RadioButton16,
+} from '@carbon/icons-react';
 import { keys, matches } from '../../internal/keyboard';
 
 const { prefix } = settings;
@@ -61,10 +66,9 @@ export function ProgressStep({
     }
     if (current) {
       return (
-        <svg>
-          <path d="M 7, 7 m -7, 0 a 7,7 0 1,0 14,0 a 7,7 0 1,0 -14,0" />
+        <RadioButtonChecked16>
           <title>{description}</title>
-        </svg>
+        </RadioButtonChecked16>
       );
     }
     if (complete) {
@@ -75,10 +79,9 @@ export function ProgressStep({
       );
     }
     return (
-      <svg>
+      <RadioButton16>
         <title>{description}</title>
-        <path d="M8 1C4.1 1 1 4.1 1 8s3.1 7 7 7 7-3.1 7-7-3.1-7-7-7zm0 13c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6z" />
-      </svg>
+      </RadioButton16>
     );
   };