Davidnixon feat progress events (#1222)

* feat: emit event on progress step click. update story book & update md * feat: add emit from cv-progress Co-authored-by: David Nixon <>
carbon-design-system · Jul 12, 2021 · 0e27a83 · 0e27a83
1 parent 6088957
commit 0e27a83
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 3 deletions.
diff --git a/packages/core/src/components/cv-progress/cv-progress-notes.md b/packages/core/src/components/cv-progress/cv-progress-notes.md
@@ -54,4 +54,4 @@ NOTE: steps is an array of strings declared elsewhere.
 
 ## Events
 
-Clicking on the steps raise step-cliked events.
+Clicking on the steps raise step-clicked events either directly from the step or from cv-progress if steps array used.
diff --git a/packages/core/src/components/cv-progress/cv-progress-step.vue b/packages/core/src/components/cv-progress/cv-progress-step.vue
@@ -18,7 +18,7 @@
       :class="[`${carbonPrefix}--progress-label`, { [`${carbonPrefix}--progress-label-overflow`]: showOverflow }]"
       @mouseenter="onMouseEnter"
       @mouseleave="onMouseLeave"
-      @click="$emit('step-clicked')"
+      @click="$emit('step-clicked', $event)"
       ref="label"
     >
       {{ label }}

diff --git a/packages/core/src/components/cv-progress/cv-progress.vue b/packages/core/src/components/cv-progress/cv-progress.vue
@@ -11,6 +11,7 @@
         :label="step"
         :complete="initialStep > index"
         ref="steps"
+        @step-clicked="$emit('step-clicked', $event)"
       />
     </slot>
   </ul>

diff --git a/storybook/stories/cv-progress-story.js b/storybook/stories/cv-progress-story.js
@@ -62,7 +62,7 @@ for (const story of storySet) {
 
       // ----------------------------------------------------------------
 
-      let templateString = `<cv-progress${settings.group.attr}>${settings.group.slots}</cv-progress>`;
+      let templateString = `<cv-progress${settings.group.attr} @step-clicked="actionStepClicked">${settings.group.slots}</cv-progress>`;
       // console.log(templateString);
       // ----------------------------------------------------------------
       const templateViewString = `
Original file line number	Diff line number	Diff line change
Expand Up		@@ -54,4 +54,4 @@ NOTE: steps is an array of strings declared elsewhere.

		## Events

		Clicking on the steps raise step-cliked events.
		Clicking on the steps raise step-clicked events either directly from the step or from cv-progress if steps array used.