Ordered/Unordered List in Jetpack Compose

gistfile1.txt

package com.iamutkarshtiwari.ds.component

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.wrapContentWidth
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateListOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.onSizeChanged
import androidx.compose.ui.platform.LocalDensity
import com.iamutkarshtiwari.ds.theme.DsColors
import com.iamutkarshtiwari.ds.theme.DsSizing
import com.iamutkarshtiwari.ds.theme.DsTypography

object TextList {
    enum class Variant {
        ORDERED,
        UNORDERED
    }
}

@Composable
fun TextList(
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    variant: TextList.Variant = TextList.Variant.ORDERED,
    list: List<String>
) {
    Row(modifier = modifier.padding(horizontal = DsSizing.spacing16)) {
        val heightList = remember { mutableStateListOf<Int>() }
        heightList.apply {
            repeat(list.size) { add(0) }
        }

        with(LocalDensity.current) {
            Column(
                modifier = Modifier.wrapContentWidth(),
                verticalArrangement = Arrangement.spacedBy(DsSizing.spacing16)

            ) {
                list.forEachIndexed { index, _ ->
                    Text(
                        modifier = Modifier.height(height = heightList[index].toDp()),
                        text = if (variant == TextList.Variant.ORDERED) {
                            "${index + 1}."
                        } else BULLET_SYMBOL,
                        color = if (enabled) DsColors.textPrimary else DsColors.textDisabled,
                        style = DsTypography.medium
                    )
                }
            }
        }

        HorizontalSpacer(size = DsSizing.spacing4)

        Column(
            verticalArrangement = Arrangement.spacedBy(DsSizing.spacing16)
        ) {
            list.forEachIndexed { index, _ ->
                Text(
                    modifier = Modifier.onSizeChanged {
                        it.height
                        heightList[index] = it.height
                    },
                    text = list[index],
                    color = if (enabled) DsColors.textPrimary else DsColors.textDisabled,
                    style = DsTypography.medium
                )
            }
        }
    }
}

private const val BULLET_SYMBOL = "•"