PeachSegmentedControl.kt

1package com.peachpasswords.ui.components23import androidx.compose.foundation.clickable4import androidx.compose.foundation.layout.Arrangement5import androidx.compose.foundation.layout.Row6import androidx.compose.foundation.layout.defaultMinSize7import androidx.compose.foundation.layout.fillMaxWidth8import androidx.compose.foundation.layout.padding9import androidx.compose.foundation.shape.RoundedCornerShape10import androidx.compose.material3.Surface11import androidx.compose.material3.Text12import androidx.compose.runtime.Composable13import androidx.compose.ui.Alignment14import androidx.compose.ui.Modifier15import androidx.compose.ui.draw.clip16import androidx.compose.ui.unit.dp17import com.peachpasswords.ui.theme.LocalPeachAccent18import com.peachpasswords.ui.theme.PeachSpacing19import com.peachpasswords.ui.theme.PeachType20import com.peachpasswords.ui.theme.peachColors2122data class PeachSegment(23    val key: String,24    val label: String,25)2627@Composable28fun PeachSegmentedControl(29    segments: List<PeachSegment>,30    selectedKey: String,31    onSelected: (String) -> Unit,32    modifier: Modifier = Modifier,33) {34    val accent = LocalPeachAccent.current35    Surface(36        modifier = modifier.fillMaxWidth(),37        color = peachColors.S1,38        shape = RoundedCornerShape(999.dp),39        tonalElevation = 1.dp,40    ) {41        Row(42            modifier = Modifier.padding(PeachSpacing.xs),43            verticalAlignment = Alignment.CenterVertically,44            horizontalArrangement = Arrangement.spacedBy(PeachSpacing.xs),45        ) {46            segments.forEach { segment ->47                val selected = segment.key == selectedKey48                Surface(49                    modifier = Modifier50                        .weight(1f)51                        .defaultMinSize(minHeight = 34.dp)52                        .clickable { onSelected(segment.key) },53                    color = if (selected) accent else peachColors.S2,54                    contentColor = if (selected) peachColors.Bg else peachColors.T1,55                    shape = RoundedCornerShape(999.dp),56                ) {57                    Row(58                        modifier = Modifier.padding(horizontal = PeachSpacing.sm, vertical = PeachSpacing.sm),59                        horizontalArrangement = Arrangement.Center,60                        verticalAlignment = Alignment.CenterVertically,61                    ) {62                        Text(segment.label.uppercase(), style = PeachType.sortPill)63                    }64                }65            }66        }67    }68}6970/**71 * Browser-matched quiet filter row: the active option gets one small,72 * content-sized accent pill; every other option is bare text (no box,73 * no fill) sitting quietly beside it. Distinct from [PeachSegmentedControl],74 * which renders every option as an equal-weight full-width button — right for75 * a real multi-way choice (entry type), wrong for a filter/sort row, where76 * giving every option the same loud pill treatment reads as several accent77 * moments stacked instead of one (SMART/A-Z/Z-A/RECENT in the browser).78 */79@Composable80fun PeachFilterPills(81    segments: List<PeachSegment>,82    selectedKey: String,83    onSelected: (String) -> Unit,84    modifier: Modifier = Modifier,85) {86    val accent = LocalPeachAccent.current87    Row(88        modifier = modifier,89        verticalAlignment = Alignment.CenterVertically,90        horizontalArrangement = Arrangement.spacedBy(PeachSpacing.md),91    ) {92        segments.forEach { segment ->93            val selected = segment.key == selectedKey94            if (selected) {95                Surface(96                    color = accent,97                    contentColor = peachColors.Bg,98                    shape = RoundedCornerShape(999.dp),99                ) {100                    Text(101                        segment.label.uppercase(),102                        style = PeachType.sortPill,103                        modifier = Modifier104                            .clip(RoundedCornerShape(999.dp))105                            .clickable { onSelected(segment.key) }106                            .padding(horizontal = PeachSpacing.sm, vertical = PeachSpacing.xs),107                    )108                }109            } else {110                Text(111                    segment.label.uppercase(),112                    color = peachColors.T2,113                    style = PeachType.sortPill,114                    modifier = Modifier115                        .clickable { onSelected(segment.key) }116                        .padding(vertical = PeachSpacing.xs),117                )118            }119        }120    }121}