diff --git a/src/stories/buttongroup.stories.js b/src/stories/buttongroup.stories.js
index 9ebb7a4d..41fe19fe 100644
--- a/src/stories/buttongroup.stories.js
+++ b/src/stories/buttongroup.stories.js
@@ -8,32 +8,32 @@ export default {
 };
 
 export const Basic = () => html`
-  <cod-button-group data-type="group" data-label="basic example">
+  <cod-button-group data-type="group" label="basic example">
     <div class="no-wc btn-group" role="group" aria-label="Basic example">
       <button type="button" class="btn btn-primary">Left</button>
       <button type="button" class="btn btn-primary">Middle</button>
       <button type="button" class="btn btn-primary">Right</button>
     </div>
     <cod-button
-      data-label="Left"
-      data-background-color="primary"
-      data-primary="true"
-      data-img-alt=""
-      data-icon=""
+      label="Left"
+      background-color="primary"
+      primary="true"
+      img-alt=""
+      icon=""
     ></cod-button>
     <cod-button
-      data-label="Middle"
-      data-background-color="primary"
-      data-primary="true"
-      data-img-alt=""
-      data-icon=""
+      label="Middle"
+      background-color="primary"
+      primary="true"
+      img-alt=""
+      icon=""
     ></cod-button>
     <cod-button
-      data-label="Right"
-      data-background-color="primary"
-      data-primary="true"
-      data-img-alt=""
-      data-icon=""
+      label="Right"
+      background-color="primary"
+      primary="true"
+      img-alt=""
+      icon=""
     ></cod-button>
   </cod-button-group>
 `;