Migrate Custom design system page to M3 (#325)

* Migrate Custom design system page to M3

* Apply Spotless

---------

Co-authored-by: riggaroo <[email protected]>

Author: riggaroo

compose/snippets/src/main/java/com/example/compose/snippets/designsystems/CustomDesignSystem.kt

@@ -16,13 +16,13 @@
 
 package com.example.compose.snippets.designsystems
 
+import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.shape.ZeroCornerSize
-import androidx.compose.material.Colors
-import androidx.compose.material.ContentAlpha
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.ColorScheme
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ProvideTextStyle
 import androidx.compose.material3.Shapes
@@ -38,28 +38,13 @@ import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import com.example.compose.snippets.designsystems.FullyCustomDesignSystem.CustomTheme.elevation
 
-/*
-* Copyright 2022 The Android Open Source Project
-*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*/
 private object CustomDesignSystemExtend {
     // [START android_compose_designsystems_custom_extend]
-    // Use with MaterialTheme.colors.snackbarAction
-    val Colors.snackbarAction: Color
-        get() = if (isLight) Red300 else Red700
+    // Use with MaterialTheme.colorScheme.snackbarAction
+    val ColorScheme.snackbarAction: Color
+        @Composable
+        get() = if (isSystemInDarkTheme()) Red300 else Red700
 
     // Use with MaterialTheme.typography.textFieldInput
     val Typography.textFieldInput: TextStyle
@@ -78,14 +63,14 @@ private object CustomDesignSystemExtendTheme {
     // [START android_compose_designsystems_custom_extend_theme]
     @Immutable
     data class ExtendedColors(
-        val tertiary: Color,
-        val onTertiary: Color
+        val caution: Color,
+        val onCaution: Color
     )
 
     val LocalExtendedColors = staticCompositionLocalOf {
         ExtendedColors(
-            tertiary = Color.Unspecified,
-            onTertiary = Color.Unspecified
+            caution = Color.Unspecified,
+            onCaution = Color.Unspecified
         )
     }
 
@@ -95,8 +80,8 @@ private object CustomDesignSystemExtendTheme {
         content: @Composable () -> Unit
     ) {
         val extendedColors = ExtendedColors(
-            tertiary = Color(0xFFA8EFF0),
-            onTertiary = Color(0xFF002021)
+            caution = Color(0xFFFFCC02),
+            onCaution = Color(0xFF2C2D30)
         )
         CompositionLocalProvider(LocalExtendedColors provides extendedColors) {
             MaterialTheme(
@@ -106,7 +91,7 @@ private object CustomDesignSystemExtendTheme {
         }
     }
 
-    // Use with eg. ExtendedTheme.colors.tertiary
+    // Use with eg. ExtendedTheme.colors.caution
     object ExtendedTheme {
         val colors: ExtendedColors
             @Composable
@@ -123,8 +108,8 @@ private object CustomDesignSystemExtendTheme {
     ) {
         Button(
             colors = ButtonDefaults.buttonColors(
-                containerColor = ExtendedTheme.colors.tertiary,
-                contentColor = ExtendedTheme.colors.onTertiary
+                containerColor = ExtendedTheme.colors.caution,
+                contentColor = ExtendedTheme.colors.onCaution
                 /* Other colors use values from MaterialTheme */
             ),
             onClick = onClick,
@@ -340,7 +325,7 @@ object FullyCustomDesignSystem {
                     .copy(alpha = 0.12f)
                     .compositeOver(CustomTheme.colors.component),
                 disabledContentColor = CustomTheme.colors.content
-                    .copy(alpha = ContentAlpha.disabled)
+                    .copy(alpha = 0.38f)
             ),
             shape = ButtonShape,
             elevation = ButtonDefaults.elevatedButtonElevation(