31 lines
963 B
TypeScript
31 lines
963 B
TypeScript
import { p as P } from 'web-components'
|
|
|
|
interface DateInputProps {
|
|
value: Date | null
|
|
setValue: (d: Date | null) => void
|
|
showLabel?: boolean
|
|
placeholder?: string
|
|
}
|
|
|
|
function toDateStr(d: Date | null): string {
|
|
if (!d) return ''
|
|
const y = d.getFullYear()
|
|
const m = String(d.getMonth() + 1).padStart(2, '0')
|
|
const day = String(d.getDate()).padStart(2, '0')
|
|
return `${y}-${m}-${day}`
|
|
}
|
|
|
|
export default function DateInput({ value, setValue, showLabel = true, placeholder = 'Select Date' }: DateInputProps) {
|
|
return (
|
|
<div className="w-full">
|
|
{showLabel ? <P className="text-xs mb-1">{placeholder}</P> : null}
|
|
<input
|
|
type="date"
|
|
value={toDateStr(value)}
|
|
onChange={(e) => setValue(e.target.value ? new Date(`${e.target.value}T00:00:00`) : null)}
|
|
placeholder={placeholder}
|
|
className="w-full rounded border border-gray-300 px-2 py-2 text-sm font-medium text-gray-800"
|
|
/>
|
|
</div>
|
|
)
|
|
}
|