import React from "react";
import {Text} from "@chakra-ui/layout";
import {HStack, Select} from "@chakra-ui/react";

function CustomStaticDropDown(props: any) {
    const {
        value,
        options,
        placeholder,
        OnChange,
    } = props;
    return (
        <HStack alignItems="center">
            <Text
                w="15%"
                  className="interFonts"
                  fontWeight="500"
                  fontSize="13px"
                  color="#626D85"
                  textAlign="right">
                {placeholder}
            </Text>

            <Select
                textAlign="center"
                color="#626D85"
                w={"85%"}
                placeholder={placeholder}
                onChange={(e) => {
                    OnChange(e.target.value);
                }}
                value={value}
            >
                {
                    options.map((option: any) => {
                        return (
                            <option key={option.value} value={option.value}>
                                {option.label}
                            </option>
                        );
                    })
                }
            </Select>
        </HStack>
    );
}



export default CustomStaticDropDown;