frontPanel/src/pages/Questions/OwnTextField/OwnTextField.tsx

import {Box, Typography, useTheme} from "@mui/material";
import ButtonsOptions from "../ButtonsOptions";
import SwitchTextField from "./switchTextField";
import React from "react";
import CustomTextField from "@ui_kit/CustomTextField";
import InfoIcon from "../../../assets/icons/InfoIcon";

interface Props {
    totalIndex: number
}
export default function OwnTextField({totalIndex}: Props) {
    const theme = useTheme();
    const [switchState, setSwitchState] = React.useState('setting');
    const SSHC = (data: string) => {
        setSwitchState(data)
    }
    return (
        <>
            <Box
                sx={{
                    width: '100%',
                    maxWidth: '640px',
                    display: 'flex',
                    padding: '20px',
                    flexDirection: 'column',
                    gap: '20px'}}
            >
               <CustomTextField placeholder={"Пример ответа"} text={''}/>
                <Box sx={{display: 'flex', alignItems: 'center', gap: '12px'}}>
                    <Typography sx={{
                        fontWeight: 400,
                        fontSize: '16px',
                        lineHeight: '18.96px',
                        color: theme.palette.grey2.main
                    }}>Пользователю будет дано поле для ввода значения  </Typography>
                    <InfoIcon/>
                </Box>
            </Box>
            <ButtonsOptions switchState={switchState} SSHC={SSHC} totalIndex={totalIndex}/>
            <SwitchTextField switchState={switchState}/>
        </>
    )
}