Skip to content

Commit 906e926

Browse files
florentmaitreflorentmaitre
committed
Add rich text to control item demos
1 parent b5a15fe commit 906e926

10 files changed

Lines changed: 181 additions & 75 deletions

File tree

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

Lines changed: 35 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,8 @@ import androidx.compose.ui.Modifier
2020
import androidx.compose.ui.tooling.preview.PreviewLightDark
2121
import com.orange.ouds.app.ui.components.controlitem.ControlItemCustomizations
2222
import com.orange.ouds.app.ui.components.controlitem.controlItemArguments
23-
import com.orange.ouds.app.ui.components.controlitem.getControlItemIcon
23+
import com.orange.ouds.app.ui.components.controlitem.controlItemIcon
24+
import com.orange.ouds.app.ui.components.controlitem.controlItemError
2425
import com.orange.ouds.app.ui.components.onClickArgument
2526
import com.orange.ouds.app.ui.utilities.Code
2627
import com.orange.ouds.app.ui.utilities.LocalThemeDrawableResources
@@ -30,6 +31,8 @@ import com.orange.ouds.app.ui.utilities.composable.DemoScreen
3031
import com.orange.ouds.core.component.OudsCheckboxItem
3132
import com.orange.ouds.core.component.OudsTriStateCheckboxItem
3233
import com.orange.ouds.core.component.common.OudsError
34+
import com.orange.ouds.core.component.common.text.buildOudsAnnotatedErrorMessage
35+
import com.orange.ouds.core.component.common.text.withStrong
3336
import com.orange.ouds.core.theme.OudsTheme
3437
import com.orange.ouds.theme.OudsVersion
3538

@@ -71,13 +74,13 @@ private fun CheckboxItemDemoContent(state: CheckboxItemDemoState) {
7174
},
7275
label = label,
7376
description = description,
74-
icon = getControlItemIcon(this),
77+
icon = controlItemIcon(this),
7578
edgeToEdge = edgeToEdge,
7679
divider = divider,
7780
reversed = reversed,
7881
enabled = enabled,
7982
readOnly = readOnly,
80-
error = if (error) OudsError(if (isLastItem) errorMessage else "") else null,
83+
error = checkboxItemError(state = this, isLastItem = isLastItem),
8184
constrainedMaxWidth = constrainedMaxWidth
8285
)
8386
}
@@ -106,13 +109,13 @@ private fun IndeterminateCheckboxItemDemoContent(state: CheckboxItemDemoState) {
106109
},
107110
label = label,
108111
description = description,
109-
icon = getControlItemIcon(this),
112+
icon = controlItemIcon(this),
110113
edgeToEdge = edgeToEdge,
111114
divider = divider,
112115
reversed = reversed,
113116
enabled = enabled,
114117
readOnly = readOnly,
115-
error = if (error) OudsError(if (isLastItem) errorMessage else "") else null,
118+
error = checkboxItemError(state = this, isLastItem = isLastItem,),
116119
constrainedMaxWidth = constrainedMaxWidth
117120
)
118121
}
@@ -127,24 +130,39 @@ private fun CheckboxItemDemoColumn(edgeToEdge: Boolean, content: @Composable ()
127130
}
128131
}
129132

133+
@Composable
134+
private fun checkboxItemError(state: CheckboxItemDemoState, isLastItem: Boolean): OudsError? {
135+
return controlItemError(
136+
state = state,
137+
isLastItem = isLastItem,
138+
annotatedMessage = buildOudsAnnotatedErrorMessage {
139+
append("You must select at ")
140+
withStrong { append("least one service") }
141+
append(" to continue.")
142+
})
143+
}
144+
130145
private fun Code.Builder.checkboxItemDemoCodeSnippet(state: CheckboxItemDemoState, indeterminate: Boolean, themeDrawableResources: ThemeDrawableResources) {
131146
val functionName = if (indeterminate) "OudsTriStateCheckboxItem" else "OudsCheckboxItem"
132147
val lambdaCommentText = "Change state"
133-
comment("First checkbox item")
134148
with(state) {
135-
functionCall(functionName) {
136-
if (indeterminate) {
137-
typedArgument("state", toggleableStateValues.first)
138-
onClickArgument {
139-
comment(lambdaCommentText)
140-
}
141-
} else {
142-
typedArgument("checked", checkedValues.first)
143-
lambdaArgument("onCheckedChange") {
144-
comment(lambdaCommentText)
149+
repeat(CheckboxIdentifier.entries.count()) { index ->
150+
functionCall(functionName) {
151+
if (indeterminate) {
152+
val value = if (index == 0) toggleableStateValues.first else toggleableStateValues.second
153+
typedArgument("state", value)
154+
onClickArgument {
155+
comment(lambdaCommentText)
156+
}
157+
} else {
158+
val value = if (index == 0) checkedValues.first else checkedValues.second
159+
typedArgument("checked", value)
160+
lambdaArgument("onCheckedChange") {
161+
comment(lambdaCommentText)
162+
}
145163
}
164+
controlItemArguments(state, themeDrawableResources, index == CheckboxIdentifier.entries.lastIndex)
146165
}
147-
controlItemArguments(state, themeDrawableResources)
148166
}
149167
}
150168
}

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

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ fun rememberCheckboxItemDemoState(
4141
label: String = stringResource(id = R.string.app_components_common_label_label),
4242
description: String? = null,
4343
constrainedMaxWidth: Boolean = false,
44+
annotatedText: Boolean = false
4445
) = rememberSaveable(
4546
checkedValues,
4647
toggleableStateValues,
@@ -55,6 +56,7 @@ fun rememberCheckboxItemDemoState(
5556
label,
5657
description,
5758
constrainedMaxWidth,
59+
annotatedText,
5860
saver = CheckboxItemDemoState.Saver
5961
) {
6062
CheckboxItemDemoState(
@@ -70,7 +72,8 @@ fun rememberCheckboxItemDemoState(
7072
errorMessage,
7173
label,
7274
description,
73-
constrainedMaxWidth
75+
constrainedMaxWidth,
76+
annotatedText
7477
)
7578
}
7679

@@ -87,8 +90,9 @@ class CheckboxItemDemoState(
8790
errorMessage: String,
8891
label: String,
8992
description: String?,
90-
constrainedMaxWidth: Boolean
91-
) : ControlItemDemoState(icon, edgeToEdge, divider, reversed, enabled, readOnly, error, errorMessage, label, description, constrainedMaxWidth) {
93+
constrainedMaxWidth: Boolean,
94+
annotatedText: Boolean
95+
) : ControlItemDemoState(icon, edgeToEdge, divider, reversed, enabled, readOnly, error, errorMessage, label, description, constrainedMaxWidth, annotatedText) {
9296

9397
companion object {
9498
val Saver = listSaver(
@@ -116,7 +120,8 @@ class CheckboxItemDemoState(
116120
errorMessage,
117121
label,
118122
description,
119-
constrainedMaxWidth
123+
constrainedMaxWidth,
124+
annotatedText
120125
)
121126
}
122127
}

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

Lines changed: 43 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,8 @@ import com.orange.ouds.app.ui.utilities.composable.CustomizationSwitchItem
3030
import com.orange.ouds.app.ui.utilities.composable.CustomizationTextInput
3131
import com.orange.ouds.app.ui.utilities.rememberUntintedIconPainter
3232
import com.orange.ouds.core.component.OudsControlItemIcon
33+
import com.orange.ouds.core.component.common.OudsError
34+
import com.orange.ouds.core.component.common.text.OudsAnnotatedErrorMessage
3335

3436
data class ControlItemCustomization(val index: Int, val content: @Composable () -> Unit)
3537

@@ -48,7 +50,8 @@ fun ControlItemCustomizations(state: ControlItemDemoState, extraCustomizations:
4850
{ ControlItemErrorMessageCustomization(state = state) },
4951
{ ControlItemLabelCustomization(state = state) },
5052
{ ControlItemDescriptionCustomization(state = state) },
51-
{ ControlItemConstrainedMaxWidthCustomization(state = state) }
53+
{ ControlItemConstrainedMaxWidthCustomization(state = state) },
54+
{ ControlItemAnnotatedTextCustomization(state = state) }
5255
)
5356
extraCustomizations.forEach { (index, content) ->
5457
customizations.add(minOf(index, customizations.count()), content)
@@ -61,8 +64,8 @@ private fun ControlItemIconCustomization(state: ControlItemDemoState) {
6164
with(state) {
6265
CustomizationFilterChips(
6366
applyTopPadding = false,
64-
label = stringResource(R.string.app_components_common_icon_tech),
65-
chipLabels = ControlItemDemoState.Icon.entries.map { stringResource(it.labelRes) },
67+
label = stringResource(id = R.string.app_components_common_icon_tech),
68+
chipLabels = ControlItemDemoState.Icon.entries.map { stringResource(id = it.labelRes) },
6669
selectedChipIndex = ControlItemDemoState.Icon.entries.indexOf(icon),
6770
onSelectionChange = { index -> icon = ControlItemDemoState.Icon.entries[index] }
6871
)
@@ -73,7 +76,7 @@ private fun ControlItemIconCustomization(state: ControlItemDemoState) {
7376
private fun ControlItemEdgeToEdgeCustomization(state: ControlItemDemoState) {
7477
with(state) {
7578
CustomizationSwitchItem(
76-
label = stringResource(R.string.app_components_controlItem_edgeToEdge_tech),
79+
label = stringResource(id = R.string.app_components_controlItem_edgeToEdge_tech),
7780
checked = edgeToEdge,
7881
onCheckedChange = { edgeToEdge = it },
7982
)
@@ -85,7 +88,7 @@ private fun ControlItemEdgeToEdgeCustomization(state: ControlItemDemoState) {
8588
private fun ControlItemDividerCustomization(state: ControlItemDemoState) {
8689
with(state) {
8790
CustomizationSwitchItem(
88-
label = stringResource(R.string.app_components_controlItem_divider_tech),
91+
label = stringResource(id = R.string.app_components_controlItem_divider_tech),
8992
checked = divider,
9093
onCheckedChange = { divider = it },
9194
)
@@ -96,7 +99,7 @@ private fun ControlItemDividerCustomization(state: ControlItemDemoState) {
9699
private fun ControlItemReversedCustomization(state: ControlItemDemoState) {
97100
with(state) {
98101
CustomizationSwitchItem(
99-
label = stringResource(R.string.app_components_controlItem_reversed_tech),
102+
label = stringResource(id = R.string.app_components_controlItem_reversed_tech),
100103
checked = reversed,
101104
onCheckedChange = { reversed = it },
102105
)
@@ -107,7 +110,7 @@ private fun ControlItemReversedCustomization(state: ControlItemDemoState) {
107110
private fun ControlItemEnabledCustomization(state: ControlItemDemoState) {
108111
with(state) {
109112
CustomizationSwitchItem(
110-
label = stringResource(R.string.app_common_enabled_tech),
113+
label = stringResource(id = R.string.app_common_enabled_tech),
111114
checked = enabled,
112115
onCheckedChange = { enabled = it },
113116
enabled = enabledSwitchEnabled
@@ -119,7 +122,7 @@ private fun ControlItemEnabledCustomization(state: ControlItemDemoState) {
119122
private fun ControlItemReadOnlyCustomization(state: ControlItemDemoState) {
120123
with(state) {
121124
CustomizationSwitchItem(
122-
label = stringResource(R.string.app_components_common_readOnly_tech),
125+
label = stringResource(id = R.string.app_components_common_readOnly_tech),
123126
checked = readOnly,
124127
onCheckedChange = { readOnly = it },
125128
enabled = readOnlySwitchEnabled
@@ -131,7 +134,7 @@ private fun ControlItemReadOnlyCustomization(state: ControlItemDemoState) {
131134
private fun ControlItemErrorCustomization(state: ControlItemDemoState) {
132135
with(state) {
133136
CustomizationSwitchItem(
134-
label = stringResource(R.string.app_components_common_error_tech),
137+
label = stringResource(id = R.string.app_components_common_error_tech),
135138
checked = error,
136139
onCheckedChange = { error = it },
137140
enabled = errorSwitchEnabled
@@ -144,10 +147,22 @@ private fun ControlItemErrorMessageCustomization(state: ControlItemDemoState) {
144147
with(state) {
145148
CustomizationTextInput(
146149
applyTopPadding = true,
147-
label = stringResource(R.string.app_components_common_errorMessage_tech),
150+
label = stringResource(id = R.string.app_components_common_errorMessage_tech),
148151
value = errorMessage,
149152
onValueChange = { value -> errorMessage = value },
150-
enabled = errorMessageTextInputEnabled
153+
enabled = errorMessageTextInputEnabled,
154+
helperText = stringResource(id = R.string.app_components_common_annotatedTextHelperText_tech)
155+
)
156+
}
157+
}
158+
159+
@Composable
160+
fun ControlItemAnnotatedTextCustomization(state: ControlItemDemoState) {
161+
with(state) {
162+
CustomizationSwitchItem(
163+
label = stringResource(id = R.string.app_components_common_annotatedText_tech),
164+
checked = annotatedText,
165+
onCheckedChange = { annotatedText = it }
151166
)
152167
}
153168
}
@@ -157,7 +172,7 @@ private fun ControlItemLabelCustomization(state: ControlItemDemoState) {
157172
with(state) {
158173
CustomizationTextInput(
159174
applyTopPadding = true,
160-
label = stringResource(R.string.app_components_common_label_tech),
175+
label = stringResource(id = R.string.app_components_common_label_tech),
161176
value = label,
162177
onValueChange = { value -> label = value }
163178
)
@@ -169,7 +184,7 @@ private fun ControlItemDescriptionCustomization(state: ControlItemDemoState) {
169184
with(state) {
170185
CustomizationTextInput(
171186
applyTopPadding = true,
172-
label = stringResource(R.string.app_components_common_description_tech),
187+
label = stringResource(id = R.string.app_components_common_description_tech),
173188
value = description.orEmpty(),
174189
onValueChange = { value -> description = value }
175190
)
@@ -180,22 +195,34 @@ private fun ControlItemDescriptionCustomization(state: ControlItemDemoState) {
180195
private fun ControlItemConstrainedMaxWidthCustomization(state: ControlItemDemoState) {
181196
with(state) {
182197
CustomizationSwitchItem(
183-
label = stringResource(R.string.app_components_common_constrainedMaxWidth_tech),
198+
label = stringResource(id = R.string.app_components_common_constrainedMaxWidth_tech),
184199
checked = constrainedMaxWidth,
185200
onCheckedChange = { constrainedMaxWidth = it },
186201
)
187202
}
188203
}
189204

190205
@Composable
191-
fun getControlItemIcon(state: ControlItemDemoState): OudsControlItemIcon? {
206+
fun controlItemIcon(state: ControlItemDemoState): OudsControlItemIcon? {
192207
return when (state.icon) {
193208
ControlItemDemoState.Icon.None -> null
194209
ControlItemDemoState.Icon.Tinted -> OudsControlItemIcon(painter = painterResource(id = LocalThemeDrawableResources.current.tipsAndTricks))
195210
ControlItemDemoState.Icon.Untinted -> OudsControlItemIcon(painter = rememberUntintedIconPainter(), tinted = false)
196211
}
197212
}
198213

214+
@Composable
215+
fun controlItemError(state: ControlItemDemoState, isLastItem: Boolean, annotatedMessage: OudsAnnotatedErrorMessage): OudsError? {
216+
return with(state) {
217+
when {
218+
error && !isLastItem -> OudsError("")
219+
error && !annotatedText -> OudsError(errorMessage)
220+
error && annotatedText -> OudsError(annotatedMessage)
221+
else -> null
222+
}
223+
}
224+
}
225+
199226
fun FunctionCall.Builder.controlItemArguments(state: ControlItemDemoState, themeDrawableResources: ThemeDrawableResources, hasErrorMessage: Boolean = false) =
200227
with(state) {
201228
labelArgument(label)
@@ -208,6 +235,6 @@ fun FunctionCall.Builder.controlItemArguments(state: ControlItemDemoState, theme
208235
if (reversed) typedArgument("reversed", reversed)
209236
if (!enabled) enabledArgument(enabled)
210237
if (readOnly) readOnlyArgument(readOnly)
211-
if (error) errorArgument(if (hasErrorMessage) errorMessage else "")
238+
if (error) errorArgument(if (hasErrorMessage) errorMessage else "", hasErrorMessage && annotatedText)
212239
if (constrainedMaxWidth) constrainedMaxWidthArgument(constrainedMaxWidth)
213240
}

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

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,8 @@ open class ControlItemDemoState(
3030
errorMessage: String,
3131
label: String,
3232
description: String?,
33-
constrainedMaxWidth: Boolean
33+
constrainedMaxWidth: Boolean,
34+
annotatedText: Boolean
3435
) {
3536

3637
companion object {
@@ -50,6 +51,7 @@ open class ControlItemDemoState(
5051
label,
5152
description,
5253
constrainedMaxWidth,
54+
annotatedText
5355
)
5456
}
5557
},
@@ -65,7 +67,8 @@ open class ControlItemDemoState(
6567
list[7] as String,
6668
list[8] as String,
6769
list[9] as String?,
68-
list[10] as Boolean
70+
list[10] as Boolean,
71+
list[11] as Boolean
6972
)
7073
}
7174
)
@@ -83,6 +86,16 @@ open class ControlItemDemoState(
8386
var label: String by mutableStateOf(label)
8487
var description: String? by mutableStateOf(description)
8588

89+
private var _annotatedText: Boolean by mutableStateOf(annotatedText)
90+
var annotatedText: Boolean
91+
get() = _annotatedText
92+
set(value) {
93+
_annotatedText = value
94+
if (value) {
95+
error = true
96+
}
97+
}
98+
8699
val enabledSwitchEnabled: Boolean
87100
get() = !error
88101

@@ -93,7 +106,7 @@ open class ControlItemDemoState(
93106
get() = enabled && !readOnly
94107

95108
val errorMessageTextInputEnabled: Boolean
96-
get() = error
109+
get() = error && !annotatedText
97110

98111
enum class Icon(@StringRes val labelRes: Int) {
99112
None(R.string.app_components_common_none_tech),

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ private fun RadioButtonDemoContent(state: RadioButtonDemoState) {
7676
horizontalArrangement = Arrangement.Center
7777
) {
7878
with(state) {
79-
RadioButtonDemoState.values.forEach { value ->
79+
RadioButtonDemoState.Values.forEach { value ->
8080
val contentDescription = stringResource(R.string.app_components_radioButton_radioButton_a11y, value.toString())
8181
OudsRadioButton(
8282
modifier = Modifier.semantics {
@@ -97,7 +97,7 @@ private fun Code.Builder.radioButtonDemoCodeSnippet(state: RadioButtonDemoState)
9797
with(state) {
9898
comment("First radio button")
9999
functionCall("OudsRadioButton") {
100-
typedArgument("selected", selectedValue == RadioButtonDemoState.values.first())
100+
typedArgument("selected", selectedValue == RadioButtonDemoState.Values.first())
101101
onClickArgument {
102102
comment("Change state")
103103
}

0 commit comments

Comments
 (0)