Как я могу регулировать куда будет разворачиваться select?

Question

[ceeed]

Я использую библиотеку react-hook-form. Мне нужно чтобы при клике на select он открывался всегда вниз. Если так сделать нельзя, то мне нужно хотя-бы настроить высоту выпадающего списка при клике. Как я могу это сделать?

Пример моего SELECT

<div className="offset-top-10" ref={country}>
							<Controller
								name="country"
								control={control}
								rules={{
									required: {
										value: true,
										// message: t("validations.required", { ns: "common" }),
									},
								}}
								render={({ field: { onChange, value } }) => (
									<Select
										name="country"
										value={value || t("store.placeholder.country")}
										onChange={onChange}
										label={t("store.country")}
										labelSize="sm"
										errors={errors}
										fluid
									>
										{countryForShop.map((country) => (
											<Select.Option key={country._id} value={country._id}>
												{country.name}
											</Select.Option>
										))}
									</Select>
								)}
							/>
						</div>