MUI DatePicker and Select Component not shown in the chatbot

[YourHarbour]

When I use the chatbot to let it return the custom component, the chatbot body will always cover all other lists like drop-down and date picker from MUI. Even I change like fixed position and index, both of them not working. `<div style={{'z-index': 2147483647, position: 'relative'}}>

Degree

<Select

id="degree_select"

value={props.degree}

label="Degree"

onChange={(e) => { props.setDegree(e.target.value); }} style={{'z-index': 2147483647, position: 'relative'}}

<MenuItem value={'CS'}>Computer Science <MenuItem value={'SD'}>Software Development <MenuItem value={'IS'}>Information System <MenuItem value={'DS'}>Data Science

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.