updtates naming conventions removing "data-" from attribute names

CityOfDetroit · May 22, 2024 · cbff73b · cbff73b
1 parent 5813842
commit cbff73b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/src/components/atoms/Spinner/Spinner.js b/src/components/atoms/Spinner/Spinner.js
@@ -22,13 +22,13 @@ export default class Image extends HTMLElement {
     this.shadowRoot.appendChild(spinnerStyles);
     // image attributes
 
-    const spinnerType = this.getAttribute('data-type');
+    const spinnerType = this.getAttribute('type');
 
-    const spinnerSize = this.getAttribute('data-size');
+    const spinnerSize = this.getAttribute('size');
 
-    const backgroundColor = this.getAttribute('data-background-color');
+    const backgroundColor = this.getAttribute('background-color');
 
-    const displayType = this.getAttribute('data-display-type');
+    const displayType = this.getAttribute('display-type');
     let spinnerSizeClass;
 
     // TODO: Fix old ESLint errors - see issue #1099

diff --git a/src/stories/spinner.stories.js b/src/stories/spinner.stories.js
@@ -20,10 +20,10 @@ export default {
 // Template
 const Template = (args) => {
   const spinner = document.createElement('cod-spinner');
-  spinner.setAttribute('data-type', args.type);
-  spinner.setAttribute('data-background-color', args.backgroundColor);
-  spinner.setAttribute('data-size', args.size);
-  spinner.setAttribute('data-display-type', args.displayType);
+  spinner.setAttribute('type', args.type);
+  spinner.setAttribute('background-color', args.backgroundColor);
+  spinner.setAttribute('size', args.size);
+  spinner.setAttribute('display-type', args.displayType);
   return spinner;
 };