# range-date-picker

<figure><img src="https://3212561211-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FojaIWzOttDuV549cYsPQ%2Fuploads%2FgB5diF7hFSPEsbrzb2TA%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202025-02-20%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%206.37.48.png?alt=media&#x26;token=44ca261d-3f43-40ef-8a15-ff02e3500c09" alt=""><figcaption></figcaption></figure>

### Props

<table><thead><tr><th width="210">Prop</th><th width="164">Type</th><th width="108">Default</th><th>Description</th></tr></thead><tbody><tr><td>fromName</td><td>string</td><td>-</td><td>시작일자 고유 이름</td></tr><tr><td>toName</td><td>string</td><td>-</td><td>종료일자 고유 이름</td></tr><tr><td>fromValue</td><td>string</td><td>-</td><td>시작일자</td></tr><tr><td>toValue</td><td>string</td><td>-</td><td>종료일자</td></tr><tr><td>isPreset</td><td>boolean</td><td>-</td><td>프리셋 사용 여부</td></tr><tr><td>onChange</td><td>function</td><td>-</td><td>날짜 변경 핸들러</td></tr></tbody></table>

### Usage

```typescript
import { RangeDatePicker } from '@/src/components/ui'

function RangeDatePickerDemo() {
  return (
    <RangeDatePicker
      fromName={'fromDate'}
      toName={'toDate'}
      fromValue={'2025. 1. 26'}
      toValue={'2025. 2. 25'}
      isPreset={true}
      onChange={() => {}}
    />
  )
}
```