컴포넌트 화면편집기에 배치

frontend/components/screen/InteractiveScreenViewerDynamic.tsx

@@ -10,6 +10,13 @@ import { toast } from "sonner";
 import { ComponentData, WidgetComponent, DataTableComponent, FileComponent, ButtonTypeConfig } from "@/types/screen";
 import { InteractiveDataTable } from "./InteractiveDataTable";
 import { DynamicWebTypeRenderer } from "@/lib/registry";
+import { DynamicComponentRenderer } from "@/lib/registry/DynamicComponentRenderer";
+
+// 컴포넌트 렌더러들을 강제로 로드하여 레지스트리에 등록
+import "@/lib/registry/components/ButtonRenderer";
+import "@/lib/registry/components/CardRenderer";
+import "@/lib/registry/components/DashboardRenderer";
+import "@/lib/registry/components/WidgetRenderer";
 import { dynamicFormApi, DynamicFormData } from "@/lib/api/dynamicForm";
 import { useParams } from "next/navigation";
 import { screenApi } from "@/lib/api/screen";
@@ -152,9 +159,22 @@ export const InteractiveScreenViewerDynamic: React.FC<InteractiveScreenViewerPro
       return renderFileComponent(comp as FileComponent);
     }
 
-    // 위젯 컴포넌트가 아닌 경우
+    // 위젯 컴포넌트가 아닌 경우 DynamicComponentRenderer 사용
     if (comp.type !== "widget") {
-      return <div className="text-sm text-gray-500">지원되지 않는 컴포넌트 타입</div>;
+      console.log("🎯 InteractiveScreenViewer - DynamicComponentRenderer 사용:", {
+        componentId: comp.id,
+        componentType: comp.type,
+        componentConfig: comp.componentConfig,
+      });
+
+      return (
+        <DynamicComponentRenderer
+          component={comp}
+          isInteractive={true}
+          formData={formData}
+          onFormDataChange={handleFormDataChange}
+        />
+      );
     }
 
     const widget = comp as WidgetComponent;
@@ -492,5 +512,3 @@ export const InteractiveScreenViewerDynamic: React.FC<InteractiveScreenViewerPro
 export { InteractiveScreenViewerDynamic as InteractiveScreenViewer };
 
 InteractiveScreenViewerDynamic.displayName = "InteractiveScreenViewerDynamic";
-
-