diff --git a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextArea.kt b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextArea.kt new file mode 100644 index 00000000..b8c84d08 --- /dev/null +++ b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextArea.kt @@ -0,0 +1,299 @@ +package com.team.prezel.core.designsystem.component.textfield + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.heightIn +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.text.BasicTextField +import androidx.compose.foundation.text.KeyboardActions +import androidx.compose.foundation.text.KeyboardOptions +import androidx.compose.material3.Surface +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue +import androidx.compose.ui.Modifier +import androidx.compose.ui.focus.onFocusChanged +import androidx.compose.ui.graphics.SolidColor +import androidx.compose.ui.platform.LocalFocusManager +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.unit.dp +import com.team.prezel.core.designsystem.component.button.PrezelButton +import com.team.prezel.core.designsystem.component.textfield.component.PrezelTextFieldLabel +import com.team.prezel.core.designsystem.component.textfield.component.PrezelTextFieldPlaceholder +import com.team.prezel.core.designsystem.component.textfield.component.PrezelTextFieldSupportingText +import com.team.prezel.core.designsystem.preview.PreviewScaffold +import com.team.prezel.core.designsystem.preview.ThemePreview +import com.team.prezel.core.designsystem.theme.PrezelTheme + +@Composable +fun PrezelTextArea( + value: String, + onValueChange: (String) -> Unit, + placeholder: String, + maxLength: Int, + modifier: Modifier = Modifier, + label: String? = null, + feedback: PrezelTextFieldFeedback = PrezelTextFieldFeedback.NO_MESSAGE, + enabled: Boolean = true, + showCount: Boolean = false, + keyboardOptions: KeyboardOptions = KeyboardOptions.Default, + keyboardActions: KeyboardActions = KeyboardActions.Default, +) { + var focused by remember { mutableStateOf(false) } + + val state = rememberPrezelTextFieldInteraction( + value = value, + enabled = enabled, + focused = focused, + ).let { interaction -> PrezelTextFieldState(interaction = interaction, feedback = feedback) } + + PrezelTextArea( + value = value, + onValueChange = { newValue -> + val applied = applyTextAreaPolicy(newValue, maxLength) + if (applied != value) onValueChange(applied) + }, + placeholder = if (focused) "" else placeholder, + state = state, + maxLength = maxLength, + onFocusChange = { isFocused -> focused = isFocused }, + modifier = modifier, + label = label, + enabled = enabled, + showCount = showCount, + keyboardOptions = keyboardOptions, + keyboardActions = keyboardActions, + ) +} + +private fun applyTextAreaPolicy( + value: String, + maxLength: Int, +): String { + require(maxLength >= 0) { "maxLength must be >= 0" } + return value + .replace("\n", "") + .take(maxLength) +} + +@Composable +private fun PrezelTextArea( + value: String, + onValueChange: (String) -> Unit, + placeholder: String, + maxLength: Int, + state: PrezelTextFieldState, + onFocusChange: (Boolean) -> Unit, + label: String?, + enabled: Boolean, + showCount: Boolean, + keyboardOptions: KeyboardOptions, + keyboardActions: KeyboardActions, + modifier: Modifier = Modifier, +) { + Column(modifier = modifier.fillMaxWidth()) { + label?.let { + PrezelTextFieldLabel(label = it) + Spacer(modifier = Modifier.height(PrezelTheme.spacing.V8)) + } + + BasicTextField( + value = value, + onValueChange = onValueChange, + enabled = enabled, + modifier = Modifier + .fillMaxWidth() + .heightIn(min = 72.dp) + .onFocusChanged { focusState -> onFocusChange(focusState.isFocused) }, + textStyle = PrezelTheme.typography.body2Regular.copy(color = state.textColor()), + cursorBrush = SolidColor(PrezelTheme.colors.interactiveRegular), + keyboardOptions = keyboardOptions, + keyboardActions = keyboardActions, + decorationBox = { innerTextField -> + PrezelTextAreaDecorationBox( + innerTextField = innerTextField, + showPlaceholder = value.isEmpty(), + placeholder = placeholder, + state = state, + counter = { + if (showCount) { + Spacer(modifier = Modifier.height(PrezelTheme.spacing.V16)) + Counter(currentLength = value.length, maxLength = maxLength, state = state) + } + }, + modifier = Modifier.heightIn(min = 72.dp), + ) + }, + ) + + if (state.supportingText.isNotEmpty()) { + Spacer(modifier = Modifier.height(PrezelTheme.spacing.V8)) + PrezelTextFieldSupportingText(state = state) + } + } +} + +@Composable +private fun Counter( + currentLength: Int, + maxLength: Int, + state: PrezelTextFieldState, + modifier: Modifier = Modifier, +) { + Text( + text = "$currentLength / $maxLength", + style = PrezelTheme.typography.caption1Medium, + color = state.textColor(), + modifier = modifier.fillMaxWidth(), + textAlign = TextAlign.End, + ) +} + +@Composable +private fun PrezelTextAreaDecorationBox( + showPlaceholder: Boolean, + innerTextField: @Composable () -> Unit, + counter: @Composable () -> Unit, + placeholder: String, + state: PrezelTextFieldState, + modifier: Modifier = Modifier, +) { + Surface( + modifier = modifier.fillMaxWidth(), + color = state.containerColor(), + shape = PrezelTheme.shapes.V8, + border = state.borderStroke(), + contentColor = state.textColor(), + ) { + Column( + modifier = Modifier + .fillMaxWidth() + .padding(PrezelTheme.spacing.V12), + verticalArrangement = Arrangement.SpaceBetween, + ) { + Box { + innerTextField() + if (showPlaceholder) PrezelTextFieldPlaceholder(placeholder = placeholder) + } + + counter() + } + } +} + +@ThemePreview +@Composable +private fun PrezelTextAreaPrezelPreview() { + PrezelTheme { + PreviewScaffold(verticalArrangement = Arrangement.spacedBy(4.dp)) { + PrezelTextAreaPreviewItem( + label = "Interaction - Default / Feedback - Default", + value = "", + state = PrezelTextFieldState( + interaction = PrezelTextFieldInteraction.DEFAULT, + ), + ) + + PrezelTextAreaPreviewItem( + label = "Interaction - Disabled / Feedback - Default", + value = "", + state = PrezelTextFieldState( + interaction = PrezelTextFieldInteraction.DISABLED, + ), + ) + + PrezelTextAreaPreviewItem( + label = "Interaction - Typing / Feedback - Default", + value = "typing...", + state = PrezelTextFieldState( + interaction = PrezelTextFieldInteraction.TYPING, + ), + ) + + PrezelTextAreaPreviewItem( + label = "Interaction - Typed / Feedback - Default", + value = "typed", + state = PrezelTextFieldState( + interaction = PrezelTextFieldInteraction.TYPED, + feedback = PrezelTextFieldFeedback.Default("헬퍼 메시지"), + ), + ) + PrezelTextAreaPreviewItem( + label = "Interaction - Typed / Feedback - Good", + value = "typed", + state = PrezelTextFieldState( + interaction = PrezelTextFieldInteraction.TYPED, + feedback = PrezelTextFieldFeedback.Good("헬퍼 메시지"), + ), + ) + + PrezelTextAreaPreviewItem( + label = "Interaction - Typed / Feedback - Bad", + value = "typed", + state = PrezelTextFieldState( + interaction = PrezelTextFieldInteraction.TYPED, + feedback = PrezelTextFieldFeedback.Bad("헬퍼 메시지"), + ), + ) + } + } +} + +@ThemePreview +@Composable +private fun MainPrezelTextAreaPreview() { + var value by remember { mutableStateOf("") } + val focusManager = LocalFocusManager.current + + PrezelTheme { + PreviewScaffold { + PrezelTextArea( + value = value, + onValueChange = { newValue -> value = newValue }, + maxLength = 100, + placeholder = "플레이스홀더", + label = "레이블", + feedback = PrezelTextFieldFeedback.Default("헬퍼 메시지"), + showCount = true, + ) + + Spacer(modifier = Modifier.height(20.dp)) + PrezelButton( + text = "포커스 제거", + onClick = { focusManager.clearFocus() }, + ) + } + } +} + +@Composable +private fun PrezelTextAreaPreviewItem( + label: String, + value: String, + state: PrezelTextFieldState, + modifier: Modifier = Modifier, +) { + PrezelTextArea( + value = value, + onValueChange = {}, + placeholder = "Placeholder", + label = label, + state = state, + maxLength = 100, + modifier = modifier, + onFocusChange = {}, + enabled = true, + showCount = true, + keyboardOptions = KeyboardOptions.Default, + keyboardActions = KeyboardActions.Default, + ) + + Spacer(modifier = Modifier.height(PrezelTheme.spacing.V16)) +} diff --git a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextField.kt b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextField.kt index 679def53..e754dbc5 100644 --- a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextField.kt +++ b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextField.kt @@ -1,6 +1,7 @@ package com.team.prezel.core.designsystem.component.textfield import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row @@ -15,7 +16,6 @@ import androidx.compose.foundation.text.KeyboardOptions import androidx.compose.material3.Icon import androidx.compose.material3.LocalContentColor import androidx.compose.material3.Surface -import androidx.compose.material3.Text import androidx.compose.material3.ripple import androidx.compose.runtime.Composable import androidx.compose.runtime.CompositionLocalProvider @@ -32,9 +32,11 @@ import androidx.compose.ui.platform.LocalFocusManager import androidx.compose.ui.res.painterResource import androidx.compose.ui.unit.dp import com.team.prezel.core.designsystem.component.button.PrezelButton +import com.team.prezel.core.designsystem.component.textfield.component.PrezelTextFieldLabel +import com.team.prezel.core.designsystem.component.textfield.component.PrezelTextFieldPlaceholder +import com.team.prezel.core.designsystem.component.textfield.component.PrezelTextFieldSupportingText import com.team.prezel.core.designsystem.icon.PrezelIcons import com.team.prezel.core.designsystem.preview.PreviewScaffold -import com.team.prezel.core.designsystem.preview.SectionTitle import com.team.prezel.core.designsystem.preview.ThemePreview import com.team.prezel.core.designsystem.theme.PrezelTheme @@ -48,6 +50,7 @@ fun PrezelTextField( trailingIcon: @Composable (() -> Unit)? = null, feedback: PrezelTextFieldFeedback = PrezelTextFieldFeedback.NO_MESSAGE, enabled: Boolean = true, + maxLength: Int = Int.MAX_VALUE, keyboardOptions: KeyboardOptions = KeyboardOptions.Default, keyboardActions: KeyboardActions = KeyboardActions.Default, ) { @@ -61,7 +64,10 @@ fun PrezelTextField( PrezelTextField( value = value, - onValueChange = onValueChange, + onValueChange = { newValue -> + val applied = applyTextFieldPolicy(newValue, maxLength) + if (applied != value) onValueChange(applied) + }, placeholder = if (focused) "" else placeholder, state = state, onFocusChange = { isFocused -> focused = isFocused }, @@ -74,8 +80,18 @@ fun PrezelTextField( ) } +private fun applyTextFieldPolicy( + value: String, + maxLength: Int, +): String { + require(maxLength >= 0) { "maxLength must be >= 0" } + return value + .replace("\n", "") + .take(maxLength) +} + @Composable -internal fun PrezelTextField( +private fun PrezelTextField( value: String, onValueChange: (String) -> Unit, placeholder: String, @@ -110,7 +126,7 @@ internal fun PrezelTextField( decorationBox = { innerTextField -> PrezelTextFieldDecorationBox( innerTextField = innerTextField, - value = value, + showPlaceholder = value.isEmpty(), placeholder = placeholder, trailingIcon = trailingIcon, state = state, @@ -127,8 +143,8 @@ internal fun PrezelTextField( @Composable private fun PrezelTextFieldDecorationBox( + showPlaceholder: Boolean, innerTextField: @Composable () -> Unit, - value: String, placeholder: String, trailingIcon: @Composable (() -> Unit)?, state: PrezelTextFieldState, @@ -149,14 +165,7 @@ private fun PrezelTextFieldDecorationBox( ) { Box(modifier = Modifier.weight(1f)) { innerTextField() - if (value.isEmpty()) { - Text( - text = placeholder, - maxLines = 1, - style = PrezelTheme.typography.body2Regular, - color = PrezelTheme.colors.textSmall, - ) - } + if (showPlaceholder) PrezelTextFieldPlaceholder(placeholder = placeholder) } trailingIcon?.let { content -> @@ -170,41 +179,13 @@ private fun PrezelTextFieldDecorationBox( } } -@Composable -private fun PrezelTextFieldLabel( - label: String, - modifier: Modifier = Modifier, -) { - Text( - text = label, - style = PrezelTheme.typography.body3Medium, - color = PrezelTheme.colors.textMedium, - modifier = modifier, - maxLines = 1, - ) -} - -@Composable -private fun PrezelTextFieldSupportingText( - state: PrezelTextFieldState, - modifier: Modifier = Modifier, -) { - Text( - text = state.supportingText, - style = PrezelTheme.typography.body3Regular, - color = state.supportingTextColor(), - modifier = modifier, - maxLines = 1, - ) -} - @ThemePreview @Composable -private fun DefaultPrezelTextFieldPreview() { +private fun PrezelTextFieldPreview() { PrezelTheme { - PreviewScaffold { - SectionTitle(title = "Default / Disabled") + PreviewScaffold(verticalArrangement = Arrangement.spacedBy(8.dp)) { PreviewTextFieldItem( + label = "Interaction - Default / Feedback - Default", value = "", state = PrezelTextFieldState( interaction = PrezelTextFieldInteraction.DEFAULT, @@ -213,48 +194,32 @@ private fun DefaultPrezelTextFieldPreview() { ) PreviewTextFieldItem( + label = "Interaction - Disabled / Feedback - Default", value = "", state = PrezelTextFieldState( interaction = PrezelTextFieldInteraction.DISABLED, feedback = PrezelTextFieldFeedback.Default("헬퍼 메시지"), ), ) - } - } -} - -@ThemePreview -@Composable -private fun TypingPrezelTextFieldPreview() { - PrezelTheme { - PreviewScaffold { - SectionTitle(title = "Typing") PreviewTextFieldItem( - value = "입력 중...", + label = "Interaction - Typing / Feedback - Default", + value = "typing...", state = PrezelTextFieldState( interaction = PrezelTextFieldInteraction.TYPING, feedback = PrezelTextFieldFeedback.Default("헬퍼 메시지"), ), ) - } - } -} - -@ThemePreview -@Composable -private fun TypedPrezelTextFieldPreview() { - PrezelTheme { - PreviewScaffold { - SectionTitle(title = "Typed") PreviewTextFieldItem( - value = "입력함", + label = "Interaction - Typed / Feedback - Default", + value = "typed", state = PrezelTextFieldState( interaction = PrezelTextFieldInteraction.TYPED, feedback = PrezelTextFieldFeedback.Default("헬퍼 메시지"), ), ) PreviewTextFieldItem( - value = "입력함", + label = "Interaction - Typed / Feedback - Good", + value = "typed", state = PrezelTextFieldState( interaction = PrezelTextFieldInteraction.TYPED, feedback = PrezelTextFieldFeedback.Good("헬퍼 메시지"), @@ -262,7 +227,8 @@ private fun TypedPrezelTextFieldPreview() { ) PreviewTextFieldItem( - value = "입력함", + label = "Interaction - Typed / Feedback - Bad", + value = "typed", state = PrezelTextFieldState( interaction = PrezelTextFieldInteraction.TYPED, feedback = PrezelTextFieldFeedback.Bad("헬퍼 메시지"), @@ -312,6 +278,7 @@ private fun MainPrezelTextFieldPreview() { @Composable private fun PreviewTextFieldItem( + label: String, value: String, state: PrezelTextFieldState, modifier: Modifier = Modifier, @@ -319,8 +286,8 @@ private fun PreviewTextFieldItem( PrezelTextField( value = value, onValueChange = {}, - placeholder = "플레이스홀더", - label = "레이블", + placeholder = "Placeholder", + label = label, state = state, modifier = modifier, onFocusChange = {}, diff --git a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextFieldState.kt b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextFieldState.kt index b78e6df3..5e72a4aa 100644 --- a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextFieldState.kt +++ b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/PrezelTextFieldState.kt @@ -1,7 +1,6 @@ package com.team.prezel.core.designsystem.component.textfield import androidx.compose.foundation.BorderStroke -import androidx.compose.foundation.isSystemInDarkTheme import androidx.compose.runtime.Composable import androidx.compose.runtime.Immutable import androidx.compose.runtime.LaunchedEffect @@ -15,7 +14,6 @@ import androidx.compose.runtime.snapshotFlow import androidx.compose.ui.graphics.Color import androidx.compose.ui.unit.dp import com.team.prezel.core.designsystem.foundation.color.PrezelColors -import com.team.prezel.core.designsystem.theme.PrezelColorScheme import com.team.prezel.core.designsystem.theme.PrezelTheme import kotlinx.coroutines.FlowPreview import kotlinx.coroutines.flow.collectLatest @@ -131,18 +129,12 @@ data class PrezelTextFieldState( * 다크 모드 여부에 따라 일부 색상이 달라질 수 있습니다. */ @Composable - internal fun textColor( - colors: PrezelColors = PrezelTheme.colors, - isDarkTheme: Boolean = isSystemInDarkTheme(), - ): Color = + internal fun textColor(colors: PrezelColors = PrezelTheme.colors): Color = when (interaction) { - PrezelTextFieldInteraction.DEFAULT -> colors.textSmall PrezelTextFieldInteraction.DISABLED -> colors.textDisabled + PrezelTextFieldInteraction.DEFAULT -> colors.textSmall PrezelTextFieldInteraction.TYPING -> colors.textLarge - PrezelTextFieldInteraction.TYPED -> when (feedback) { - is PrezelTextFieldFeedback.Default -> colors.textRegular - else -> if (isDarkTheme) PrezelColorScheme.Light.textLarge else colors.textLarge - } + PrezelTextFieldInteraction.TYPED -> colors.textLarge } /** diff --git a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/component/PrezelTextFieldLabel.kt b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/component/PrezelTextFieldLabel.kt new file mode 100644 index 00000000..2d4c46a9 --- /dev/null +++ b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/component/PrezelTextFieldLabel.kt @@ -0,0 +1,31 @@ +package com.team.prezel.core.designsystem.component.textfield.component + +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.dp +import com.team.prezel.core.designsystem.preview.ThemePreview +import com.team.prezel.core.designsystem.theme.PrezelTheme + +@Composable +internal fun PrezelTextFieldLabel( + label: String, + modifier: Modifier = Modifier, +) { + Text( + text = label, + style = PrezelTheme.typography.body3Medium, + color = PrezelTheme.colors.textMedium, + modifier = modifier, + maxLines = 1, + ) +} + +@ThemePreview +@Composable +private fun PrezelTextFieldLabelPreview() { + PrezelTheme { + PrezelTextFieldLabel(label = "Label", modifier = Modifier.padding(8.dp)) + } +} diff --git a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/component/PrezelTextFieldPlaceholder.kt b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/component/PrezelTextFieldPlaceholder.kt new file mode 100644 index 00000000..c32ac194 --- /dev/null +++ b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/component/PrezelTextFieldPlaceholder.kt @@ -0,0 +1,40 @@ +package com.team.prezel.core.designsystem.component.textfield.component + +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.text.style.LineHeightStyle +import androidx.compose.ui.unit.dp +import com.team.prezel.core.designsystem.preview.ThemePreview +import com.team.prezel.core.designsystem.theme.PrezelTheme + +@Composable +internal fun PrezelTextFieldPlaceholder( + placeholder: String, + modifier: Modifier = Modifier, +) { + Text( + text = placeholder, + maxLines = 1, + style = PrezelTheme.typography.body2Regular.copy( + lineHeightStyle = LineHeightStyle( + alignment = LineHeightStyle.Alignment.Center, + trim = LineHeightStyle.Trim.None, + ), + ), + color = PrezelTheme.colors.textSmall, + modifier = modifier, + ) +} + +@ThemePreview +@Composable +private fun PrezelTextFieldPlaceholderPreview() { + PrezelTheme { + PrezelTextFieldPlaceholder( + placeholder = "Placeholder", + modifier = Modifier.padding(16.dp), + ) + } +} diff --git a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/component/PrezelTextFieldSupportingText.kt b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/component/PrezelTextFieldSupportingText.kt new file mode 100644 index 00000000..e953fd62 --- /dev/null +++ b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/textfield/component/PrezelTextFieldSupportingText.kt @@ -0,0 +1,60 @@ +package com.team.prezel.core.designsystem.component.textfield.component + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.dp +import com.team.prezel.core.designsystem.component.textfield.PrezelTextFieldFeedback +import com.team.prezel.core.designsystem.component.textfield.PrezelTextFieldInteraction +import com.team.prezel.core.designsystem.component.textfield.PrezelTextFieldState +import com.team.prezel.core.designsystem.preview.ThemePreview +import com.team.prezel.core.designsystem.theme.PrezelTheme + +@Composable +internal fun PrezelTextFieldSupportingText( + state: PrezelTextFieldState, + modifier: Modifier = Modifier, +) { + Text( + text = state.supportingText, + style = PrezelTheme.typography.body3Regular, + color = state.supportingTextColor(), + modifier = modifier, + maxLines = 1, + ) +} + +@ThemePreview +@Composable +private fun PrezelTextFieldSupportingTextPreview() { + PrezelTheme { + Column( + modifier = Modifier.padding(8.dp), + verticalArrangement = Arrangement.spacedBy(8.dp), + ) { + PrezelTextFieldSupportingText( + state = PrezelTextFieldState( + interaction = PrezelTextFieldInteraction.TYPED, + feedback = PrezelTextFieldFeedback.Default("헬퍼 메시지"), + ), + ) + + PrezelTextFieldSupportingText( + state = PrezelTextFieldState( + interaction = PrezelTextFieldInteraction.TYPED, + feedback = PrezelTextFieldFeedback.Bad("헬퍼 메시지"), + ), + ) + + PrezelTextFieldSupportingText( + state = PrezelTextFieldState( + interaction = PrezelTextFieldInteraction.TYPED, + feedback = PrezelTextFieldFeedback.Good("헬퍼 메시지"), + ), + ) + } + } +} diff --git a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/preview/PreviewComponent.kt b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/preview/PreviewComponent.kt index 2accea96..f91eaf85 100644 --- a/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/preview/PreviewComponent.kt +++ b/Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/preview/PreviewComponent.kt @@ -25,7 +25,10 @@ import com.team.prezel.core.designsystem.theme.PrezelTheme import kotlinx.collections.immutable.ImmutableList @Composable -internal fun PreviewScaffold(content: @Composable () -> Unit) { +internal fun PreviewScaffold( + verticalArrangement: Arrangement.Vertical = Arrangement.spacedBy(16.dp), + content: @Composable () -> Unit, +) { Scaffold( containerColor = PrezelTheme.colors.bgRegular, contentColor = PrezelTheme.colors.textLarge, @@ -36,7 +39,7 @@ internal fun PreviewScaffold(content: @Composable () -> Unit) { .fillMaxSize() .verticalScroll(rememberScrollState()) .padding(16.dp), - verticalArrangement = Arrangement.spacedBy(16.dp), + verticalArrangement = verticalArrangement, ) { content() } diff --git a/Prezel/detekt-config.yml b/Prezel/detekt-config.yml index fb220f26..b7597b2f 100644 --- a/Prezel/detekt-config.yml +++ b/Prezel/detekt-config.yml @@ -33,7 +33,10 @@ complexity: active: true LongMethod: active: true - threshold: 40 + threshold: 50 + ignoreAnnotated: + - Preview + - ThemePreview LongParameterList: active: false CyclomaticComplexMethod: