alireza
da180e76ab
Some checks failed
Deploy MyApp on Same Server / build-and-deploy (push) Has been cancelled
38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
import { Calendar as CalendarIcon } from 'lucide-react'
|
||
import { cn } from '@/lib/utils'
|
||
|
||
type YearSelectorProps = {
|
||
years: number[]
|
||
selectedYear: number
|
||
onYearChange: (year: number) => void
|
||
className?: string
|
||
}
|
||
|
||
export function YearSelector({
|
||
years,
|
||
selectedYear,
|
||
onYearChange,
|
||
className
|
||
}: YearSelectorProps) {
|
||
return (
|
||
<div className={cn('flex flex-wrap items-center justify-center gap-4', className)}>
|
||
<label className="text-sm font-medium text-gray-700 flex items-center gap-2">
|
||
<CalendarIcon className="w-4 h-4 text-gray-500" />
|
||
انتخاب سال:
|
||
</label>
|
||
<select
|
||
className="px-4 py-2 border border-gray-200 rounded-lg focus:border-green-500 focus:outline-none focus:ring-2 focus:ring-green-500/20 transition-all duration-150 bg-white font-medium"
|
||
value={selectedYear}
|
||
onChange={(e) => onYearChange(Number(e.target.value))}
|
||
>
|
||
{years.map((year) => (
|
||
<option key={year} value={year}>
|
||
{year}
|
||
</option>
|
||
))}
|
||
</select>
|
||
</div>
|
||
)
|
||
}
|
||
|