feat: 품목관리 동적 렌더링 시스템 구현

- DynamicItemForm 컴포넌트 구조 생성
  - DynamicField: 필드 타입별 렌더링
  - DynamicSection: 섹션 단위 렌더링
  - DynamicFormRenderer: 페이지 전체 렌더링
- 필드 타입별 컴포넌트 (TextField, NumberField, DropdownField, CheckboxField, DateField, FileField, CustomField)
- 커스텀 훅 (useDynamicFormState, useFormStructure, useConditionalFields)
- DataTable 공통 컴포넌트 (테이블, 페이지네이션, 검색, 탭필터, 통계카드)
- ItemFormWrapper: Feature Flag 기반 폼 선택
- 타입 정의 및 문서화

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

src/components/items/DynamicItemForm/fields/DropdownField.tsx

@@ -0,0 +1,118 @@
+/**
+ * DropdownField Component
+ *
+ * 드롭다운/선택 필드 (dropdown, searchable-dropdown)
+ */
+
+'use client';
+
+import { useState, useEffect } from 'react';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select';
+import { Label } from '@/components/ui/label';
+import type { DynamicFieldProps, DropdownOption } from '../types';
+import { cn } from '@/lib/utils';
+
+export function DropdownField({
+  field,
+  value,
+  error,
+  onChange,
+  onBlur,
+  disabled,
+}: DynamicFieldProps) {
+  const [options, setOptions] = useState<DropdownOption[]>(
+    field.dropdown_config?.options || []
+  );
+  const [isLoading, setIsLoading] = useState(false);
+
+  // API에서 옵션 로드 (options_endpoint가 있는 경우)
+  useEffect(() => {
+    if (field.dropdown_config?.options_endpoint) {
+      setIsLoading(true);
+      fetch(field.dropdown_config.options_endpoint)
+        .then((res) => res.json())
+        .then((data) => {
+          if (data.success && Array.isArray(data.data)) {
+            setOptions(data.data);
+          }
+        })
+        .catch((err) => {
+          console.error('[DropdownField] Failed to load options:', err);
+        })
+        .finally(() => {
+          setIsLoading(false);
+        });
+    }
+  }, [field.dropdown_config?.options_endpoint]);
+
+  const displayValue = value === null || value === undefined ? '' : String(value);
+
+  const handleValueChange = (newValue: string) => {
+    onChange(newValue);
+    onBlur();
+  };
+
+  return (
+    <div className="space-y-2">
+      <Label
+        htmlFor={field.field_key}
+        className={cn(
+          'text-sm font-medium',
+          field.is_required && "after:content-['*'] after:ml-0.5 after:text-red-500"
+        )}
+      >
+        {field.field_name}
+      </Label>
+
+      <Select
+        value={displayValue}
+        onValueChange={handleValueChange}
+        disabled={disabled || field.is_readonly || isLoading}
+      >
+        <SelectTrigger
+          id={field.field_key}
+          className={cn(
+            error && 'border-red-500 focus:ring-red-500',
+            field.is_readonly && 'bg-gray-50 text-gray-500'
+          )}
+        >
+          <SelectValue
+            placeholder={
+              isLoading
+                ? '로딩 중...'
+                : field.dropdown_config?.placeholder || '선택하세요'
+            }
+          />
+        </SelectTrigger>
+        <SelectContent>
+          {field.dropdown_config?.allow_empty && (
+            <SelectItem value="">선택 안함</SelectItem>
+          )}
+          {options.map((option) => (
+            <SelectItem
+              key={option.value}
+              value={option.value}
+              disabled={option.disabled}
+            >
+              {option.label}
+            </SelectItem>
+          ))}
+        </SelectContent>
+      </Select>
+
+      {field.help_text && !error && (
+        <p className="text-xs text-muted-foreground">{field.help_text}</p>
+      )}
+
+      {error && <p className="text-xs text-red-500">{error}</p>}
+    </div>
+  );
+}
+
+export default DropdownField;