import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
import { DateRangePicker } from './date-range-picker.component';

<Meta title="Components/Inputs/DateRangePicker" component={DateRangePicker} />

# Date Range Picker

The date picker `from` date will always be the start of the `Date`, and `to`will be the very end (23:59:999)

## Normal

<Canvas>
  <Story id="components-inputs-daterangepicker--normal" height="300px" />
</Canvas>

## With Preselected Range

<Canvas>
  <Story
    id="components-inputs-daterangepicker--with-preselected-range"
    height="300px"
  />
</Canvas>

## Hide After Selection

<Canvas>
  <Story
    id="components-inputs-daterangepicker--hide-after-selection"
    height="300px"
  />
</Canvas>