diff --git a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/SelectedIndicatorAtom.kt b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/SelectedIndicatorAtom.kt new file mode 100644 index 0000000000..4f30ac6d9b --- /dev/null +++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/SelectedIndicatorAtom.kt @@ -0,0 +1,81 @@ +/* + * Copyright 2025 New Vector Ltd. + * + * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial + * Please see LICENSE files in the repository root for full details. + */ + +package io.element.android.libraries.designsystem.atomic.atoms + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.selection.toggleable +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.semantics.Role +import androidx.compose.ui.unit.dp +import io.element.android.compound.theme.ElementTheme +import io.element.android.compound.tokens.generated.CompoundIcons +import io.element.android.libraries.designsystem.preview.ElementPreview +import io.element.android.libraries.designsystem.preview.PreviewsDayNight +import io.element.android.libraries.designsystem.theme.components.Icon + +@Composable +fun SelectedIndicatorAtom( + checked: Boolean, + enabled: Boolean, + modifier: Modifier = Modifier, +) { + if (checked) { + Icon( + modifier = modifier.toggleable( + value = true, + role = Role.Companion.Checkbox, + enabled = enabled, + onValueChange = {}, + ), + imageVector = CompoundIcons.CheckCircleSolid(), + contentDescription = null, + tint = if (enabled) { + ElementTheme.colors.iconAccentPrimary + } else { + ElementTheme.colors.iconDisabled + }, + ) + } else { + Box(modifier) + } +} + +@Composable +@PreviewsDayNight +internal fun SelectedIndicatorAtomPreview() = ElementPreview { + Column( + modifier = Modifier.padding(8.dp), + verticalArrangement = Arrangement.spacedBy(8.dp), + ) { + SelectedIndicatorAtom( + modifier = Modifier.size(24.dp), + checked = false, + enabled = false, + ) + SelectedIndicatorAtom( + modifier = Modifier.size(24.dp), + checked = true, + enabled = false, + ) + SelectedIndicatorAtom( + modifier = Modifier.size(24.dp), + checked = false, + enabled = true, + ) + SelectedIndicatorAtom( + modifier = Modifier.size(24.dp), + checked = true, + enabled = true, + ) + } +} diff --git a/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/CheckableUserRow.kt b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/CheckableUserRow.kt index f21d4ecee5..b533a045a5 100644 --- a/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/CheckableUserRow.kt +++ b/libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/CheckableUserRow.kt @@ -19,10 +19,10 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.semantics.Role import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp +import io.element.android.libraries.designsystem.atomic.atoms.SelectedIndicatorAtom import io.element.android.libraries.designsystem.components.avatar.AvatarData import io.element.android.libraries.designsystem.components.avatar.AvatarSize import io.element.android.libraries.designsystem.preview.ElementThemedPreview -import io.element.android.libraries.designsystem.theme.components.Checkbox import io.element.android.libraries.designsystem.theme.components.HorizontalDivider import io.element.android.libraries.matrix.ui.model.getAvatarData @@ -60,11 +60,9 @@ fun CheckableUserRow( ) } } - - Checkbox( - modifier = Modifier.padding(end = 4.dp), + SelectedIndicatorAtom( + modifier = modifier.padding(end = 24.dp), checked = checked, - onCheckedChange = null, enabled = enabled, ) }