@ -9,7 +9,7 @@ import styles from './styles.module.css'
// TODO: At some point make the date input better for accessibility
// TODO: At some point make the date input better for accessibility
// (currently just skips tab index)
// (currently just skips tab index)
export default function Input( { placeholder : _placeholder , label : _label , error , hint , name , value , onChange , onBlur , isValid } ) {
export default function Date Input( { placeholder : _placeholder , label : _label , error , hint , name , value , onChange , onBlur , isValid , minDate , maxDate } ) {
const label = ( _label === undefined ) ? name . replace ( name [ 0 ] , name [ 0 ] . toUpperCase ( ) ) : _label
const label = ( _label === undefined ) ? name . replace ( name [ 0 ] , name [ 0 ] . toUpperCase ( ) ) : _label
const displayedValue = value ? DateTime . fromISO ( value ) . toFormat ( 'LLLL dd, yyyy' ) : _placeholder
const displayedValue = value ? DateTime . fromISO ( value ) . toFormat ( 'LLLL dd, yyyy' ) : _placeholder
const inputRef = useRef ( )
const inputRef = useRef ( )
@ -22,7 +22,7 @@ export default function Input({placeholder: _placeholder, label: _label, error,
}
}
const handleCancel = ( ) => {
const handleCancel = ( ) => {
setModal ( false )
setModal ( false )
set Immediate ( ( ) => inputRef . current ? . blur ( ) )
set Timeout ( ( ) => inputRef . current ? . blur ( ) , 0 )
}
}
return (
return (
@ -40,7 +40,8 @@ export default function Input({placeholder: _placeholder, label: _label, error,
layout : 'landscape' ,
layout : 'landscape' ,
showTodayHelper : false
showTodayHelper : false
} }
} }
maxDate = { new Date ( ) }
minDate = { minDate }
maxDate = { maxDate }
selected = { value ? DateTime . fromISO ( value ) . toJSDate ( ) : undefined }
selected = { value ? DateTime . fromISO ( value ) . toJSDate ( ) : undefined }
onSelect = { handleDateSelect }
onSelect = { handleDateSelect }
/ >
/ >