(김준회) 공통 컴포넌트 이해를 위한 문서 추가

1 files changed, 96 insertions, 0 deletions

diff --git a/components/common/discipline/README.md b/components/common/discipline/README.md
new file mode 100644
index 00000000..7e95dd4e
--- /dev/null
+++ b/components/common/discipline/README.md
@@ -0,0 +1,96 @@
+# 설계공종코드 선택기 (Engineering Discipline Selector)
+
+내부 PostgreSQL DB에서 설계공종코드(CD_CLF='PLJP43')를 조회하는 공용 컴포넌트입니다.
+
+## 기능
+
+- 내부 PostgreSQL DB에서 설계공종코드 실시간 검색
+- 코드와 이름으로 필터링 가능
+- 페이지네이션 지원
+- 반응형 다이얼로그 UI
+- 서버 액션을 활용한 최적화된 성능
+
+## 사용법
+
+### 기본 사용법
+
+```tsx
+import { EngineeringDisciplineSelector, DisciplineCode } from '@/components/common/discipline'
+
+function MyComponent() {
+  const [selectedDiscipline, setSelectedDiscipline] = useState<DisciplineCode>()
+
+  return (
+    <EngineeringDisciplineSelector
+      selectedDiscipline={selectedDiscipline}
+      onDisciplineSelect={(discipline) => {
+        console.log('선택된 설계공종:', discipline)
+        setSelectedDiscipline(discipline)
+      }}
+    />
+  )
+}
+```
+
+### 커스터마이징
+
+```tsx
+<EngineeringDisciplineSelector
+  selectedDiscipline={selectedDiscipline}
+  onDisciplineSelect={handleSelect}
+  placeholder="설계공종을 선택해주세요"
+  className="w-full h-10"
+  disabled={false}
+  searchOptions={{ limit: 50 }}
+/>
+```
+
+## Props
+
+| Prop | 타입 | 필수 | 기본값 | 설명 |
+|------|------|------|--------|------|
+| `selectedDiscipline` | `DisciplineCode` | ❌ | - | 선택된 설계공종 |
+| `onDisciplineSelect` | `(discipline: DisciplineCode) => void` | ✅ | - | 설계공종 선택 시 호출되는 콜백 |
+| `disabled` | `boolean` | ❌ | `false` | 비활성화 여부 |
+| `placeholder` | `string` | ❌ | `"설계공종을 선택하세요"` | 플레이스홀더 텍스트 |
+| `className` | `string` | ❌ | - | 추가 CSS 클래스 |
+| `searchOptions` | `Partial<DisciplineSearchOptions>` | ❌ | `{ limit: 100 }` | 검색 옵션 |
+
+## 타입
+
+### DisciplineCode
+```tsx
+interface DisciplineCode {
+  CD: string              // 설계공종코드
+  USR_DF_CHAR_18: string  // 설계공종명
+}
+```
+
+### DisciplineSearchOptions
+```tsx
+interface DisciplineSearchOptions {
+  searchTerm?: string  // 검색어
+  limit?: number      // 조회 제한 수
+}
+```
+
+## 데이터 소스
+
+**내부 PostgreSQL DB**
+- **테이블**: cmctbCd (NONSAP 스키마)
+- **조건**: CD_CLF = 'PLJP43'
+- **필드**: 
+  - CD (설계공종코드)
+  - USR_DF_CHAR_18 (설계공종명)
+
+## 동작 방식
+
+1. **서버 액션 호출**: Next.js 서버 액션을 통한 안전한 데이터 페칭
+2. **PostgreSQL 조회**: Drizzle ORM을 사용하여 cmctbCd 테이블에서 조회
+3. **검색 최적화**: ILIKE를 사용한 대소문자 무관 검색
+4. **성능 최적화**: useTransition을 활용한 논블로킹 UI 업데이트
+
+## 주의사항
+
+- 내부 PostgreSQL DB 연결이 필요합니다
+- NONSAP 스키마의 cmctbCd 테이블에 데이터가 있어야 합니다