import React, { useState } from 'react';
import DatePicker from '../index';

const Ranged = () => {
  const [start, setStart] = useState(undefined);
  const [end, setEnd] = useState(undefined);

  return (
    <>
      <DatePicker
        defaultValue={start}
        onChange={setStart}
        isStart
        start={start}
        end={end}
        max={end}
      />

      <span style={{ margin: '0px 25px' }}>-</span>

      <DatePicker
        defaultValue={end}
        onChange={setEnd}
        isEnd
        start={start}
        end={end}
        min={start}
      />
    </>
  );
};

export default Ranged;