import React, {ReactNode, useEffect, useRef, useState} from "react";
import open from '../../../assets/images/down-arrow.svg';
import close from '../../../assets/images/x-blue.svg';
import './customselect.scss'
import {CustomSelectOptions} from "../../../models/ReactComponents";
import CustomSelect, {CustomSelectProps} from "./CustomSelect";
import SelectItem from "./SelectItem";

interface MakeCustomSelectProps extends Omit<CustomSelectProps, 'children'> {
    options: CustomSelectOptions
}

// @ts-ignore
/***
 *
 *GENERRATES CUSTOM SELECT COMPONETNS FROM OPTIONS OBJECT
 */

export default function MakeCustomSelect({
                                             options,
                                             ...props
                                         }: MakeCustomSelectProps) {


    return (

        // @ts-ignore
        <CustomSelect
            {...props}
        >
            {
                options?.map(opt => {
                    return <SelectItem key={opt.value} value={opt.value}>{opt.name}</SelectItem>
                })
            }
        </CustomSelect>

    );
}