From e513ea36330c5222855130c8e3e6827901837f31 Mon Sep 17 00:00:00 2001
From: Siriwat K <siriwatkunaporn@gmail.com>
Date: Fri, 13 Sep 2024 17:27:02 +0700
Subject: [PATCH] [Skeleton] Fix wave animation for styled-components (#43740)

---
 packages/mui-material/src/Skeleton/Skeleton.js | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/mui-material/src/Skeleton/Skeleton.js b/packages/mui-material/src/Skeleton/Skeleton.js
index 3f62bfb5fc1fbf..8a54e7307bc1bd 100644
--- a/packages/mui-material/src/Skeleton/Skeleton.js
+++ b/packages/mui-material/src/Skeleton/Skeleton.js
@@ -68,7 +68,9 @@ const pulseAnimation =
 const waveAnimation =
   typeof waveKeyframe !== 'string'
     ? css`
-        animation: ${waveKeyframe} 2s linear 0.5s infinite;
+        &::after {
+          animation: ${waveKeyframe} 2s linear 0.5s infinite;
+        }
       `
     : null;
 
@@ -192,8 +194,8 @@ const SkeletonRoot = styled('span', {
           props: {
             animation: 'wave',
           },
-          style: {
-            '&::after': waveAnimation || {
+          style: waveAnimation || {
+            '&::after': {
               animation: `${waveKeyframe} 2s linear 0.5s infinite`,
             },
           },