How does the DatePickerDialog manage to be above the content?

Question

When using a DatePickerDialog it is above other content even if one does not use a Box layout around it. How is that possible?

Sample code:

    OutlinedTextField(
        enabled = true,
        singleLine = true,
        modifier = Modifier.fillMaxWidth(),
        placeholder = { Text("field 1") },
        value = "",
        onValueChange = {}
    )

    OutlinedTextField(
        enabled = true,
        singleLine = true,
        modifier = Modifier.fillMaxWidth(),
        placeholder = { Text("field 2") },
        value = "",
        onValueChange = {}
    )

    OutlinedTextField(
        enabled = true,
        singleLine = true,
        modifier = Modifier.fillMaxWidth(),
        placeholder = { Text("field 3") },
        value = "",
        onValueChange = {}
    )

    val datePickerState = rememberDatePickerState()
    val showDialog = rememberSaveable { mutableStateOf(true) }

    if(showDialog.value) {
        DatePickerDialog(
            onDismissRequest = { /* kein cancel wenn außerhalb des Dialogs tippe */ },
            confirmButton = {
                TextButton(onClick = {}) {
                    Text("ok")
                }
            },
            dismissButton = {
                TextButton(onClick = { }) {
                    Text("cancel")
                }
            }
        ) {
            DatePicker(state = datePickerState)
        }
    }

Result:

Answer 1

On Android, system dialogs usually open on a separate window and overlay the current app.