diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/BottomSheetHeaderScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/BottomSheetHeaderScreen.kt index 479ec64ae..b164a42be 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/BottomSheetHeaderScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/BottomSheetHeaderScreen.kt @@ -35,7 +35,7 @@ fun BottomSheetHeaderScreen() { }, ) } - Spacer(Modifier.size(Spacing.Spacing12)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Without Icon", TextColor.OnSurface) @@ -46,6 +46,8 @@ fun BottomSheetHeaderScreen() { description = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce convallis, urna vitae lacinia feugiat", ) } + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle("Without Icon, without subtitle", TextColor.OnSurface) Box(modifier = Modifier.border(Spacing.Spacing1, color = TextColor.OnDisabledSurface)) { @@ -54,6 +56,8 @@ fun BottomSheetHeaderScreen() { description = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce convallis, urna vitae lacinia feugiat", ) } + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle("Without Icon, subtitle or description", TextColor.OnSurface) Box(modifier = Modifier.border(Spacing.Spacing1, color = TextColor.OnDisabledSurface)) { @@ -61,6 +65,8 @@ fun BottomSheetHeaderScreen() { title = "Title", ) } + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle("With Icon, without subtitle or description", TextColor.OnSurface) Box(modifier = Modifier.border(Spacing.Spacing1, color = TextColor.OnDisabledSurface)) { diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/BottomSheetScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/BottomSheetScreen.kt deleted file mode 100644 index d89db1a0f..000000000 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/BottomSheetScreen.kt +++ /dev/null @@ -1,75 +0,0 @@ -package org.hisp.dhis.common.screens - -import androidx.compose.foundation.border -import androidx.compose.foundation.layout.Box -import androidx.compose.material.icons.Icons -import androidx.compose.material.icons.outlined.BookmarkBorder -import androidx.compose.material.icons.outlined.HelpOutline -import androidx.compose.material3.Icon -import androidx.compose.runtime.Composable -import androidx.compose.ui.Modifier -import org.hisp.dhis.mobile.ui.designsystem.component.BottomSheetHeader -import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer -import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle -import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing -import org.hisp.dhis.mobile.ui.designsystem.theme.SurfaceColor -import org.hisp.dhis.mobile.ui.designsystem.theme.TextColor - -@Composable -fun BottomSheetScreen() { - ColumnComponentContainer(title = "Bottom Sheet Header") { - SubTitle("With Icon", TextColor.OnSurface) - Box(modifier = Modifier.border(Spacing.Spacing1, color = TextColor.OnDisabledSurface)) { - BottomSheetHeader( - title = "Title", - subTitle = "Subtitle", - description = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce convallis, urna vitae lacinia feugiat", - icon = { - Icon( - imageVector = Icons.Outlined.BookmarkBorder, - contentDescription = "Button", - tint = SurfaceColor.Primary, - ) - }, - ) - } - SubTitle("Without Icon", TextColor.OnSurface) - - Box(modifier = Modifier.border(Spacing.Spacing1, color = TextColor.OnDisabledSurface)) { - BottomSheetHeader( - title = "Title", - subTitle = "Subtitle", - description = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce convallis, urna vitae lacinia feugiat", - ) - } - SubTitle("Without Icon, without subtitle", TextColor.OnSurface) - - Box(modifier = Modifier.border(Spacing.Spacing1, color = TextColor.OnDisabledSurface)) { - BottomSheetHeader( - title = "Title", - description = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce convallis, urna vitae lacinia feugiat", - ) - } - SubTitle("Without Icon, subtitle or description", TextColor.OnSurface) - - Box(modifier = Modifier.border(Spacing.Spacing1, color = TextColor.OnDisabledSurface)) { - BottomSheetHeader( - title = "Title", - ) - } - SubTitle("With Icon, without subtitle or description", TextColor.OnSurface) - - Box(modifier = Modifier.border(Spacing.Spacing1, color = TextColor.OnDisabledSurface)) { - BottomSheetHeader( - title = "Title", - icon = { - Icon( - imageVector = Icons.Outlined.HelpOutline, - contentDescription = "Button", - tint = SurfaceColor.Primary, - ) - }, - ) - } - } -} diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ButtonBlockScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ButtonBlockScreen.kt index 28a017733..280dbd4cf 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ButtonBlockScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ButtonBlockScreen.kt @@ -1,6 +1,8 @@ package org.hisp.dhis.common.screens +import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.size import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Add import androidx.compose.material3.Icon @@ -14,6 +16,7 @@ import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle import org.hisp.dhis.mobile.ui.designsystem.component.TextButtonSelector import org.hisp.dhis.mobile.ui.designsystem.component.Title import org.hisp.dhis.mobile.ui.designsystem.resource.provideStringResource +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing @Composable fun ButtonBlockScreen() { @@ -38,6 +41,8 @@ fun ButtonBlockScreen() { ) }, ) + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle("Two button style") ButtonBlock( primaryButton = { diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ButtonScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ButtonScreen.kt index b66875d76..e8639a98d 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ButtonScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ButtonScreen.kt @@ -27,7 +27,7 @@ fun ButtonScreen() { ButtonPreviewWithIcon("Label", ButtonStyle.FILLED, false) } - Spacer(Modifier.size(Spacing.Spacing12)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Outlined") RowComponentContainer() { ButtonPreview("Label") @@ -37,7 +37,7 @@ fun ButtonScreen() { ButtonPreviewWithIcon("Label") ButtonPreviewWithIcon("Label", ButtonStyle.OUTLINED, false) } - Spacer(Modifier.size(Spacing.Spacing12)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Text") RowComponentContainer() { @@ -48,6 +48,8 @@ fun ButtonScreen() { ButtonPreviewWithIcon("Label", ButtonStyle.TEXT) ButtonPreviewWithIcon("Label", ButtonStyle.TEXT, false) } + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle("Elevated") RowComponentContainer() { ButtonPreview("Label", ButtonStyle.ELEVATED) @@ -57,6 +59,8 @@ fun ButtonScreen() { ButtonPreviewWithIcon("Label", ButtonStyle.ELEVATED) ButtonPreviewWithIcon("Label", ButtonStyle.ELEVATED, false) } + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle("Tonal") RowComponentContainer() { ButtonPreview("Label", ButtonStyle.TONAL) @@ -66,6 +70,8 @@ fun ButtonScreen() { ButtonPreviewWithIcon("Label", ButtonStyle.TONAL) ButtonPreviewWithIcon("Label", ButtonStyle.TONAL, false) } + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle("Keyboard") RowComponentContainer() { ButtonPreview("Label", ButtonStyle.KEYBOARDKEY) diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/CheckboxScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/CheckboxScreen.kt index 716c18bd6..360be1b97 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/CheckboxScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/CheckboxScreen.kt @@ -1,7 +1,10 @@ package org.hisp.dhis.common.screens import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier import org.hisp.dhis.common.screens.previews.CheckboxPreview import org.hisp.dhis.common.screens.previews.TextCheckboxPreview import org.hisp.dhis.mobile.ui.designsystem.component.CheckBoxBlock @@ -9,6 +12,7 @@ import org.hisp.dhis.mobile.ui.designsystem.component.CheckBoxData import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.Orientation import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing @Composable fun CheckboxScreen() { @@ -46,6 +50,8 @@ fun CheckboxScreen() { TextCheckboxPreview(state2, true, option2) TextCheckboxPreview(state3, false, option3) TextCheckboxPreview(state4, enabled = false, text = option4) + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle( text = "Simple Check Box", ) @@ -57,10 +63,14 @@ fun CheckboxScreen() { CheckboxPreview(false, enabled = true) CheckboxPreview(false, enabled = false) } + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle( text = "Horizontal Check Box Block", ) CheckBoxBlock(Orientation.HORIZONTAL, checkBoxesStatesHorizontal) {} + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle( text = "Vertical Check Box Block", ) diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/FormShellsScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/FormShellsScreen.kt index 0dd5e04b2..9a88d7545 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/FormShellsScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/FormShellsScreen.kt @@ -38,7 +38,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Focused/Unfocused with content", TextColor.OnSurface) @@ -53,7 +53,7 @@ fun FormShellsScreen() { }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Error", TextColor.OnSurface) var inputValue3 by rememberSaveable { mutableStateOf("") } @@ -67,7 +67,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Error with content", TextColor.OnSurface) var inputValue4 by rememberSaveable { mutableStateOf("Input") } @@ -82,7 +82,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Disabled", TextColor.OnSurface) var inputValue5 by rememberSaveable { mutableStateOf("") } @@ -96,7 +96,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Disabled with content", TextColor.OnSurface) var inputValue6 by rememberSaveable { mutableStateOf("Input") } @@ -110,7 +110,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Required field", TextColor.OnSurface) var inputValue7 by rememberSaveable { mutableStateOf("") } @@ -124,7 +124,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Required field with error", TextColor.OnSurface) var inputValue8 by rememberSaveable { mutableStateOf("Input") } @@ -139,7 +139,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Supporting text", TextColor.OnSurface) Description("Short text", TextColor.OnSurface) @@ -159,7 +159,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Long text", TextColor.OnSurface) var inputValue10 by rememberSaveable { mutableStateOf("") } @@ -178,7 +178,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Error", TextColor.OnSurface) var inputValue11 by rememberSaveable { mutableStateOf("Input") } @@ -198,7 +198,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Warning", TextColor.OnSurface) var inputValue12 by rememberSaveable { mutableStateOf("Input") } @@ -218,7 +218,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Error and Warning", TextColor.OnSurface) var inputValue13 by rememberSaveable { mutableStateOf("Input") } @@ -246,7 +246,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Form with legend", TextColor.OnSurface) @@ -275,7 +275,7 @@ fun FormShellsScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("Legend and supporting text", TextColor.OnSurface) var inputValue16 by rememberSaveable { mutableStateOf("Input") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/FormsComponentsScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/FormsComponentsScreen.kt index 6e7ba6fab..3e85cb74b 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/FormsComponentsScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/FormsComponentsScreen.kt @@ -1,24 +1,32 @@ package org.hisp.dhis.common.screens +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier import org.hisp.dhis.common.screens.previews.InputShellPreview import org.hisp.dhis.mobile.ui.designsystem.component.BasicInput import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.InputShellState import org.hisp.dhis.mobile.ui.designsystem.component.InputStyle import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing @Composable fun FormsComponentsScreen() { ColumnComponentContainer("Input Shell") { SubTitle("Sample functional Input Shell ") InputShellPreview("Label", inputField = { BasicInput("Helper", true, helperStyle = InputStyle.WITH_HELPER_BEFORE, onInputChanged = {}) }) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Unfocused Input shell ") InputShellPreview("Label") + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Focused ") InputShellPreview("Label", state = InputShellState.FOCUSED) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Error ") InputShellPreview("Label", state = InputShellState.ERROR) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Disabled ") InputShellPreview("Label", state = InputShellState.DISABLED) } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/IconButtonScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/IconButtonScreen.kt index 4e13bbc82..c60c7f8df 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/IconButtonScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/IconButtonScreen.kt @@ -2,7 +2,10 @@ package org.hisp.dhis.common.screens import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier import androidx.compose.ui.unit.dp import org.hisp.dhis.common.screens.previews.IconButtonPreview import org.hisp.dhis.common.screens.previews.SquareIconButtonPreview @@ -10,6 +13,7 @@ import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.IconButtonStyle import org.hisp.dhis.mobile.ui.designsystem.component.RowComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.Title +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing @Composable fun IconButtonScreen() { @@ -24,6 +28,7 @@ fun IconButtonScreen() { SquareIconButtonPreview(false) }, ) + Spacer(Modifier.size(Spacing.Spacing18)) // IconButton RowComponentContainer( @@ -33,6 +38,7 @@ fun IconButtonScreen() { IconButtonPreview(false) }, ) + Spacer(Modifier.size(Spacing.Spacing18)) RowComponentContainer( title = "Filled", @@ -45,6 +51,8 @@ fun IconButtonScreen() { } }, ) + Spacer(Modifier.size(Spacing.Spacing18)) + RowComponentContainer( title = "Tonal", content = { @@ -56,6 +64,8 @@ fun IconButtonScreen() { } }, ) + Spacer(Modifier.size(Spacing.Spacing18)) + RowComponentContainer( title = "Outlined", content = { diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputIntegerScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputIntegerScreen.kt index 0fd08bff5..66e35c69d 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputIntegerScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputIntegerScreen.kt @@ -34,7 +34,7 @@ fun InputIntegerScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Basic Input Integer with error", textColor = TextColor.OnSurfaceVariant) var inputValueError by rememberSaveable { mutableStateOf("") } @@ -50,7 +50,7 @@ fun InputIntegerScreen() { state = InputShellState.ERROR, supportingText = listOf(SupportingTextData("Numbers only", SupportingTextState.ERROR)), ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue6 by rememberSaveable { mutableStateOf("") } @@ -65,7 +65,7 @@ fun InputIntegerScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue7 by rememberSaveable { mutableStateOf("1234") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputLetterScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputLetterScreen.kt index 8329cb277..9b4feabe8 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputLetterScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputLetterScreen.kt @@ -34,7 +34,7 @@ fun InputLetterScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle(" Basic Input Letter with error", textColor = TextColor.OnSurfaceVariant) var inputValueError by rememberSaveable { mutableStateOf("") } @@ -50,7 +50,7 @@ fun InputLetterScreen() { supportingText = listOf(SupportingTextData("Letters only. eg. A, B, C", SupportingTextState.ERROR)), state = InputShellState.ERROR, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue6 by rememberSaveable { mutableStateOf("") } @@ -65,7 +65,7 @@ fun InputLetterScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue7 by rememberSaveable { mutableStateOf("A") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputLongTextScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputLongTextScreen.kt index 09dc47668..9880f2c7d 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputLongTextScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputLongTextScreen.kt @@ -39,7 +39,7 @@ fun InputLongTextScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle(" Basic Input Long Text with error message", textColor = TextColor.OnSurfaceVariant) var inputValueError by rememberSaveable { @@ -64,7 +64,7 @@ fun InputLongTextScreen() { ), state = InputShellState.ERROR, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue6 by rememberSaveable { mutableStateOf("") } @@ -79,7 +79,7 @@ fun InputLongTextScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue7 by rememberSaveable { mutableStateOf("Content") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputNegativeIntegerScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputNegativeIntegerScreen.kt index 720d83a45..93ae1d859 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputNegativeIntegerScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputNegativeIntegerScreen.kt @@ -34,7 +34,7 @@ fun InputNegativeIntegerScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Basic Input Integer with error", textColor = TextColor.OnSurfaceVariant) var inputValueError by rememberSaveable { mutableStateOf("") } @@ -50,7 +50,7 @@ fun InputNegativeIntegerScreen() { state = InputShellState.ERROR, supportingText = listOf(SupportingTextData("Numbers only", SupportingTextState.ERROR)), ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue6 by rememberSaveable { mutableStateOf("") } @@ -65,7 +65,7 @@ fun InputNegativeIntegerScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue7 by rememberSaveable { mutableStateOf("1234") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputNumberScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputNumberScreen.kt index 3728866bd..8c9964929 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputNumberScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputNumberScreen.kt @@ -35,7 +35,7 @@ fun InputNumberScreen() { }, notation = RegExValidations.BRITISH_DECIMAL_NOTATION, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) Description("European decimal notation", textColor = TextColor.OnSurfaceVariant) var inputValueEuropean by rememberSaveable { mutableStateOf("") } @@ -50,7 +50,7 @@ fun InputNumberScreen() { }, notation = RegExValidations.EUROPEAN_DECIMAL_NOTATION, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue6 by rememberSaveable { mutableStateOf("") } @@ -65,7 +65,7 @@ fun InputNumberScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue7 by rememberSaveable { mutableStateOf("86") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPercentageScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPercentageScreen.kt index 7f8983887..7013cff13 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPercentageScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPercentageScreen.kt @@ -32,7 +32,7 @@ fun InputPercentageScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Basic Percentage required field", textColor = TextColor.OnSurfaceVariant) var inputValueRequired by rememberSaveable { mutableStateOf("") } @@ -48,7 +48,7 @@ fun InputPercentageScreen() { state = InputShellState.ERROR, isRequiredField = true, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue6 by rememberSaveable { mutableStateOf("") } @@ -63,7 +63,7 @@ fun InputPercentageScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue7 by rememberSaveable { mutableStateOf("1234") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPositiveIntegerOrZeroScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPositiveIntegerOrZeroScreen.kt index fb579d3fb..3a36e59df 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPositiveIntegerOrZeroScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPositiveIntegerOrZeroScreen.kt @@ -34,7 +34,7 @@ fun InputPositiveIntegerOrZeroScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Basic Input Integer with error", textColor = TextColor.OnSurfaceVariant) var inputValueError by rememberSaveable { mutableStateOf("") } @@ -50,7 +50,7 @@ fun InputPositiveIntegerOrZeroScreen() { state = InputShellState.ERROR, supportingText = listOf(SupportingTextData("Numbers only", SupportingTextState.ERROR)), ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue7 by rememberSaveable { mutableStateOf("1234") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPositiveIntegerScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPositiveIntegerScreen.kt index 333ec642f..0fe329d6a 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPositiveIntegerScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputPositiveIntegerScreen.kt @@ -34,7 +34,7 @@ fun InputPositiveIntegerScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Basic Input Integer with error", textColor = TextColor.OnSurfaceVariant) var inputValueError by rememberSaveable { mutableStateOf("") } @@ -49,7 +49,7 @@ fun InputPositiveIntegerScreen() { state = InputShellState.ERROR, supportingText = listOf(SupportingTextData("Numbers only", SupportingTextState.ERROR)), ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue6 by rememberSaveable { mutableStateOf("") } @@ -64,7 +64,7 @@ fun InputPositiveIntegerScreen() { } }, ) - Spacer(Modifier.size(Spacing.Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue7 by rememberSaveable { mutableStateOf("1234") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputScreen.kt index ae882dd01..acdb8feb2 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputScreen.kt @@ -1,14 +1,18 @@ package org.hisp.dhis.common.screens +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.runtime.setValue +import androidx.compose.ui.Modifier import org.hisp.dhis.mobile.ui.designsystem.component.BasicInput import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.InputStyle import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing @Composable fun InputScreen() { @@ -22,12 +26,16 @@ fun InputScreen() { content = { SubTitle("With helper before") BasicInput("Helper", helperStyle = InputStyle.WITH_HELPER_BEFORE, inputText = inputValue1, onInputChanged = { inputValue1 = it }) + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle("With helper after") BasicInput("Helper", helperStyle = InputStyle.WITH_HELPER_AFTER, inputText = inputValue2, onInputChanged = { inputValue2 = it }) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("No helper") BasicInput(inputText = inputValue3, onInputChanged = { inputValue3 = it }) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Disabled") BasicInput(enabled = false, inputText = inputValue4, onInputChanged = { inputValue4 = it }) }, diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputTextScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputTextScreen.kt index e9af05f8a..c56b6e80b 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputTextScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/InputTextScreen.kt @@ -13,8 +13,7 @@ import org.hisp.dhis.mobile.ui.designsystem.component.InputShellState import org.hisp.dhis.mobile.ui.designsystem.component.InputText import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle import org.hisp.dhis.mobile.ui.designsystem.component.Title -import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing.Spacing12 -import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing.Spacing8 +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing import org.hisp.dhis.mobile.ui.designsystem.theme.TextColor @Composable @@ -33,7 +32,7 @@ fun InputTextScreen() { } }, ) - Spacer(Modifier.size(Spacing12)) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Input text with error ") var inputValueError by rememberSaveable { mutableStateOf("Input") } @@ -47,7 +46,7 @@ fun InputTextScreen() { }, state = InputShellState.ERROR, ) - Spacer(Modifier.size(Spacing8)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue6 by rememberSaveable { mutableStateOf("") } @@ -62,7 +61,7 @@ fun InputTextScreen() { } }, ) - Spacer(Modifier.size(Spacing12)) + Spacer(Modifier.size(Spacing.Spacing18)) var inputValue7 by rememberSaveable { mutableStateOf("Content") } diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/LegendDescriptionScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/LegendDescriptionScreen.kt index 57eea70a2..79c627d12 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/LegendDescriptionScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/LegendDescriptionScreen.kt @@ -1,10 +1,14 @@ package org.hisp.dhis.common.screens +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.LegendDescriptionData import org.hisp.dhis.mobile.ui.designsystem.component.LegendRange import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing import org.hisp.dhis.mobile.ui.designsystem.theme.SurfaceColor import org.hisp.dhis.mobile.ui.designsystem.theme.TextColor @@ -29,6 +33,7 @@ fun LegendDescriptionScreen() { ), ), ) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Legend Block") LegendRange( diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/LegendScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/LegendScreen.kt index 5633bafbd..fa8344119 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/LegendScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/LegendScreen.kt @@ -1,10 +1,14 @@ package org.hisp.dhis.common.screens +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.Legend import org.hisp.dhis.mobile.ui.designsystem.component.LegendData import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing import org.hisp.dhis.mobile.ui.designsystem.theme.SurfaceColor import org.hisp.dhis.mobile.ui.designsystem.theme.TextColor @@ -13,9 +17,11 @@ fun LegendScreen() { ColumnComponentContainer(title = "Legend") { SubTitle("Green Legend") Legend(LegendData(SurfaceColor.CustomGreen, "Legend")) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Orange Legend") Legend(LegendData(TextColor.OnWarning, "Legend")) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Pink Legend") Legend( diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ProgressScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ProgressScreen.kt index 7dbec7568..62f346017 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ProgressScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/ProgressScreen.kt @@ -1,11 +1,15 @@ package org.hisp.dhis.common.screens +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.ProgressIndicator import org.hisp.dhis.mobile.ui.designsystem.component.ProgressIndicatorType import org.hisp.dhis.mobile.ui.designsystem.component.RowComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing @Composable internal fun ProgressScreen() { @@ -35,6 +39,7 @@ internal fun ProgressScreen() { type = ProgressIndicatorType.LINEAR, hasError = false, ) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Linear indicator - Error") ProgressIndicator( progress = 0.70f, @@ -45,6 +50,7 @@ internal fun ProgressScreen() { type = ProgressIndicatorType.LINEAR, hasError = true, ) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Circular indicator") RowComponentContainer { ProgressIndicator( @@ -77,6 +83,7 @@ internal fun ProgressScreen() { type = ProgressIndicatorType.CIRCULAR, hasError = false, ) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Circular indicator - Error") RowComponentContainer { ProgressIndicator( diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/RadioButtonScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/RadioButtonScreen.kt index c7f72770f..a38d74b2f 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/RadioButtonScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/RadioButtonScreen.kt @@ -1,10 +1,13 @@ package org.hisp.dhis.common.screens +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size 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 org.hisp.dhis.common.screens.previews.RadioButtonPreview import org.hisp.dhis.common.screens.previews.TextRadioButtonPreview import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer @@ -13,6 +16,7 @@ import org.hisp.dhis.mobile.ui.designsystem.component.RadioButtonBlock import org.hisp.dhis.mobile.ui.designsystem.component.RadioButtonData import org.hisp.dhis.mobile.ui.designsystem.component.RowComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing @Composable fun RadioButtonScreen() { @@ -62,6 +66,7 @@ fun RadioButtonScreen() { TextRadioButtonPreview(selected == option4, false, option4) { selected = option1 } + Spacer(Modifier.size(Spacing.Spacing18)) // RadioButton SubTitle("Radio Button") RowComponentContainer { @@ -72,11 +77,13 @@ fun RadioButtonScreen() { RadioButtonPreview(selected = false, enabled = true) RadioButtonPreview(selected = false, enabled = false) } + Spacer(Modifier.size(Spacing.Spacing18)) // RadioButtonBlock SubTitle("Horizontal Radio Button Block") RadioButtonBlock(Orientation.HORIZONTAL, radioButtonDataItemsHorizontal, selectedItemHorizontal) { selectedItemHorizontal = it } + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Vertical Radio Button Block") RadioButtonBlock(Orientation.VERTICAL, radioButtonDataItemsVertical, selectedItemVertical) { selectedItemVertical = it diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/SectionScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/SectionScreen.kt index 326ed24bb..2cbaabb17 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/SectionScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/SectionScreen.kt @@ -1,11 +1,14 @@ package org.hisp.dhis.common.screens import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.runtime.setValue +import androidx.compose.ui.Modifier import org.hisp.dhis.common.screens.previews.lorem import org.hisp.dhis.common.screens.previews.lorem_medium import org.hisp.dhis.common.screens.previews.lorem_short @@ -14,6 +17,7 @@ import org.hisp.dhis.mobile.ui.designsystem.component.InputText import org.hisp.dhis.mobile.ui.designsystem.component.Section import org.hisp.dhis.mobile.ui.designsystem.component.SectionState import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing @Composable fun SectionScreen() { @@ -78,6 +82,8 @@ fun SectionScreen() { ) } + Spacer(Modifier.size(Spacing.Spacing18)) + SubTitle("Flat header") Section( title = "Section title", diff --git a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/SupportingTextScreen.kt b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/SupportingTextScreen.kt index 4ecca2efb..9356ee897 100644 --- a/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/SupportingTextScreen.kt +++ b/common/src/commonMain/kotlin/org/hisp/dhis/common/screens/SupportingTextScreen.kt @@ -1,44 +1,41 @@ package org.hisp.dhis.common.screens +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.size import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import org.hisp.dhis.common.screens.previews.lorem import org.hisp.dhis.mobile.ui.designsystem.component.ColumnComponentContainer import org.hisp.dhis.mobile.ui.designsystem.component.SubTitle import org.hisp.dhis.mobile.ui.designsystem.component.SupportingText import org.hisp.dhis.mobile.ui.designsystem.component.SupportingTextState +import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing @Composable fun SupportingTextScreen() { ColumnComponentContainer(title = "Supporting Text") { SubTitle("Standard Supporting Text") SupportingText("Supporting text") + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Standard Warning Supporting Text") SupportingText("Supporting Text", SupportingTextState.WARNING) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Standard Error Supporting Text") SupportingText("Supporting Text", SupportingTextState.ERROR) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Overflow Default Supporting Text") SupportingText( - "Lorem ipsum dolor sit amet," + - " consectetur adipiscing elit. Maecenas dolor lacus," + - " aliquam. Lorem ipsum dolor sit amet," + - " consectetur adipiscing elit. Maecenas dolor lacus," + - " aliquam.Lorem ipsum dolor sit amet, consectetur adipiscing elit.", + lorem, ) SubTitle("Overflow Warning Supporting Text") SupportingText( - "Lorem ipsum dolor sit amet," + - " consectetur adipiscing elit. Maecenas dolor lacus," + - " aliquam. Lorem ipsum dolor sit amet," + - " consectetur adipiscing elit. Maecenas dolor lacus," + - " aliquam.Lorem ipsum dolor sit amet, consectetur adipiscing elit.", + lorem, SupportingTextState.WARNING, ) + Spacer(Modifier.size(Spacing.Spacing18)) SubTitle("Overflow Error Supporting Text") SupportingText( - "Lorem ipsum dolor sit amet," + - " consectetur adipiscing elit. Maecenas dolor lacus," + - " aliquam. Lorem ipsum dolor sit amet," + - " consectetur adipiscing elit. Maecenas dolor lacus," + - " aliquam.Lorem ipsum dolor sit amet, consectetur adipiscing elit.", + lorem, SupportingTextState.ERROR, ) } diff --git a/designsystem/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/GenericInput.kt b/designsystem/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/GenericInput.kt index 1c1d8ff07..1794b25b5 100644 --- a/designsystem/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/GenericInput.kt +++ b/designsystem/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/GenericInput.kt @@ -28,6 +28,7 @@ import java.util.Locale * @param isRequiredField controls whether the field is mandatory or not * @param onNextClicked gives access to the imeAction event * @param onValueChanged gives access to the onValueChanged event + * @param helper manages the helper text to show * @param modifier allows a modifier to be passed externally */ @Composable