react-animated-ui/docs/AnimatedDatePicker.md

A React UI library featuring animated components including buttons, forms, dropdowns, date pickers, and more.

# Animated Date Picker

## Description  
An elegant date picker component with smooth animations for calendar pop-up and date selection. Perfect for forms and scheduling UI.

---

## Props

| Prop           | Type                          | Default       | Description                                |
|----------------|-------------------------------|---------------|--------------------------------------------|
| `selectedDate` | `Date \| null`                | `null`        | Currently selected date                     |
| `onChange`     | `(date: Date) => void`        | `-`           | Callback fired when a date is selected     |
| `minDate`      | `Date`                       | `undefined`   | Minimum selectable date                     |
| `maxDate`      | `Date`                       | `undefined`   | Maximum selectable date                     |
| `disabled`     | `boolean`                     | `false`       | Disables the date picker                     |
| `placeholder`  | `string`                      | `"Select date"` | Placeholder text when no date selected    |
| `className`    | `string`                      | `""`          | Custom CSS class for styling                 |

---

## Usage

```tsx
import React, { useState } from 'react';
import { AnimatedDatePicker } from 'react-animated-ui';

function MyComponent() {
  const [date, setDate] = useState<Date | null>(null);

  return (
    <AnimatedDatePicker
      selectedDate={date}
      onChange={setDate}
      placeholder="Choose a date"
      minDate={new Date(2020, 0, 1)}
      maxDate={new Date(2030, 11, 31)}
    />
  );
}