docs: [rules] DateRangeSelector 필수 사용 규칙 추가

CLAUDE.md

@@ -591,6 +591,37 @@ const config: UniversalListConfig<MyItem> = {
 
 `NumberInput useComma`는 포커스 해제 시에만 콤마 표시. 금액 전용 입력에는 반드시 `CurrencyInput` 사용.
 
+### 🔴 날짜 범위 입력 — DateRangeSelector 필수
+시작일~종료일 날짜 범위가 필요하면 **반드시 `DateRangeSelector`** 사용. `DatePicker` 2개를 직접 조합하지 않는다.
+
+```typescript
+import { DateRangeSelector } from '@/components/molecules/DateRangeSelector';
+
+// ✅ 올바른 패턴 — DateRangeSelector 사용
+<DateRangeSelector
+  startDate={startDate}
+  endDate={endDate}
+  onStartDateChange={setStartDate}
+  onEndDateChange={setEndDate}
+  hidePresets           // 프리셋 버튼 불필요 시
+/>
+```
+
+```typescript
+// ❌ 금지 패턴 — DatePicker 2개 직접 조합
+<DatePicker value={startDate} onChange={setStartDate} />
+<span>~</span>
+<DatePicker value={endDate} onChange={setEndDate} />
+```
+
+| Props | 설명 |
+|-------|------|
+| `hidePresets` | 프리셋 버튼(당월, 전월 등) 숨김 |
+| `presets` | 표시할 프리셋 선택 (`['thisMonth', 'lastMonth']` 등) |
+| `variant` | `'combined'`(기본, 합친 형태) / `'split'`(DatePicker 2개) |
+| `presetsPosition` | `'inline'`(기본) / `'below'`(별도 줄) |
+| `extraActions` | 우측 추가 버튼 (엑셀, 조회 등) |
+
 ---
 
 ## FormField 사용 규칙 (신규 폼 필수)