Introduce QuackDefaultTextField (#707)

디자인 가이드라인상 `Default Text Fields` 컴포넌트 및 데코레이터를 모두 추가합니다.

.editorconfig

@@ -4,13 +4,15 @@ root = true
 charset = utf-8
 indent_size = 2
 indent_style = space
+max_line_length = 150
 insert_final_newline = true
 trim_trailing_whitespace = true
 ktlint_standard_filename = disabled
-ktlint_standard_max-line-length = disabled
 ktlint_standard_import-ordering = disabled
 ktlint_standard_annotation = disabled
+ktlint_standard_wrapping = disabled
 ktlint_standard_argument-list-wrapping = disabled
+ktlint_standard_multiline-if-else = disabled
 
 [*.{kt,kts}]
 ij_kotlin_allow_trailing_comma = true

aide/src/main/kotlin/team/duckie/quackquack/aide/rule/AideModifiers.kt

@@ -25,6 +25,13 @@ internal val aideModifiers: Map<String, List<String>> = run {
   aide["_span"] = emptyList()
   aide["_highlight"] = emptyList()
 
+  aide["textfield"] = listOf("defaultTextFieldIcon", "filledTextFieldIcon",
+      "defaultTextFieldIndicator", "counter")
+  aide["_defaultTextFieldIcon"] = emptyList()
+  aide["_filledTextFieldIcon"] = emptyList()
+  aide["_defaultTextFieldIndicator"] = emptyList()
+  aide["_counter"] = emptyList()
+
   aide
 }
 

aide/src/main/kotlin/team/duckie/quackquack/aide/rule/QuackComponents.kt

@@ -87,6 +87,10 @@ internal val quackComponents: Map<String, String> = run {
   aide["QuackTitle2"] = "text"
   aide["QuackText"] = "text"
 
+  aide["QuackDefaultTextField"] = "textfield"
+  aide["QuackBaseDefaultTextField"] = "textfield"
+  aide["QuackFilledTextField"] = "textfield"
+
   aide
 }
 

bom/version.txt

@@ -1 +1 @@
-2023.05.18
+2023.05.25

build-logic/src/main/kotlin/SugarPoetConfig.kt

@@ -6,4 +6,4 @@
  */
 
 // TODO: 작동 방식 변경 (gradle task)
-const val sugarPoet = true
+const val sugarPoet = false

casa-material/src/main/kotlin/team/duckie/quackquack/casa/material/CasaConfig.kt

@@ -5,7 +5,7 @@
  * Please see full license: https://github.com/duckie-team/quack-quack-android/blob/main/LICENSE
  */
 
-@file:Suppress("MaximumLineLength", "MaxLineLength")
+@file:Suppress("MaximumLineLength", "MaxLineLength", "ktlint:max-line-length")
 
 package team.duckie.quackquack.casa.material
 

catalog/src/main/kotlin/team/duckie/quackquack/catalog/MainActivity.kt

@@ -5,7 +5,7 @@
  * Please see full license: https://github.com/duckie-team/quack-quack-android/blob/master/LICENSE
  */
 
-@file:OptIn(ExperimentalQuackQuackApi::class)
+@file:OptIn(ExperimentalQuackQuackApi::class, ExperimentalDesignToken::class)
 @file:Suppress("UnnecessaryOptInAnnotation")
 
 package team.duckie.quackquack.catalog
@@ -24,6 +24,7 @@ import androidx.compose.ui.unit.dp
 import casaModels
 import team.duckie.quackquack.casa.ui.CasaScreen
 import team.duckie.quackquack.casa.ui.theme.CasaTheme
+import team.duckie.quackquack.ui.optin.ExperimentalDesignToken
 import team.duckie.quackquack.ui.util.ExperimentalQuackQuackApi
 
 class MainActivity : ComponentActivity() {
@@ -34,18 +35,69 @@ class MainActivity : ComponentActivity() {
         CasaScreen(models = casaModels)
       }
       /*Preview {
-        // var showTrailingIcon by remember { mutableStateOf(true) }
-        var selected by remember { mutableStateOf(true) }
-        QuackTag(
+        var value by rememberSaveable { mutableStateOf("") }
+        QuackDefaultTextField(
+          value = "ShortText",
+          onValueChange = {},
+          style = QuackTextFieldStyle.Default,
+          validationState = TextFieldValidationState.Default,
+        )
+        QuackDefaultTextField(
           modifier = Modifier
-            .then(Modifier)
-            .trailingIcon(QuackIcon.Heart) { toast("HI: $selected") },
-          text = "QuackTagPreview",
-          style = QuackTagStyle.Filled,
-          selected = selected,
-        ) {
-          selected = !selected
-        }
+            .fillMaxWidth()
+            .defaultTextFieldIndicator()
+            .defaultTextFieldIcon(
+              icon = QuackIcon.FilledHeart,
+              tint = QuackColor.Unspecified,
+              iconSize = 24.dp,
+              direction = HorizontalDirection.Left,
+            ) {
+              toast("left heart!")
+            }
+            .defaultTextFieldIcon(
+              icon = QuackIcon.FilledHeart,
+              iconSize = 24.dp,
+              tint = QuackColor.Unspecified,
+              direction = HorizontalDirection.Right,
+            ) {
+              toast("right heart!")
+            }
+            .counter(maxLength = 10),
+          value = value,
+          onValueChange = { value = it },
+          // placeholderText = "사랑의 주며, 청춘을 것은 이상은 되는 불러 바이며, 귀는 듣는다. 내는 힘차게 있는 황금시대다. 우리는 공자는 노년에게서 그들을 있는 수 얼음과 피다.",
+          validationState = TextFieldValidationState.Error(),
+          placeholderText = "Hello!",
+          placeholderStrategy = TextFieldPlaceholderStrategy.Always,
+          style = QuackTextFieldStyle.Default,
+        )
+        QuackDefaultTextField(
+          modifier = Modifier
+            .fillMaxWidth()
+            .defaultTextFieldIndicator()
+            .defaultTextFieldIcon(
+              icon = QuackIcon.FilledHeart,
+              tint = QuackColor.Unspecified,
+              direction = HorizontalDirection.Left,
+            ) {
+              toast("left heart!")
+            }
+            .defaultTextFieldIcon(
+              icon = QuackIcon.FilledHeart,
+              tint = QuackColor.Unspecified,
+              direction = HorizontalDirection.Right,
+            ) {
+              toast("right heart!")
+            }
+            .counter(maxLength = 10),
+          value = value,
+          onValueChange = { value = it },
+          // placeholderText = "사랑의 주며, 청춘을 것은 이상은 되는 불러 바이며, 귀는 듣는다. 내는 힘차게 있는 황금시대다. 우리는 공자는 노년에게서 그들을 있는 수 얼음과 피다.",
+          validationState = TextFieldValidationState.Success(),
+          placeholderText = "Hello!",
+          placeholderStrategy = TextFieldPlaceholderStrategy.Always,
+          style = QuackTextFieldStyle.DefaultLarge,
+        )
       }*/
     }
   }
@@ -57,7 +109,7 @@ private fun Preview(content: @Composable ColumnScope.() -> Unit) {
   Column(
     modifier = Modifier.fillMaxSize(),
     verticalArrangement = Arrangement.spacedBy(
-      space = 8.dp,
+      space = 15.dp,
       alignment = Alignment.CenterVertically,
     ),
     horizontalAlignment = Alignment.CenterHorizontally,

detekt-config.yml

@@ -24,8 +24,12 @@ formatting:
     active: false
   MaximumLineLength:
     active: false
+  MultiLineIfElse:
+    active: false
   Indentation:
     indentSize: 2
+  ParameterListWrapping:
+    active: false
   ArgumentListWrapping:
     indentSize: 2
     maxLineLength: 150
@@ -34,9 +38,9 @@ formatting:
     indentSize: 2
   Wrapping:
     indentSize: 2
+    active: false
   CommentWrapping:
-    active: true
-    indentSize: 2
+    active: false
   Filename:
     active: false
   PackageName:
@@ -61,8 +65,7 @@ style:
   DestructuringDeclarationWithTooManyEntries:
     active: false
   MaxLineLength:
-    maxLineLength: 150
-    excludeCommentStatements: true
+    active: false
 
 naming:
   TopLevelPropertyNaming:

material/src/main/kotlin/team/duckie/quackquack/material/clickable.kt

@@ -63,27 +63,30 @@ public fun Modifier.quackClickable(
   rippleEnabled: Boolean = true,
   onClick: (() -> Unit)? = null,
   onLongClick: (() -> Unit)? = null,
-): Modifier = composed(
-  fullyQualifiedName = "team.duckie.quackquack.material.quackClickable",
-  key1 = rippleColor,
-  key2 = rippleEnabled,
-  inspectorInfo = debugInspectorInfo {
-    name = "quackClickable"
-    properties["role"] = role
-    properties["rippleColor"] = rippleColor
-    properties["rippleEnabled"] = rippleEnabled
-    properties["onClick"] = onClick
-    properties["onLongClick"] = onLongClick
-  },
-) {
-  val ripple = rememberRipple(color = rippleColor?.value ?: Color.Unspecified)
-  val interactionSource = remember { MutableInteractionSource() }
+): Modifier =
+  if (onClick == null && onLongClick == null) this
+  else
+    composed(
+      fullyQualifiedName = "team.duckie.quackquack.material.quackClickable",
+      key1 = rippleColor,
+      key2 = rippleEnabled,
+      inspectorInfo = debugInspectorInfo {
+        name = "quackClickable"
+        properties["role"] = role
+        properties["rippleColor"] = rippleColor
+        properties["rippleEnabled"] = rippleEnabled
+        properties["onClick"] = onClick
+        properties["onLongClick"] = onLongClick
+      },
+    ) {
+      val ripple = rememberRipple(color = rippleColor?.value ?: Color.Unspecified)
+      val interactionSource = remember { MutableInteractionSource() }
 
-  combinedClickable(
-    indication = ripple.takeIf { QuackAlwaysShowRipple || rippleEnabled },
-    interactionSource = interactionSource,
-    role = role,
-    onClick = onClick ?: {},
-    onLongClick = onLongClick,
-  )
-}
+      combinedClickable(
+        indication = ripple.takeIf { QuackAlwaysShowRipple || rippleEnabled },
+        interactionSource = interactionSource,
+        role = role,
+        onClick = onClick ?: {},
+        onLongClick = onLongClick,
+      )
+    }

material/src/main/kotlin/team/duckie/quackquack/material/color.kt

@@ -68,6 +68,9 @@ public value class QuackColor(public val value: Color) : ReadOnlyProperty<Any, C
     @Stable
     public val Alert: QuackColor = QuackColor(Color(0xFFFF2929))
 
+    @Stable
+    public val Success: QuackColor = QuackColor(Color(0xFF02B288))
+
     @Stable
     public val Dimmed: QuackColor = QuackColor(Color(0x99000000)) // 0.6 alpha
 

material/src/main/kotlin/team/duckie/quackquack/material/theme/theme.kt

@@ -23,10 +23,10 @@ import team.duckie.quackquack.material.QuackColor
 /**
  * 꽥꽥 컴포넌트에서 사용할 커서 색상을 제공합니다.
  *
- * @see QuackTextFieldColors
+ * @see QuackTextFieldTheme
  */
-public val LocalQuackTextFieldColors: ProvidableCompositionLocal<QuackTextFieldColors> =
-  staticCompositionLocalOf { DefaultTextFieldColors }
+public val LocalQuackTextFieldTheme: ProvidableCompositionLocal<QuackTextFieldTheme> =
+  staticCompositionLocalOf { DefaultTextFieldTheme }
 
 /**
  * 꽥꽥에서 사용하는 컴포저블 테마를 제공합니다. 이 테마에서는 다음과 같을 작업을 진행합니다.
@@ -44,24 +44,24 @@ public fun QuackTheme(content: @Composable () -> Unit) {
       handleColor = QuackColor.DuckieOrange.value,
       backgroundColor = QuackColor.DuckieOrange.change(alpha = 0.2f).value,
     ),
-    LocalQuackTextFieldColors provides DefaultTextFieldColors,
+    LocalQuackTextFieldTheme provides DefaultTextFieldTheme,
     content = content,
   )
 }
 
 /** 꽥꽥의 TextField 관련 컴포넌트에 사용할 테마를 지정합니다. */
 @Immutable
-public interface QuackTextFieldColors {
+public interface QuackTextFieldTheme {
   /**
    * 꽥꽥 컴포넌트에서 사용할 커서 색상
    *
    * 기본값으로 [QuackColor.Black]를 사용합니다.
    */
-  public val cursor: QuackColor
+  public val cursorColor: QuackColor
 }
 
-/** [QuackTextFieldColors]의 덕키 기본값 */
+/** [QuackTextFieldTheme]의 덕키 기본값 */
 @Immutable
-public object DefaultTextFieldColors : QuackTextFieldColors {
-  override val cursor: QuackColor = QuackColor.DuckieOrange
+public object DefaultTextFieldTheme : QuackTextFieldTheme {
+  override val cursorColor: QuackColor = QuackColor.DuckieOrange
 }

material/version.txt

@@ -1 +1 @@
-2.0.0-alpha03
+2.0.0-alpha04

ui/build.gradle.kts

@@ -47,6 +47,10 @@ android {
   testOptions {
     unitTests {
       isIncludeAndroidResources = true
+      isReturnDefaultValues = true
+      all { test ->
+        test.maxHeapSize = "4G"
+      }
     }
   }
 }
@@ -70,6 +74,8 @@ dependencies {
   )
   implementations(
     libs.compose.coil,
+    libs.compose.ui,
+    libs.compose.foundation,
     libs.androidx.annotation,
     projects.runtime.orArtifact(),
     projects.material.orArtifact(),
@@ -87,6 +93,8 @@ dependencies {
   testImplementations(
     libs.test.robolectric,
     libs.test.junit.compose,
+    libs.test.kotest.assertion.core,
+    libs.test.kotlin.coroutines, // needed for compose-ui-test
     libs.bundles.test.roborazzi,
   )