From b942ef85bc7613474a347ba1d96f464936a44abf Mon Sep 17 00:00:00 2001
From: Jonathan Avila <javila@montecarlodata.com>
Date: Tue, 19 Sep 2023 23:10:39 -0400
Subject: [PATCH 1/2] Update dots loader component

Updated Loader component to match animation and style as close as possible to v6
---
 docs/yarn.lock                                |  8 +++---
 .../src/components/Loader/Loader.module.css   | 27 +++++--------------
 .../src/components/Loader/loaders/Dots.tsx    |  6 -----
 3 files changed, 10 insertions(+), 31 deletions(-)

diff --git a/docs/yarn.lock b/docs/yarn.lock
index 0fc82279e98..e8cfff0c964 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -133,10 +133,10 @@
   version "0.0.0"
   uid ""
 
-"@mantine/store@7.0.0-beta.5":
-  version "7.0.0-beta.5"
-  resolved "https://registry.yarnpkg.com/@mantine/store/-/store-7.0.0-beta.5.tgz#24d55bf2dc45e33e9005e131b2944bbf3d19c263"
-  integrity sha512-smKxfat+Gne95qaMivjUJbifIxp4/ptxVnSkyw6RD580aspexRQOIGRtX/OeMmS6Yz9D5beLkl6Q1C/8/RHNhg==
+"@mantine/store@7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/@mantine/store/-/store-7.0.0.tgz#5e57b8ec98531446a4afb2afdc02dd411bd8d379"
+  integrity sha512-MliHi9TUe7fTLIzj3LWYEoQPkm3TbkmCUNBdynFrx0Ls+WoyNjW73RhxbiZB2KfHXs/tsYySA6mjMoSgUhkQDw==
 
 "@mantine/store@link:../src/mantine-store":
   version "0.0.0"
diff --git a/src/mantine-core/src/components/Loader/Loader.module.css b/src/mantine-core/src/components/Loader/Loader.module.css
index b7771120ad9..b8440c9e57a 100644
--- a/src/mantine-core/src/components/Loader/Loader.module.css
+++ b/src/mantine-core/src/components/Loader/Loader.module.css
@@ -52,10 +52,12 @@
 @keyframes loader-dots-animation {
   0%,
   100% {
-    opacity: 1;
+    transform: scale(1);
+    opacity: 1;;
   }
 
   50% {
+    transform: scale(0.6);
     opacity: 0.5;
   }
 }
@@ -65,7 +67,6 @@
   justify-content: center;
   align-items: center;
   gap: calc(var(--loader-size) / 10);
-  flex-wrap: wrap;
   position: relative;
   width: var(--loader-size);
   height: var(--loader-size);
@@ -76,26 +77,10 @@
   height: calc(var(--loader-size) / 3 - var(--loader-size) / 15);
   border-radius: 50%;
   background: var(--loader-color);
-  animation: loader-dots-animation 1200ms linear infinite;
-
-  &:nth-child(2),
-  &:nth-child(4) {
-    animation-delay: -400ms;
-  }
-
-  &:nth-child(3),
-  &:nth-child(5),
-  &:nth-child(7) {
-    animation-delay: -800ms;
-  }
-
-  &:nth-child(6),
-  &:nth-child(8) {
-    animation-delay: -1200ms;
-  }
+  animation: loader-dots-animation 0.8s infinite linear;
 
-  &:nth-child(9) {
-    animation-delay: -1600ms;
+  &:nth-child(2) {
+    animation-delay: 0.4s;
   }
 }
 
diff --git a/src/mantine-core/src/components/Loader/loaders/Dots.tsx b/src/mantine-core/src/components/Loader/loaders/Dots.tsx
index 4e8a45e18c1..f895a68397c 100644
--- a/src/mantine-core/src/components/Loader/loaders/Dots.tsx
+++ b/src/mantine-core/src/components/Loader/loaders/Dots.tsx
@@ -9,11 +9,5 @@ export const Dots: MantineLoaderComponent = forwardRef(({ className, ...others }
     <span className={classes.dot} />
     <span className={classes.dot} />
     <span className={classes.dot} />
-    <span className={classes.dot} />
-    <span className={classes.dot} />
-    <span className={classes.dot} />
-    <span className={classes.dot} />
-    <span className={classes.dot} />
-    <span className={classes.dot} />
   </Box>
 ));

From d0c65ee1104349936282925238d7851a53247b46 Mon Sep 17 00:00:00 2001
From: Jonathan Avila <javila@montecarlodata.com>
Date: Wed, 20 Sep 2023 08:54:49 -0400
Subject: [PATCH 2/2] Fix duplicate semicolon in Loader.module.css

---
 src/mantine-core/src/components/Loader/Loader.module.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/mantine-core/src/components/Loader/Loader.module.css b/src/mantine-core/src/components/Loader/Loader.module.css
index b8440c9e57a..d9d02dd2bae 100644
--- a/src/mantine-core/src/components/Loader/Loader.module.css
+++ b/src/mantine-core/src/components/Loader/Loader.module.css
@@ -53,7 +53,7 @@
   0%,
   100% {
     transform: scale(1);
-    opacity: 1;;
+    opacity: 1;
   }
 
   50% {