refactor: add a safe-rgba function in case palettes is empty map

Author: andrewseguin

src/material/core/tokens/m2/_md-sys-color.scss

@@ -23,7 +23,7 @@
     inverse-on-surface: rgba(black, 0.87),
     outline: rgba(white, 0.12),
     outline-variant: rgba(white, 0.38),
-    error-container: rgba(map.get($palettes, warn, 300), 0.24),
+    error-container: safe-rgba(map.get($palettes, warn, 300), 0.24),
     on-background: white,
     on-error-container: map.get($palettes, warn, 100),
     on-primary-container: map.get($palettes, primary, 100),
@@ -36,11 +36,11 @@
     on-tertiary-container: map.get($palettes, accent, 100),
     on-tertiary-fixed: map.get($palettes, accent, default-contrast),
     on-tertiary-fixed-variant: map.get($palettes, accent, default-contrast),
-    primary-container: rgba(map.get($palettes, primary, 300), 0.24),
+    primary-container: safe-rgba(map.get($palettes, primary, 300), 0.24),
     primary-fixed: map.get($palettes, primary, default),
     primary-fixed-dim: map.get($palettes, primary, default),
     scrim: black,
-    secondary-container: rgba(map.get($palettes, accent, 300), 0.24),
+    secondary-container: safe-rgba(map.get($palettes, accent, 300), 0.24),
     secondary-fixed: map.get($palettes, accent, default),
     secondary-fixed-dim: map.get($palettes, accent, default),
     surface-bright: map.get(palette.$grey-palette, 800),
@@ -52,7 +52,7 @@
     surface-dim: map.get(palette.$grey-palette, 800),
     surface-tint: map.get(palette.$grey-palette, 800),
     tertiary: map.get($palettes, accent, default),
-    tertiary-container: rgba(map.get($palettes, accent, 300), 0.24),
+    tertiary-container: safe-rgba(map.get($palettes, accent, 300), 0.24),
     tertiary-fixed: map.get($palettes, accent, default),
     tertiary-fixed-dim: map.get($palettes, accent, default),
   );
@@ -121,3 +121,12 @@
 
   @return $values;
 }
+
+// Returns the rgba value for the provided color and opacity. If color is null,
+// then it returns null. If rgba is used in these cases, Sass throws an error.
+@function safe-rgba($color, $opacity) {
+  @if $color == null {
+    @return null;
+  }
+  @return rgba($color, $opacity);
+}