You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
64 lines
1.1 KiB
64 lines
1.1 KiB
import React, { useState } from "react"; |
|
|
|
const Month = ({ items }) => { |
|
const [selectedYear, setSelectedYear] = useState(null); |
|
|
|
return ( |
|
<div className="flex flex-col"> |
|
{items.map((item, index) => ( |
|
<span |
|
onClick={() => setSelectedYear(selectedYear === item ? null : item)} |
|
className={`text-xs my-2 cursor-pointer ${ |
|
selectedYear === item ? "text-[#06BACE] font-sansbold " : "" |
|
}`} |
|
key={index} |
|
> |
|
{item.month} |
|
</span> |
|
))} |
|
</div> |
|
); |
|
}; |
|
|
|
export default Month; |
|
|
|
Month.defaultProps = { |
|
items: [ |
|
{ |
|
month: "فروردین", |
|
}, |
|
{ |
|
month: "اردیبهشت", |
|
}, |
|
{ |
|
month: "خرداد", |
|
}, |
|
{ |
|
month: "تیر", |
|
}, |
|
{ |
|
month: "مرداد", |
|
}, |
|
{ |
|
month: "شهریور", |
|
}, |
|
{ |
|
month: "مهر", |
|
}, |
|
{ |
|
month: "آبان", |
|
}, |
|
{ |
|
month: "آذر", |
|
}, |
|
{ |
|
month: "دی", |
|
}, |
|
{ |
|
month: "بهمن", |
|
}, |
|
{ |
|
month: "اسفند", |
|
}, |
|
], |
|
};
|
|
|