From cbca0c20bd4d630722e89b6f020d1624cd555176 Mon Sep 17 00:00:00 2001
From: Material Web Team <material-web-copybara@google.com>
Date: Mon, 18 Sep 2023 04:05:32 -0700
Subject: [PATCH] <TODO>

PiperOrigin-RevId: 566257686
---
 packages/mdc-checkbox/_checkbox-theme.scss | 38 ++++++++++++++++++----
 1 file changed, 32 insertions(+), 6 deletions(-)

diff --git a/packages/mdc-checkbox/_checkbox-theme.scss b/packages/mdc-checkbox/_checkbox-theme.scss
index ee56a7793ac..a8a702070f7 100644
--- a/packages/mdc-checkbox/_checkbox-theme.scss
+++ b/packages/mdc-checkbox/_checkbox-theme.scss
@@ -170,7 +170,11 @@ $forced-colors-theme: (
   }
 
   @include ripple-color(
-    $color: map.get($theme, unselected-hover-state-layer-color),
+    $color-map: (
+      hover: map.get($theme, unselected-hover-state-layer-color),
+      focus: map.get($theme, unselected-focus-state-layer-color),
+      press: map.get($theme, unselected-pressed-state-layer-color),
+    ),
     $opacity-map: (
       hover: map.get($theme, unselected-hover-state-layer-opacity),
       focus: map.get($theme, unselected-focus-state-layer-opacity),
@@ -222,7 +226,9 @@ $light-theme-deprecated: (
   }
   @if $ripple-color {
     @include ripple-color(
-      $color: $ripple-color,
+      $color-map: (
+        hover: $ripple-color,
+      ),
       $opacity-map: $ripple-opacity,
       $query: $query
     );
@@ -633,16 +639,32 @@ $light-theme-deprecated: (
 
 /// Sets ripple color when checkbox is not in checked state.
 @mixin ripple-color(
-  $color,
+  $color-map: null,
   $opacity-map: null,
   $query: feature-targeting.all()
 ) {
   @include ripple-theme.states(
-    $color: $color,
+    $color: map.get($color-map, hover),
     $opacity-map: $opacity-map,
     $query: $query,
     $ripple-target: $ripple-target
   );
+
+  @if map.has-key($color-map, focus) {
+    @include ripple-theme.states-activated(
+      $color: map.get($color-map, focus),
+      $query: $query,
+      $ripple-target: $ripple-target
+    );
+  }
+
+  @if map.has-key($color-map, press) {
+    @include ripple-theme.states-selected(
+      $color: map.get($color-map, press),
+      $query: $query,
+      $ripple-target: $ripple-target
+    );
+  }
 }
 
 /// Sets focus indicator color when checkbox is in checked state.
@@ -703,7 +725,9 @@ $light-theme-deprecated: (
 /// @access private
 ///
 @mixin if-unmarked-enabled_ {
-  .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate='true'])
+  .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not(
+      [data-indeterminate='true']
+    )
     ~ {
     @content;
   }
@@ -718,7 +742,9 @@ $light-theme-deprecated: (
   // Note: we must use `[disabled]` instead of `:disabled` below because Edge does not always recalculate the style
   // property when the `:disabled` pseudo-class is followed by a sibling combinator. See:
   // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11295231/
-  .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate='true'])
+  .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not(
+      [data-indeterminate='true']
+    )
     ~ {
     @content;
   }