From 7ab3781372d5f83e70b8a5f964f6fede1df95f05 Mon Sep 17 00:00:00 2001
From: kjs <kjs@wace.me>
Date: Mon, 10 Nov 2025 14:36:53 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EB=93=9C=EB=9E=98=EA=B7=B8=20=EB=93=9C?=
 =?UTF-8?q?=EB=A1=AD=20=EC=BB=AC=EB=9F=BC=20=EB=9D=BC=EB=B2=A8=20=EC=88=A8?=
 =?UTF-8?q?=EA=B9=80=20=EB=B0=8F=20placeholder=20=ED=91=9C=EC=8B=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 테이블 탭에서 드래그 드롭으로 배치되는 컬럼의 라벨 자동 숨김 (labelDisplay: false)
- placeholder에 컬럼 라벨명 자동 표시
- 폼 컨테이너 및 캔버스 직접 드롭 모두 적용
- 더 깔끔한 UI 제공
---
 frontend/components/screen/ScreenDesigner.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/components/screen/ScreenDesigner.tsx b/frontend/components/screen/ScreenDesigner.tsx
index 4fa083ba..92d3f560 100644
--- a/frontend/components/screen/ScreenDesigner.tsx
+++ b/frontend/components/screen/ScreenDesigner.tsx
@@ -2583,7 +2583,7 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD
                     codeCategory: column.codeCategory,
                   }),
                 style: {
-                  labelDisplay: false, // 모든 컴포넌트의 기본 라벨 표시를 false로 설정
+                  labelDisplay: false, // 라벨 숨김
                   labelFontSize: "12px",
                   labelColor: "#212121",
                   labelFontWeight: "500",
@@ -2595,6 +2595,7 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD
                   webType: column.widgetType, // 원본 웹타입 보존
                   inputType: column.inputType, // ✅ input_type 추가 (category 등)
                   ...getDefaultWebTypeConfig(column.widgetType),
+                  placeholder: column.columnLabel || column.columnName, // placeholder에 라벨명 표시
                   // 코드 타입인 경우 코드 카테고리 정보 추가
                   ...(column.widgetType === "code" &&
                     column.codeCategory && {
@@ -2658,7 +2659,7 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD
                   codeCategory: column.codeCategory,
                 }),
               style: {
-                labelDisplay: true, // 테이블 패널에서 드래그한 컴포넌트는 라벨을 기본적으로 표시
+                labelDisplay: false, // 라벨 숨김
                 labelFontSize: "14px",
                 labelColor: "#000000", // 순수한 검정
                 labelFontWeight: "500",
@@ -2670,6 +2671,7 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD
                 webType: column.widgetType, // 원본 웹타입 보존
                 inputType: column.inputType, // ✅ input_type 추가 (category 등)
                 ...getDefaultWebTypeConfig(column.widgetType),
+                placeholder: column.columnLabel || column.columnName, // placeholder에 라벨명 표시
                 // 코드 타입인 경우 코드 카테고리 정보 추가
                 ...(column.widgetType === "code" &&
                   column.codeCategory && {