feat: 테이블 검색 필터 위젯 구현 완료

- TableOptionsContext 기반 테이블 자동 감지 시스템 구현
- 독립 위젯으로 드래그앤드롭 배치 가능
- 3가지 기능: 컬럼 가시성, 필터 설정, 그룹 설정
- FlowWidget, TableList, SplitPanel 등 모든 테이블 컴포넌트 지원
- 유틸리티 카테고리에 등록 (1920×80px)
- 위젯 크기 제어 가이드 룰 파일에 추가

frontend/components/screen/InteractiveScreenViewer.tsx

@@ -46,6 +46,8 @@ import { isFileComponent } from "@/lib/utils/componentTypeUtils";
 import { buildGridClasses } from "@/lib/constants/columnSpans";
 import { cn } from "@/lib/utils";
 import { useScreenPreview } from "@/contexts/ScreenPreviewContext";
+import { TableOptionsProvider } from "@/contexts/TableOptionsContext";
+import { TableOptionsToolbar } from "./table-options/TableOptionsToolbar";
 
 interface InteractiveScreenViewerProps {
   component: ComponentData;
@@ -1885,8 +1887,13 @@ export const InteractiveScreenViewer: React.FC<InteractiveScreenViewerProps> = (
     : component;
 
   return (
-    <>
-      <div className="h-full" style={{ width: '100%', height: '100%' }}>
+    <TableOptionsProvider>
+      <div className="flex h-full flex-col">
+        {/* 테이블 옵션 툴바 */}
+        <TableOptionsToolbar />
+        
+        {/* 메인 컨텐츠 */}
+        <div className="h-full flex-1" style={{ width: '100%' }}>
           {/* 라벨이 있는 경우 표시 (데이터 테이블 제외) */}
           {shouldShowLabel && (
             <label className="mb-2 block text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
@@ -1897,6 +1904,7 @@ export const InteractiveScreenViewer: React.FC<InteractiveScreenViewerProps> = (
 
         {/* 실제 위젯 - 상위에서 라벨을 렌더링했으므로 자식은 라벨 숨김 */}
         <div className="h-full" style={{ width: '100%', height: '100%' }}>{renderInteractiveWidget(componentForRendering)}</div>
+        </div>
       </div>
 
       {/* 개선된 검증 패널 (선택적 표시) */}
@@ -1986,6 +1994,6 @@ export const InteractiveScreenViewer: React.FC<InteractiveScreenViewerProps> = (
           </div>
         </DialogContent>
       </Dialog>
-    </>
+    </TableOptionsProvider>
   );
 };