how to scroll when clicking in the selection menu TextField material ui? – Reactjs

I have also one more solution if its works for you,

import * as React from "react";
import Box from "@mui/material/Box";
import TextField from "@mui/material/TextField";
import MenuItem from "@mui/material/MenuItem";

const currencies = [
  {
    value: "USD",
    label: "$"
  },
  {
    value: "EUR",
    label: "€"
  },
  {
    value: "BTC",
    label: "฿"
  },
  {
    value: "JPY1",
    label: "1"
  },
  {
    value: "JPY2",
    label: "2"
  },
  {
    value: "JPY3",
    label: "3"
  },
  {
    value: "JPY4",
    label: "4"
  },
  {
    value: "JPY",
    label: "¥"
  }
];

export default function SelectTextFields() {
  return (
    <Box
      component="form"
      sx={{
        "& .MuiTextField-root": { m: 1, width: "25ch", height: "10px" }
      }}
      noValidate
      autoComplete="off"
    >
      <div>
        <TextField
          id="outlined-select-currency"
          select
          label="Select"
          defaultValue="EUR"
          helperText="Please select your currency"
          // Set the MenuProps to a custom object with a MenuListProps object that sets a maxHeight
          MenuProps={{
            MenuListProps: {
              style: { maxHeight: 200 }
            }
          }}
        >
          {currencies.map((option) => (
            <MenuItem key={option.value} value={option.value}>
              {option.label}
            </MenuItem>
          ))}
        </TextField>
      </div>
    </Box>
  );
}