@@ -4,6 +4,7 @@ import androidx.annotation.StringRes
44import androidx.compose.foundation.BorderStroke
55import androidx.compose.foundation.background
66import androidx.compose.foundation.border
7+ import androidx.compose.foundation.clickable
78import androidx.compose.foundation.layout.Box
89import androidx.compose.foundation.layout.Row
910import androidx.compose.foundation.layout.Spacer
@@ -47,6 +48,7 @@ fun ReedTextField(
4748 queryState : TextFieldState ,
4849 @StringRes queryHintRes : Int ,
4950 onSearch : (String ) -> Unit ,
51+ onClear : () -> Unit ,
5052 modifier : Modifier = Modifier ,
5153 backgroundColor : Color = ReedTheme .colors.baseSecondary,
5254 textColor : Color = ReedTheme .colors.contentPrimary,
@@ -58,7 +60,9 @@ fun ReedTextField(
5860 CompositionLocalProvider (LocalTextSelectionColors provides reedTextSelectionColors) {
5961 BasicTextField (
6062 state = queryState,
61- modifier = Modifier .fillMaxWidth(),
63+ modifier = Modifier
64+ .fillMaxWidth()
65+ .height(50 .dp),
6266 textStyle = ReedTheme .typography.body2Medium.copy(color = textColor),
6367 keyboardOptions = KeyboardOptions (
6468 keyboardType = KeyboardType .Text ,
@@ -81,7 +85,7 @@ fun ReedTextField(
8185 verticalAlignment = Alignment .CenterVertically ,
8286 ) {
8387 Spacer (modifier = Modifier .width(ReedTheme .spacing.spacing4))
84- Box {
88+ Box (modifier = Modifier .weight( 1f )) {
8589 if (queryState.text.isEmpty()) {
8690 Text (
8791 text = stringResource(id = queryHintRes),
@@ -91,10 +95,25 @@ fun ReedTextField(
9195 }
9296 innerTextField()
9397 }
94- Spacer (modifier = Modifier .weight(1f ))
98+ Spacer (modifier = Modifier .width(ReedTheme .spacing.spacing2))
99+ if (queryState.text.toString().isNotEmpty()) {
100+ Icon (
101+ imageVector = ImageVector .vectorResource(R .drawable.ic_x_circle),
102+ contentDescription = " Clear Icon" ,
103+ modifier = Modifier .clickable {
104+ onClear()
105+ },
106+ tint = Color .Unspecified ,
107+ )
108+ }
109+ Spacer (modifier = Modifier .width(ReedTheme .spacing.spacing2))
95110 Icon (
96111 imageVector = ImageVector .vectorResource(R .drawable.ic_search),
97112 contentDescription = " Search Icon" ,
113+ modifier = Modifier .clickable {
114+ onSearch(queryState.text.toString())
115+ keyboardController?.hide()
116+ },
98117 tint = ReedTheme .colors.contentBrand,
99118 )
100119 Spacer (modifier = Modifier .width(ReedTheme .spacing.spacing4))
@@ -112,6 +131,7 @@ private fun ReedTextFieldPreview() {
112131 queryState = TextFieldState (" 검색" ),
113132 queryHintRes = R .string.search_book_hint,
114133 onSearch = {},
134+ onClear = {},
115135 modifier = Modifier
116136 .height(46 .dp)
117137 .fillMaxWidth()
0 commit comments