# Code

{% hint style="danger" %}
This is not a Compound Component.
{% endhint %}

This component can be seen as a small library, because you will import the neccessary components from the 'DatePicker' library.

{% code fullWidth="false" %}

```tsx
import { RangeDatePicker, SingleDatePicker } from '@sipter/react-datepicker'
```

{% endcode %}

## Example

<table data-view="cards"><thead><tr><th></th><th></th><th></th></tr></thead><tbody><tr><td>Live Demo - Single Date Picker</td><td><a href="https://codesandbox.io/s/single-date-picker-l8r689">Code Sandbox</a></td><td></td></tr><tr><td>Live Demop - Range Date Picker</td><td><a href="https://codesandbox.io/s/range-date-picker-gn48q7">Code Sandbox</a></td><td></td></tr></tbody></table>