fix(linear-progress): fix progress track not changing dir in rtl (#15185)

Author: didimmova

projects/igniteui-angular/src/lib/core/styles/components/progress/_progress-theme.scss

@@ -153,13 +153,6 @@
         } @else if $variant == 'fluent' {
             gap: rem(2px);
         }
-
-        &[dir='rtl'],
-        [dir='rtl'] & {
-            %linear-bar {
-                transform: rotateY(180deg);
-            }
-        }
     }
 
     %linear-bar {
@@ -225,6 +218,13 @@
         &::after {
             animation: indeterminate-primary-scale 2000ms infinite linear;
         }
+
+        [dir="rtl"] & {
+            animation: indeterminate-primary-rtl 2000ms infinite linear;
+            left: auto;
+            right: -145.166611%;
+            transform-origin: top right;
+        }
     }
 
     %linear-indicator--indeterminate-secondary {
@@ -236,6 +236,13 @@
             width: 100%;
             height: inherit;
         }
+
+        [dir="rtl"] & {
+            animation: indeterminate-secondary-rtl 2000ms infinite linear;
+            left: auto;
+            right: -54.888891%;
+            transform-origin: top right;
+        }
     }
 
     %linear-indicator--default {
@@ -317,6 +324,26 @@
         }
     }
 
+    @keyframes indeterminate-primary-rtl {
+        0% {
+          transform: translateX(0);
+        }
+
+        20% {
+          animation-timing-function: $indeterminate-primary-translate-step-2;
+          transform: translateX(0);
+        }
+
+        59.15% {
+          animation-timing-function: $indeterminate-primary-translate-step-3;
+          transform: translateX(-83.67142%);
+        }
+
+        100% {
+          transform: translateX(-200.611057%);
+        }
+    }
+
     @keyframes indeterminate-primary-scale {
         0% {
             transform: scaleX(.08);
@@ -359,6 +386,27 @@
         }
     }
 
+    @keyframes indeterminate-secondary-rtl {
+        0% {
+          animation-timing-function: $indeterminate-secondary-translate-step-1;
+          transform: translateX(0);
+        }
+
+        25% {
+          animation-timing-function: $indeterminate-secondary-translate-step-2;
+          transform: translateX(-37.651913%);
+        }
+
+        48.35% {
+          animation-timing-function: $indeterminate-secondary-translate-step-3;
+          transform: translateX(-84.386165%);
+        }
+
+        100% {
+          transform: translateX(-160.277782%);
+        }
+    }
+
     @keyframes indeterminate-secondary-scale {
         0% {
             animation-timing-function: $indeterminate-secondary-scale-step-1;