Skip to content

Commit 58374a9

Browse files
paulineapaulinea
authored
feat: create component - text area (#1178)
1 parent 4e1385f commit 58374a9

104 files changed

Lines changed: 1856 additions & 49 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎app/src/main/java/com/orange/ouds/app/ui/components/Component.kt‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ import com.orange.ouds.app.ui.components.switch.SwitchDemoScreen
4040
import com.orange.ouds.app.ui.components.switch.SwitchItemDemoScreen
4141
import com.orange.ouds.app.ui.components.tag.InputTagDemoScreen
4242
import com.orange.ouds.app.ui.components.tag.TagDemoScreen
43+
import com.orange.ouds.app.ui.components.textarea.TextAreaDemoScreen
4344
import com.orange.ouds.app.ui.components.textinput.TextInputDemoScreen
4445
import com.orange.ouds.app.ui.components.topappbar.TopAppBarDemoScreen
4546
import com.orange.ouds.app.ui.utilities.previewCompatibleClass
@@ -180,6 +181,13 @@ sealed class Component(
180181
listOf(Variant.Tag, Variant.InputTag)
181182
)
182183

184+
data object TextArea : Component(
185+
R.string.app_components_textArea_tech,
186+
R.string.app_components_textArea_description_text,
187+
{ TextAreaIllustration() },
188+
demoScreen = { TextAreaDemoScreen() }
189+
)
190+
183191
data object TextInput : Component(
184192
R.string.app_components_textInput_tech,
185193
R.string.app_components_textInput_description_text,

‎app/src/main/java/com/orange/ouds/app/ui/components/ComponentIllustrations.kt‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@ import com.orange.ouds.core.component.OudsRadioButton
6666
import com.orange.ouds.core.component.OudsSwitch
6767
import com.orange.ouds.core.component.OudsTag
6868
import com.orange.ouds.core.component.OudsTagStatus
69+
import com.orange.ouds.core.component.OudsTextArea
6970
import com.orange.ouds.core.component.OudsTextInput
7071
import com.orange.ouds.core.component.OudsTopAppBar
7172
import com.orange.ouds.core.component.OudsTopAppBarAction
@@ -271,6 +272,16 @@ fun TagIllustration() = ComponentIllustration {
271272
OudsTag(label = stringResource(id = R.string.app_components_common_label_label), status = OudsTagStatus.Positive())
272273
}
273274

275+
@Composable
276+
fun TextAreaIllustration() = ComponentIllustration {
277+
OudsTextArea(
278+
modifier = Modifier.padding(horizontal = 12.dp),
279+
textFieldState = rememberTextFieldState(),
280+
label = stringResource(id = R.string.app_components_common_label_label),
281+
helperText = stringResource(id = R.string.app_components_textAreaHelperText_label)
282+
)
283+
}
284+
274285
@Composable
275286
fun TextInputIllustration() = ComponentIllustration {
276287
OudsTextInput(

‎app/src/main/java/com/orange/ouds/app/ui/components/textarea/TextAreaDemoScreen.kt‎

Lines changed: 178 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,178 @@
1+
/*
2+
* Software Name: OUDS Android
3+
* SPDX-FileCopyrightText: Copyright (c) Orange SA
4+
* SPDX-License-Identifier: MIT
5+
*
6+
* This software is distributed under the MIT license,
7+
* the text of which is available at https://opensource.org/license/MIT/
8+
* or see the "LICENSE" file for more details.
9+
*
10+
* Software description: Android library of reusable graphical components
11+
*/
12+
13+
package com.orange.ouds.app.ui.components.textarea
14+
15+
import androidx.compose.runtime.Composable
16+
import androidx.compose.ui.platform.LocalFocusManager
17+
import androidx.compose.ui.res.stringResource
18+
import androidx.compose.ui.tooling.preview.PreviewLightDark
19+
import com.orange.ouds.app.R
20+
import com.orange.ouds.app.ui.components.Component
21+
import com.orange.ouds.app.ui.components.constrainedMaxWidthArgument
22+
import com.orange.ouds.app.ui.components.enabledArgument
23+
import com.orange.ouds.app.ui.components.errorArgument
24+
import com.orange.ouds.app.ui.components.labelArgument
25+
import com.orange.ouds.app.ui.components.onClickArgument
26+
import com.orange.ouds.app.ui.components.readOnlyArgument
27+
import com.orange.ouds.app.ui.utilities.Code
28+
import com.orange.ouds.app.ui.utilities.composable.AppPreview
29+
import com.orange.ouds.app.ui.utilities.composable.CustomizationSwitchItem
30+
import com.orange.ouds.app.ui.utilities.composable.CustomizationTextInput
31+
import com.orange.ouds.app.ui.utilities.composable.DemoScreen
32+
import com.orange.ouds.core.component.OudsTextArea
33+
import com.orange.ouds.core.component.OudsTextInputHelperLink
34+
import com.orange.ouds.core.component.OudsTextInputLoader
35+
import com.orange.ouds.core.component.common.OudsError
36+
import com.orange.ouds.theme.OudsVersion
37+
38+
@Composable
39+
fun TextAreaDemoScreen() {
40+
val state = rememberTextAreaDemoState()
41+
DemoScreen(
42+
description = stringResource(id = Component.TextArea.descriptionRes),
43+
bottomSheetContent = { TextAreaDemoBottomSheetContent(state = state) },
44+
codeSnippet = { textAreaDemoCodeSnippet(state = state) },
45+
demoContent = { TextAreaDemoContent(state = state) },
46+
version = OudsVersion.Component.TextArea
47+
)
48+
}
49+
50+
@Composable
51+
private fun TextAreaDemoBottomSheetContent(state: TextAreaDemoState) {
52+
with(state) {
53+
CustomizationSwitchItem(
54+
label = stringResource(R.string.app_components_common_outlined_tech),
55+
checked = outlined,
56+
onCheckedChange = { outlined = it },
57+
)
58+
CustomizationSwitchItem(
59+
label = stringResource(R.string.app_components_common_loader_tech),
60+
checked = hasLoader,
61+
onCheckedChange = { hasLoader = it },
62+
enabled = loaderSwitchEnabled
63+
)
64+
CustomizationSwitchItem(
65+
label = stringResource(R.string.app_common_enabled_tech),
66+
checked = enabled,
67+
onCheckedChange = { enabled = it },
68+
enabled = enabledSwitchEnabled
69+
)
70+
CustomizationSwitchItem(
71+
label = stringResource(R.string.app_components_common_readOnly_tech),
72+
checked = readOnly,
73+
onCheckedChange = { readOnly = it },
74+
enabled = readOnlySwitchEnabled
75+
)
76+
CustomizationSwitchItem(
77+
label = stringResource(R.string.app_components_common_error_tech),
78+
checked = error,
79+
onCheckedChange = { error = it },
80+
enabled = errorSwitchEnabled
81+
)
82+
CustomizationTextInput(
83+
applyTopPadding = true,
84+
label = stringResource(R.string.app_components_common_errorMessage_tech),
85+
value = errorMessage,
86+
onValueChange = { value -> errorMessage = value },
87+
enabled = errorMessageTextInputEnabled
88+
)
89+
CustomizationTextInput(
90+
applyTopPadding = true,
91+
label = stringResource(R.string.app_components_common_label_tech),
92+
value = label,
93+
onValueChange = { value -> label = value }
94+
)
95+
CustomizationTextInput(
96+
applyTopPadding = true,
97+
label = stringResource(R.string.app_components_common_placeholder_tech),
98+
value = placeholder,
99+
onValueChange = { value -> placeholder = value }
100+
)
101+
CustomizationTextInput(
102+
applyTopPadding = true,
103+
label = stringResource(R.string.app_components_common_helperText_tech),
104+
value = helperText,
105+
onValueChange = { value -> helperText = value }
106+
)
107+
CustomizationTextInput(
108+
applyTopPadding = true,
109+
label = stringResource(R.string.app_components_textInput_helperLink_tech),
110+
value = helperLink,
111+
onValueChange = { value -> helperLink = value }
112+
)
113+
CustomizationSwitchItem(
114+
label = stringResource(R.string.app_components_common_constrainedMaxWidth_tech),
115+
checked = constrainedMaxWidth,
116+
onCheckedChange = { constrainedMaxWidth = it },
117+
)
118+
}
119+
}
120+
121+
@Composable
122+
private fun TextAreaDemoContent(state: TextAreaDemoState) {
123+
val focusManager = LocalFocusManager.current
124+
with(state) {
125+
OudsTextArea(
126+
textFieldState = textFieldState,
127+
label = label,
128+
placeholder = placeholder,
129+
outlined = outlined,
130+
loader = if (hasLoader) OudsTextInputLoader(null) else null,
131+
enabled = enabled,
132+
readOnly = readOnly,
133+
error = if (error) OudsError(errorMessage) else null,
134+
helperText = helperText,
135+
helperLink = if (helperLink.isNotEmpty()) OudsTextInputHelperLink(text = helperLink, onClick = { }) else null,
136+
constrainedMaxWidth = constrainedMaxWidth,
137+
onKeyboardAction = { focusManager.clearFocus() }
138+
)
139+
}
140+
}
141+
142+
private fun Code.Builder.textAreaDemoCodeSnippet(state: TextAreaDemoState) {
143+
with(state) {
144+
functionCall("OudsTextArea") {
145+
functionCallArgument("textFieldState", "rememberTextFieldState")
146+
if (label.isNotEmpty()) labelArgument(label)
147+
if (placeholder.isNotEmpty()) typedArgument("placeholder", placeholder)
148+
typedArgument("outlined", outlined)
149+
if (hasLoader) {
150+
constructorCallArgument<OudsTextInputLoader>("loader") {
151+
typedArgument("progress", null)
152+
}
153+
}
154+
if (!enabled) enabledArgument(false)
155+
if (readOnly) readOnlyArgument(true)
156+
if (error) errorArgument(errorMessage)
157+
if (helperText.isNotEmpty()) typedArgument("helperText", helperText)
158+
if (helperLink.isNotEmpty()) {
159+
constructorCallArgument<OudsTextInputHelperLink>("helperLink") {
160+
typedArgument("text", helperLink)
161+
onClickArgument {
162+
comment("Do something")
163+
}
164+
}
165+
}
166+
if (constrainedMaxWidth) constrainedMaxWidthArgument(true)
167+
lambdaArgument("onKeyboardAction") {
168+
functionCall("focusManager.clearFocus")
169+
}
170+
}
171+
}
172+
}
173+
174+
@PreviewLightDark
175+
@Composable
176+
private fun PreviewTextAreaDemoScreen() = AppPreview {
177+
TextAreaDemoScreen()
178+
}

‎app/src/main/java/com/orange/ouds/app/ui/components/textarea/TextAreaDemoState.kt‎

Lines changed: 164 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
/*
2+
* Software Name: OUDS Android
3+
* SPDX-FileCopyrightText: Copyright (c) Orange SA
4+
* SPDX-License-Identifier: MIT
5+
*
6+
* This software is distributed under the MIT license,
7+
* the text of which is available at https://opensource.org/license/MIT/
8+
* or see the "LICENSE" file for more details.
9+
*
10+
* Software description: Android library of reusable graphical components
11+
*/
12+
13+
package com.orange.ouds.app.ui.components.textarea
14+
15+
import androidx.compose.foundation.text.input.TextFieldState
16+
import androidx.compose.runtime.Composable
17+
import androidx.compose.runtime.getValue
18+
import androidx.compose.runtime.mutableStateOf
19+
import androidx.compose.runtime.saveable.listSaver
20+
import androidx.compose.runtime.saveable.rememberSaveable
21+
import androidx.compose.runtime.setValue
22+
import androidx.compose.ui.res.stringResource
23+
import com.orange.ouds.app.R
24+
25+
@Composable
26+
fun rememberTextAreaDemoState(
27+
textFieldState: TextFieldState = TextFieldState(),
28+
label: String = stringResource(id = R.string.app_components_common_label_label),
29+
placeholder: String = "",
30+
outlined: Boolean = false,
31+
hasLoader: Boolean = false,
32+
enabled: Boolean = true,
33+
readOnly: Boolean = false,
34+
error: Boolean = false,
35+
errorMessage: String = stringResource(id = R.string.app_components_common_errorMessage_label),
36+
helperText: String = "",
37+
helperLink: String = "",
38+
constrainedMaxWidth: Boolean = false
39+
) = rememberSaveable(
40+
textFieldState,
41+
label,
42+
placeholder,
43+
outlined,
44+
enabled,
45+
readOnly,
46+
hasLoader,
47+
error,
48+
errorMessage,
49+
helperText,
50+
helperLink,
51+
constrainedMaxWidth,
52+
saver = TextAreaDemoState.Saver
53+
) {
54+
TextAreaDemoState(
55+
textFieldState,
56+
label,
57+
placeholder,
58+
outlined,
59+
hasLoader,
60+
enabled,
61+
readOnly,
62+
error,
63+
errorMessage,
64+
helperText,
65+
helperLink,
66+
constrainedMaxWidth
67+
)
68+
}
69+
70+
class TextAreaDemoState(
71+
textFieldState: TextFieldState,
72+
label: String,
73+
placeholder: String,
74+
outlined: Boolean,
75+
hasLoader: Boolean,
76+
enabled: Boolean,
77+
readOnly: Boolean,
78+
error: Boolean,
79+
errorMessage: String,
80+
helperText: String,
81+
helperLink: String,
82+
constrainedMaxWidth: Boolean
83+
) {
84+
85+
companion object {
86+
87+
val Saver = listSaver(
88+
save = { state ->
89+
with(state) {
90+
listOf(
91+
with(TextFieldState.Saver) { save(textFieldState) },
92+
label,
93+
placeholder,
94+
outlined,
95+
hasLoader,
96+
enabled,
97+
readOnly,
98+
error,
99+
errorMessage,
100+
helperText,
101+
helperLink,
102+
constrainedMaxWidth
103+
)
104+
}
105+
},
106+
restore = { list: List<Any?> ->
107+
val textFieldState = list[0]?.let { TextFieldState.Saver.restore(it) }
108+
TextAreaDemoState(
109+
textFieldState as TextFieldState,
110+
list[1] as String,
111+
list[2] as String,
112+
list[3] as Boolean,
113+
list[4] as Boolean,
114+
list[5] as Boolean,
115+
list[6] as Boolean,
116+
list[7] as Boolean,
117+
list[8] as String,
118+
list[9] as String,
119+
list[10] as String,
120+
list[11] as Boolean
121+
)
122+
}
123+
)
124+
}
125+
126+
var textFieldState: TextFieldState by mutableStateOf(textFieldState)
127+
128+
var label: String by mutableStateOf(label)
129+
130+
var placeholder: String by mutableStateOf(placeholder)
131+
132+
var outlined: Boolean by mutableStateOf(outlined)
133+
134+
var error: Boolean by mutableStateOf(error)
135+
136+
var errorMessage: String by mutableStateOf(errorMessage)
137+
138+
var hasLoader: Boolean by mutableStateOf(hasLoader)
139+
140+
var enabled: Boolean by mutableStateOf(enabled)
141+
142+
var readOnly: Boolean by mutableStateOf(readOnly)
143+
144+
var helperText: String by mutableStateOf(helperText)
145+
146+
var helperLink: String by mutableStateOf(helperLink)
147+
148+
var constrainedMaxWidth: Boolean by mutableStateOf(constrainedMaxWidth)
149+
150+
val enabledSwitchEnabled: Boolean
151+
get() = !error && !hasLoader
152+
153+
val errorSwitchEnabled: Boolean
154+
get() = !readOnly && !hasLoader && enabled
155+
156+
val errorMessageTextInputEnabled: Boolean
157+
get() = error
158+
159+
val readOnlySwitchEnabled: Boolean
160+
get() = !error && !hasLoader
161+
162+
val loaderSwitchEnabled: Boolean
163+
get() = enabled && !readOnly && !error && textFieldState.text.isNotEmpty()
164+
}

‎app/src/main/java/com/orange/ouds/app/ui/components/textinput/TextInputDemoState.kt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ class TextInputDemoState(
114114
enabled,
115115
readOnly,
116116
error,
117-
this.errorMessage,
117+
errorMessage,
118118
prefix,
119119
suffix,
120120
helperText,

0 commit comments

Comments
 (0)