// Basic modifier field with default marking
@Preview
@Composable
fun ButtonPreview() = PreviewLab {
    Button(
        onClick = { },
        modifier = fieldValue { ModifierField("Button modifier") },
    ) {
        Text("Styled Button")
    }
}

// Custom initial modifier chain
@Preview
@Composable
fun CardPreview() = PreviewLab {
    val customModifier: Modifier = fieldValue {
        ModifierField(
            label = "Card Modifier",
            initialValue = ModifierFieldValue.mark()
                .padding(16.dp)
                .background(Color.Blue)
        )
    }

    Card(modifier = customModifier) {
        Text("Custom Card")
    }
}

// Pre-configured with multiple modifiers
@Preview
@Composable
fun BoxPreview() = PreviewLab {
    val containerModifier: Modifier = fieldValue {
        ModifierField(
            label = "Container",
            initialValue = ModifierFieldValue.mark()
                .padding(all = 8.dp)
                .background(Color.Gray.copy(alpha = 0.3f))
                .border(width = 2.dp, color = Color.Black)
        )
    }

    Box(modifier = containerModifier) {
        Text("Container Content")
    }
}