From 39677615b6b0d97105b05992e211e5733c741bb4 Mon Sep 17 00:00:00 2001
From: Wagner Maciel <wagnermaciel@google.com>
Date: Mon, 25 Mar 2024 15:37:30 -0400
Subject: [PATCH] feat(material-experimental/theming): add mixin for
 customizing checkbox tokens

---
 src/material/checkbox/_checkbox-theme.scss | 12 +++++
 src/material/core/tokens/_token-utils.scss | 56 ++++++++++++++++++++++
 2 files changed, 68 insertions(+)

diff --git a/src/material/checkbox/_checkbox-theme.scss b/src/material/checkbox/_checkbox-theme.scss
index 8b0501cbd200..4adf8317c4ae 100644
--- a/src/material/checkbox/_checkbox-theme.scss
+++ b/src/material/checkbox/_checkbox-theme.scss
@@ -92,6 +92,18 @@
   }
 }
 
+/// Outputs the CSS variable values for the given tokens.
+/// @param {Map} $tokens The token values to emit.
+@mixin overrides($tokens: ()) {
+  @include token-utils.batch-create-token-values(
+    $tokens,
+    $mat-prefix: tokens-mat-checkbox.$prefix,
+    $mdc-prefix: tokens-mdc-checkbox.$prefix,
+    $mat-tokens: tokens-mat-checkbox.get-token-slots(),
+    $mdc-tokens: tokens-mdc-checkbox.get-token-slots(),
+  );
+}
+
 /// Outputs all (base, color, typography, and density) theme styles for the mat-checkbox.
 /// @param {Map} $theme The theme to generate styles for.
 /// @param {ArgList} Additional optional arguments (only supported for M3 themes):
diff --git a/src/material/core/tokens/_token-utils.scss b/src/material/core/tokens/_token-utils.scss
index a09bd188f6d7..d78f1a7d5221 100644
--- a/src/material/core/tokens/_token-utils.scss
+++ b/src/material/core/tokens/_token-utils.scss
@@ -206,3 +206,59 @@ $_component-prefix: null;
   }
   @return map.merge($values, $overrides);
 }
+
+/// Emits new token values for the given tokens.
+/// Verifies that the tokens passed in are valid tokens.
+/// New token values are emitted under the current selector or root.
+@mixin batch-create-token-values(
+  $tokens: (),
+  $mat-prefix: '',
+  $mdc-prefix: '',
+  $mat-tokens: (),
+  $mdc-tokens: ()
+) {
+  $custom-mat-tokens: ();
+  $custom-mdc-tokens: ();
+
+  $mat-token-names: map.keys($mat-tokens);
+  $mdc-token-names: map.keys($mdc-tokens);
+  $valid-token-names: _get-valid-token-names($mat-tokens, $mdc-tokens);
+
+  @each $name, $value in $tokens {
+    $is-mat-token: list.index($mat-token-names, $name) != null;
+    $is-mdc-token: list.index($mdc-token-names, $name) != null;
+
+    @if ($is-mat-token) {
+      $custom-mat-tokens: map.set($custom-mat-tokens, $name, $value);
+    }
+
+    @if ($is-mdc-token) {
+      $custom-mdc-tokens: map.set($custom-mdc-tokens, $name, $value);
+    }
+
+    @if (list.index($valid-token-names, $name) == null) {
+      @error (
+        'Invalid token: "' + $name + '"'
+        'Valid tokens include: ' $valid-token-names
+      );
+    }
+  }
+
+  @include sass-utils.current-selector-or-root() {
+    @include create-token-values($mat-prefix, $custom-mat-tokens);
+    @include create-token-values($mdc-prefix, $custom-mdc-tokens);
+  }
+}
+
+/// Returns the union of token names whose values are not null.
+@function _get-valid-token-names($mat-tokens, $mdc-tokens) {
+  $mat-and-mdc-tokens: map.merge($mat-tokens, $mdc-tokens);
+
+  @each $name, $value in $mat-and-mdc-tokens {
+    @if ($value == null) {
+      $mat-and-mdc-tokens: map.remove($mat-and-mdc-tokens, $name);
+    }
+  }
+
+  @return map.keys($mat-and-mdc-tokens);
+}