|
|
|
|
@@ -1,8 +1,11 @@
|
|
|
|
|
package de.jeanlucmakiola.floret.components
|
|
|
|
|
|
|
|
|
|
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.padding
|
|
|
|
|
import androidx.compose.foundation.layout.width
|
|
|
|
|
import androidx.compose.foundation.shape.RoundedCornerShape
|
|
|
|
|
@@ -10,8 +13,12 @@ import androidx.compose.material.icons.Icons
|
|
|
|
|
import androidx.compose.material.icons.filled.ArrowDropDown
|
|
|
|
|
import androidx.compose.material3.DropdownMenu
|
|
|
|
|
import androidx.compose.material3.DropdownMenuItem
|
|
|
|
|
import androidx.compose.material3.FilledTonalButton
|
|
|
|
|
import androidx.compose.material3.Icon
|
|
|
|
|
import androidx.compose.material3.MaterialTheme
|
|
|
|
|
import androidx.compose.material3.SegmentedButton
|
|
|
|
|
import androidx.compose.material3.SegmentedButtonDefaults
|
|
|
|
|
import androidx.compose.material3.SingleChoiceSegmentedButtonRow
|
|
|
|
|
import androidx.compose.material3.Surface
|
|
|
|
|
import androidx.compose.material3.Text
|
|
|
|
|
import androidx.compose.runtime.Composable
|
|
|
|
|
@@ -57,6 +64,83 @@ fun DialogAmountField(
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* The expanded "Custom" editor card shared by the family's presets-plus-custom
|
|
|
|
|
* pickers (reminder lead time, agenda range, snooze delay). A tonal surface with
|
|
|
|
|
* the connected-shape that meets the "Custom" row above it (tight top corners,
|
|
|
|
|
* full bottom), holding — top to bottom — an optional single-choice unit toggle,
|
|
|
|
|
* then a row of [DialogAmountField] + a live [preview] of what the amount
|
|
|
|
|
* resolves to + a tonal confirm.
|
|
|
|
|
*
|
|
|
|
|
* Purely presentational: the caller owns the amount/unit state and computes
|
|
|
|
|
* [preview] and [confirmEnabled] from its own domain, so this component carries
|
|
|
|
|
* no units, ranges, or strings of its own. Pass [unitLabels] empty for an
|
|
|
|
|
* amount-only editor (no toggle row). [onConfirm] fires on the confirm button.
|
|
|
|
|
*/
|
|
|
|
|
@Composable
|
|
|
|
|
fun CustomAmountEditor(
|
|
|
|
|
amountText: String,
|
|
|
|
|
onAmountChange: (String) -> Unit,
|
|
|
|
|
preview: String,
|
|
|
|
|
setLabel: String,
|
|
|
|
|
confirmEnabled: Boolean,
|
|
|
|
|
onConfirm: () -> Unit,
|
|
|
|
|
modifier: Modifier = Modifier,
|
|
|
|
|
placeholder: String = "10",
|
|
|
|
|
unitLabels: List<String> = emptyList(),
|
|
|
|
|
selectedUnit: Int = 0,
|
|
|
|
|
onUnitChange: (Int) -> Unit = {},
|
|
|
|
|
) {
|
|
|
|
|
Surface(
|
|
|
|
|
color = MaterialTheme.colorScheme.surfaceContainerHigh,
|
|
|
|
|
// A Position.Bottom shape: tight top corners meeting the row, full bottom.
|
|
|
|
|
shape = RoundedCornerShape(topStart = 6.dp, topEnd = 6.dp, bottomStart = 22.dp, bottomEnd = 22.dp),
|
|
|
|
|
modifier = modifier
|
|
|
|
|
.fillMaxWidth()
|
|
|
|
|
.padding(horizontal = 16.dp),
|
|
|
|
|
) {
|
|
|
|
|
Column(
|
|
|
|
|
modifier = Modifier.padding(16.dp),
|
|
|
|
|
verticalArrangement = Arrangement.spacedBy(16.dp),
|
|
|
|
|
) {
|
|
|
|
|
// Unit toggle first (when present) so it stays visible above the
|
|
|
|
|
// keyboard once the amount field below it is focused and scrolled in.
|
|
|
|
|
if (unitLabels.isNotEmpty()) {
|
|
|
|
|
SingleChoiceSegmentedButtonRow(modifier = Modifier.fillMaxWidth()) {
|
|
|
|
|
unitLabels.forEachIndexed { index, label ->
|
|
|
|
|
SegmentedButton(
|
|
|
|
|
selected = index == selectedUnit,
|
|
|
|
|
onClick = { onUnitChange(index) },
|
|
|
|
|
shape = SegmentedButtonDefaults.itemShape(index, unitLabels.size),
|
|
|
|
|
label = { Text(label) },
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// Amount, a live preview of what it resolves to, and confirm — all on
|
|
|
|
|
// one row, sitting just above the keyboard.
|
|
|
|
|
Row(verticalAlignment = Alignment.CenterVertically) {
|
|
|
|
|
DialogAmountField(
|
|
|
|
|
value = amountText,
|
|
|
|
|
onValueChange = onAmountChange,
|
|
|
|
|
placeholder = placeholder,
|
|
|
|
|
)
|
|
|
|
|
Spacer(Modifier.width(16.dp))
|
|
|
|
|
Text(
|
|
|
|
|
text = preview,
|
|
|
|
|
style = MaterialTheme.typography.bodyLarge,
|
|
|
|
|
color = MaterialTheme.colorScheme.onSurfaceVariant,
|
|
|
|
|
modifier = Modifier.weight(1f),
|
|
|
|
|
)
|
|
|
|
|
Spacer(Modifier.width(16.dp))
|
|
|
|
|
FilledTonalButton(onClick = onConfirm, enabled = confirmEnabled) {
|
|
|
|
|
Text(setLabel)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/** Tonal dropdown trigger + menu shared by the custom reminder/recurrence steps and pickers. */
|
|
|
|
|
@Composable
|
|
|
|
|
fun DialogUnitDropdown(
|
|
|
|
|
|