package com.suno.android.common_ui.components.text_fields

import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.suno.android.common_ui.theme.ExtendedTheme
import com.suno.android.common_ui.theme.SunoTheme

@Composable
fun LargeInputTextField(
    modifier: Modifier = Modifier,
    keyboardOptions: KeyboardOptions = KeyboardOptions.Default,
    placeHolderText: String,
    inputText: String,
    onValueChange: (String) -> Unit,
) {
    TextField(
        modifier = modifier.padding(20.dp),
        keyboardOptions = keyboardOptions,
        value = inputText,
        textStyle = ExtendedTheme.typography.largeBody,
        onValueChange = {
            onValueChange.invoke(it)
        },
        placeholder = {
            Text(
                text = placeHolderText,
                style = ExtendedTheme.typography.largeBody,
                color = ExtendedTheme.colors.textTertiary,
            )
        },
        colors = TextFieldDefaults.colors(
            unfocusedContainerColor = Color.Transparent,
            focusedContainerColor = Color.Transparent,
            unfocusedIndicatorColor = Color.Transparent,
            focusedIndicatorColor = Color.Transparent,
            focusedTextColor = ExtendedTheme.colors.textSecondary,
            unfocusedTextColor = ExtendedTheme.colors.textSecondary,
            cursorColor = ExtendedTheme.colors.sunoPink,
        ),
    )
}

@Preview(showSystemUi = true)
@Composable
private fun LargeInputTextField_Preview() {
    SunoTheme {
        LargeInputTextField(
            modifier = Modifier
                .fillMaxWidth()
                .height(300.dp),
            inputText = "",
            onValueChange = {},
            placeHolderText = "A song about dogs",
        )
    }
}