59 lines
1.3 KiB
JavaScript
59 lines
1.3 KiB
JavaScript
import React from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import styled from 'styled-components';
|
|
import DatePicker from "react-datepicker";
|
|
import InputBlock from '../input-block';
|
|
import "react-datepicker/dist/react-datepicker.css";
|
|
|
|
const StyledDatePicker = styled.div`
|
|
width: 108px;
|
|
`;
|
|
|
|
const DateInput = props => {
|
|
//console.log("DateInput render");
|
|
const iconClick = function(){
|
|
this.onClick();
|
|
};
|
|
return (
|
|
<StyledDatePicker>
|
|
<DatePicker
|
|
customInput={
|
|
<InputBlock
|
|
id={props.id}
|
|
name={props.name}
|
|
isDisabled={props.disabled}
|
|
isReadOnly={props.readOnly}
|
|
hasError={props.hasError}
|
|
hasWarning={props.hasWarning}
|
|
iconName={"CalendarEmptyIcon"}
|
|
isIconFill={true}
|
|
iconColor={"#A3A9AE"}
|
|
onIconClick={iconClick}
|
|
scale={true}
|
|
/>
|
|
}
|
|
{...props}
|
|
/>
|
|
</StyledDatePicker>
|
|
|
|
);
|
|
}
|
|
|
|
DateInput.propTypes = {
|
|
id: PropTypes.string,
|
|
name: PropTypes.string,
|
|
disabled: PropTypes.bool,
|
|
readOnly: PropTypes.bool,
|
|
selected: PropTypes.instanceOf(Date),
|
|
onChange: PropTypes.func,
|
|
dateFormat: PropTypes.string,
|
|
hasError: PropTypes.bool,
|
|
hasWarning: PropTypes.bool
|
|
}
|
|
|
|
DateInput.defaultProps = {
|
|
selected: null,
|
|
dateFormat: "dd.MM.yyyy"
|
|
}
|
|
|
|
export default DateInput |