The title and default values ​go together

Question

In react useForm hook title and default values ​​go together how can I fix is?

I want it like in this image:

It is a my MUI component

 <Controller
                    name="description"
                    control={control}
                    rules={{ required: 'description is required' }}
                    render={({ field }) => (
                        <TextField
                            {...field}
                            type="text"
                            variant="outlined"
                            fullWidth
                            label="description"
                            error={Boolean(errors.description)}
                            helperText={(errors.description?.message) || ''}
                        />
                    )}
                />

I tried this but it's not what I want

 <InputLabel htmlFor="title">Title</InputLabel>

                <Controller
                    name="title"
                    control={control}
                    rules={{ required: 'title is required' }}
                    render={({ field }) => (
                        <TextField
                            {...field}
                            type="text"
                            variant="outlined"
                            fullWidth
                            error={Boolean(errors.title)}
                            helperText={(errors.title?.message) || ''}
                        />
                    )}
                />