33 lines
875 B

import React, { useState } from "react";
import DateRangePicker from "./DateRangePicker";
import RangeDatePicker from "./RangeDatePicker";
import SimpleCalendar from "./SimpleCalendar";
import SimpleDatePicker from "./SimpleDatePicker";
import CalenderList from "./CalenderList";
function Calender() {
const list = {
1: <DateRangePicker />,
2: <RangeDatePicker />,
3: <SimpleCalendar />,
4: <SimpleDatePicker />,
5: <CalenderList />,
};
const [type, setType] = useState(1);
return (
<div className="w-full flex flex-col items-center">
<select
className="mb-10 w-20 bg-gray-200"
onChange={(e) => setType(e.target.value)}
>
{Object.keys(list).map((option, index) => (
<option key={index}>{option}</option>
))}
</select>
{list[type]}
</div>
);
}
export default Calender;