fix(calendar): add CSS animations for animate prop

[Rani367]

Description

Fixes the bug where adding the animate prop to the Calendar component causes weeks to display over each other and breaks navigation.

Closes #8905

Problem

The shadcn/ui Calendar component wraps react-day-picker but doesn't include the CSS animations required for the animate feature. When users added the animate prop, react-day-picker applied animation classes but without the CSS definitions, causing weeks to overlap instead of animating smoothly.

Solution

• Added react-day-picker animation keyframes and classes to globals.css
• Includes 6 animation keyframes for slide and fade effects
• Added animation classes for weeks and captions
• Includes RTL (right-to-left) support with direction-aware animations
• Respects user's prefers-reduced-motion accessibility preference
• Uses CSS variables with fallbacks: --rdp-animation_duration and --rdp-animation_timing

Changes

• globals.css: Added animation CSS for react-day-picker
• calendar-demo.tsx: Added animate prop to showcase the feature
• calendar.mdx: Added documentation section explaining animate prop usage

Testing

• TypeScript typecheck passed
• ESLint checks passed
• Registry built successfully
• Calendar navigation works smoothly with animate prop
• Animations respect user's motion preferences

Checklist

• [x] I have read the contributing guide
• [x] My commits follow the commit convention (fix(calendar): ...)
• [x] I have tested my changes locally
• [x] I have updated the documentation

[vercel[bot]]

@Rani367 is attempting to deploy a commit to the shadcn-pro Team on Vercel.

A member of the Team first needs to authorize it.