From 42b24c1ab91b326be6778cf7e966dab045283ec8 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Wed, 16 Oct 2024 10:36:06 +0300
Subject: [PATCH] Fixed #6583 - Disabled ToggleSwitch in dark mode is same as
 non-disabled

---
 packages/themes/src/presets/aura/toggleswitch/index.js | 10 ++++++----
 packages/themes/src/presets/lara/toggleswitch/index.js | 10 ++++++----
 .../themes/src/presets/material/toggleswitch/index.js  | 10 ++++++----
 3 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/packages/themes/src/presets/aura/toggleswitch/index.js b/packages/themes/src/presets/aura/toggleswitch/index.js
index 6fa3d9901..0d89a5479 100644
--- a/packages/themes/src/presets/aura/toggleswitch/index.js
+++ b/packages/themes/src/presets/aura/toggleswitch/index.js
@@ -19,24 +19,24 @@ export default {
         checkedHoverBorderColor: 'transparent',
         invalidBorderColor: '{form.field.invalid.border.color}',
         transitionDuration: '{form.field.transition.duration}',
-        slideDuration: '0.2s',
-        disabledBackground: '{form.field.disabled.background}'
+        slideDuration: '0.2s'
     },
     handle: {
         borderRadius: '50%',
-        size: '1rem',
-        disabledBackground: '{form.field.disabled.color}'
+        size: '1rem'
     },
     colorScheme: {
         light: {
             root: {
                 background: '{surface.300}',
+                disabledBackground: '{form.field.disabled.background}',
                 hoverBackground: '{surface.400}',
                 checkedBackground: '{primary.color}',
                 checkedHoverBackground: '{primary.hover.color}'
             },
             handle: {
                 background: '{surface.0}',
+                disabledBackground: '{form.field.disabled.color}',
                 hoverBackground: '{surface.0}',
                 checkedBackground: '{surface.0}',
                 checkedHoverBackground: '{surface.0}',
@@ -49,12 +49,14 @@ export default {
         dark: {
             root: {
                 background: '{surface.700}',
+                disabledBackground: '{surface.600}',
                 hoverBackground: '{surface.600}',
                 checkedBackground: '{primary.color}',
                 checkedHoverBackground: '{primary.hover.color}'
             },
             handle: {
                 background: '{surface.400}',
+                disabledBackground: '{surface.900}',
                 hoverBackground: '{surface.300}',
                 checkedBackground: '{surface.900}',
                 checkedHoverBackground: '{surface.900}',
diff --git a/packages/themes/src/presets/lara/toggleswitch/index.js b/packages/themes/src/presets/lara/toggleswitch/index.js
index 0ff04ade5..a1ae68ad6 100644
--- a/packages/themes/src/presets/lara/toggleswitch/index.js
+++ b/packages/themes/src/presets/lara/toggleswitch/index.js
@@ -19,24 +19,24 @@ export default {
         checkedHoverBorderColor: 'transparent',
         invalidBorderColor: '{form.field.invalid.border.color}',
         transitionDuration: '{form.field.transition.duration}',
-        slideDuration: '0.2s',
-        disabledBackground: '{form.field.disabled.background}'
+        slideDuration: '0.2s'
     },
     handle: {
         borderRadius: '50%',
-        size: '1.25rem',
-        disabledBackground: '{form.field.disabled.color}'
+        size: '1.25rem'
     },
     colorScheme: {
         light: {
             root: {
                 background: '{surface.300}',
+                disabledBackground: '{form.field.disabled.background}',
                 hoverBackground: '{surface.400}',
                 checkedBackground: '{primary.color}',
                 checkedHoverBackground: '{primary.hover.color}'
             },
             handle: {
                 background: '{surface.0}',
+                disabledBackground: '{form.field.disabled.color}',
                 hoverBackground: '{surface.0}',
                 checkedBackground: '{surface.0}',
                 checkedHoverBackground: '{surface.0}',
@@ -49,12 +49,14 @@ export default {
         dark: {
             root: {
                 background: '{surface.700}',
+                disabledBackground: '{surface.600}',
                 hoverBackground: '{surface.600}',
                 checkedBackground: '{primary.color}',
                 checkedHoverBackground: '{primary.hover.color}'
             },
             handle: {
                 background: '{surface.400}',
+                disabledBackground: '{surface.900}',
                 hoverBackground: '{surface.300}',
                 checkedBackground: '{surface.900}',
                 checkedHoverBackground: '{surface.900}',
diff --git a/packages/themes/src/presets/material/toggleswitch/index.js b/packages/themes/src/presets/material/toggleswitch/index.js
index 3a60048e2..da0cd7cb5 100644
--- a/packages/themes/src/presets/material/toggleswitch/index.js
+++ b/packages/themes/src/presets/material/toggleswitch/index.js
@@ -19,24 +19,24 @@ export default {
         checkedHoverBorderColor: 'transparent',
         invalidBorderColor: '{form.field.invalid.border.color}',
         transitionDuration: '{form.field.transition.duration}',
-        slideDuration: '0.2s',
-        disabledBackground: '{form.field.disabled.background}'
+        slideDuration: '0.2s'
     },
     handle: {
         borderRadius: '50%',
-        size: '1.5rem',
-        disabledBackground: '{form.field.disabled.color}'
+        size: '1.5rem'
     },
     colorScheme: {
         light: {
             root: {
                 background: '{surface.300}',
+                disabledBackground: '{surface.400}',
                 hoverBackground: '{surface.300}',
                 checkedBackground: '{primary.200}',
                 checkedHoverBackground: '{primary.200}'
             },
             handle: {
                 background: '{surface.0}',
+                disabledBackground: '{surface.200}',
                 hoverBackground: '{surface.0}',
                 checkedBackground: '{primary.color}',
                 checkedHoverBackground: '{primary.color}',
@@ -49,12 +49,14 @@ export default {
         dark: {
             root: {
                 background: '{surface.700}',
+                disabledBackground: '{surface.600}',
                 hoverBackground: '{surface.700}',
                 checkedBackground: '{primary.color}',
                 checkedHoverBackground: '{primary.color}'
             },
             handle: {
                 background: '{surface.400}',
+                disabledBackground: '{surface.500}',
                 hoverBackground: '{surface.300}',
                 checkedBackground: '{primary.200}',
                 checkedHoverBackground: '{primary.200}',