Fix data attribute pattern for Card

vtex · Dec 30, 2021 · a32eb01 · a32eb01
1 parent ee233d0
commit a32eb01
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 22 deletions.
diff --git a/packages/ui/src/organisms/Card/Card.test.tsx b/packages/ui/src/organisms/Card/Card.test.tsx
@@ -47,16 +47,16 @@ describe('Card', () => {
       expect(card).toHaveAttribute('data-store-card')
     })
 
-    it('`CardContent` component should have `data-store-card-content` attribute', () => {
-      expect(cardContent).toHaveAttribute('data-store-card-content')
+    it('`CardContent` component should have `data-card-content` attribute', () => {
+      expect(cardContent).toHaveAttribute('data-card-content')
     })
 
-    it('`CardImage` component should have `data-store-card-image` attribute', () => {
-      expect(cardImage).toHaveAttribute('data-store-card-image')
+    it('`CardImage` component should have `data-card-image` attribute', () => {
+      expect(cardImage).toHaveAttribute('data-card-image')
     })
 
-    it('`CardActions` component should have `data-store-card-actions` attribute', () => {
-      expect(cardActions).toHaveAttribute('data-store-card-actions')
+    it('`CardActions` component should have `data-card-actions` attribute', () => {
+      expect(cardActions).toHaveAttribute('data-card-actions')
     })
   })
 

diff --git a/packages/ui/src/organisms/Card/CardActions.tsx b/packages/ui/src/organisms/Card/CardActions.tsx
@@ -14,12 +14,7 @@ const CardActions = forwardRef<HTMLDivElement, CardActionsProps>(
     ref
   ) {
     return (
-      <div
-        ref={ref}
-        data-store-card-actions
-        data-testid={testId}
-        {...otherProps}
-      >
+      <div ref={ref} data-card-actions data-testid={testId} {...otherProps}>
         {children}
       </div>
     )

diff --git a/packages/ui/src/organisms/Card/CardContent.tsx b/packages/ui/src/organisms/Card/CardContent.tsx
@@ -14,12 +14,7 @@ const CardContent = forwardRef<HTMLElement, CardContentProps>(
     ref
   ) {
     return (
-      <section
-        ref={ref}
-        data-store-card-content
-        data-testid={testId}
-        {...otherProps}
-      >
+      <section ref={ref} data-card-content data-testid={testId} {...otherProps}>
         {children}
       </section>
     )

diff --git a/packages/ui/src/organisms/Card/CardImage.tsx b/packages/ui/src/organisms/Card/CardImage.tsx
@@ -13,7 +13,7 @@ const CardImage = forwardRef<HTMLDivElement, CardImageProps>(function CardImage(
   ref
 ) {
   return (
-    <div ref={ref} data-store-card-image data-testid={testId} {...otherProps}>
+    <div ref={ref} data-card-image data-testid={testId} {...otherProps}>
       {children}
     </div>
   )

diff --git a/packages/ui/src/organisms/Card/stories/Card.mdx b/packages/ui/src/organisms/Card/stories/Card.mdx
@@ -45,10 +45,10 @@ All Card-related components support all attributes also supported by the `<div>`
 ```css
 [data-store-card] {
 }
-[data-store-card-image] {
+[data-card-image] {
 }
-[data-store-card-content] {
+[data-card-content] {
 }
-[data-store-card-actions] {
+[data-card-actions] {
 }
 ```