fix component movement when focused, make only long text component sc…

…rollable
dhis2 · Sep 27, 2023 · 10b4c4a · 10b4c4a
1 parent a39e8eb
commit 10b4c4a
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 13 deletions.
diff --git a/...tem/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/InputLongText.kt b/...tem/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/InputLongText.kt
@@ -1,9 +1,15 @@
 package org.hisp.dhis.mobile.ui.designsystem.component
 
+import androidx.compose.foundation.gestures.Orientation
+import androidx.compose.foundation.gestures.scrollable
+import androidx.compose.foundation.layout.heightIn
+import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.text.input.ImeAction
+import org.hisp.dhis.mobile.ui.designsystem.theme.InternalSizeValues
+import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing
 
 /**
  * DHIS2 Input Long Text. Wraps DHIS · [BasicTextInput].
@@ -43,7 +49,10 @@ fun InputLongText(
         onValueChanged = onValueChanged,
         keyboardOptions = KeyboardOptions(imeAction = imeAction),
         isSingleLine = false,
-        modifier = modifier,
+        modifier = modifier.scrollable(
+            orientation = Orientation.Vertical,
+            state = rememberScrollState(),
+        ).heightIn(Spacing.Spacing0, InternalSizeValues.Size300),
         testTag = "LONG_TEXT",
     )
 }
diff --git a/...system/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/InputShell.kt b/...system/src/commonMain/kotlin/org/hisp/dhis/mobile/ui/designsystem/component/InputShell.kt
@@ -1,20 +1,17 @@
 package org.hisp.dhis.mobile.ui.designsystem.component
 
 import androidx.compose.foundation.background
-import androidx.compose.foundation.gestures.Orientation
-import androidx.compose.foundation.gestures.scrollable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 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.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
-import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Divider
 import androidx.compose.runtime.Composable
@@ -28,8 +25,8 @@ import androidx.compose.ui.draw.clip
 import androidx.compose.ui.focus.onFocusChanged
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.IntOffset
 import org.hisp.dhis.mobile.ui.designsystem.theme.Border
-import org.hisp.dhis.mobile.ui.designsystem.theme.InternalSizeValues
 import org.hisp.dhis.mobile.ui.designsystem.theme.Outline
 import org.hisp.dhis.mobile.ui.designsystem.theme.Radius
 import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing
@@ -65,10 +62,6 @@ fun InputShell(
         val backgroundColor = if (state != InputShellState.DISABLED) SurfaceColor.Surface else SurfaceColor.DisabledSurface
         InputShellRow(
             modifier = Modifier
-                .scrollable(
-                    orientation = Orientation.Vertical,
-                    state = rememberScrollState(),
-                ).heightIn(Spacing.Spacing0, InternalSizeValues.Size300)
                 .onFocusChanged {
                     indicatorColor = if (it.isFocused && state != InputShellState.ERROR && state != InputShellState.WARNING) InputShellState.FOCUSED.color else state.color
                     indicatorThickness = if (it.isFocused) Border.Regular else Border.Thin
@@ -102,7 +95,7 @@ fun InputShell(
                 }
             }
         }
-        Box {
+        Box(Modifier.height(Spacing.Spacing2)) {
             InputShellIndicator(
                 color = indicatorColor,
                 thickness = indicatorThickness,
@@ -169,8 +162,13 @@ private fun InputShellIndicator(
         modifier = modifier
             .fillMaxWidth()
             .padding(
-                top = if (thickness == Border.Thin) Spacing.Spacing1 else Spacing.Spacing0,
-            ),
+                top = Spacing.Spacing0,
+            ).offset {
+                IntOffset(
+                    0,
+                    if (thickness == Border.Thin) 0 else -2,
+                )
+            },
         thickness = thickness,
         color = color,
     )