feat(B07): 평면도 관리 모달 오른쪽 CAD 캔버스만 · 확정 풀기 뺌(140-1)

- CAD 싣기 곁값 bare — 제목줄 · 리본 · 패널 · 상태막대 안 그림 · 높이 변수 0
- 모달 [확정 풀기] 지움 · 확정 배지 · [CAD 에서 열기] 그대로 · M02 미리보기 그대로

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01TNMXVCZXMpHpVvqmFkeChL

B07_DesignDetail/openwebcad/src/App.css

@@ -58,6 +58,10 @@ button {
 .cad-host-save {
 	--cad-title-height: 0px;
 }
+.cad-bare {
+	--cad-title-height: 0px;
+	--cad-status-height: 0px;
+}
 .controls {
 	pointer-events: auto;
 }

B07_DesignDetail/openwebcad/src/components/Toolbar.tsx

@@ -13,7 +13,7 @@ import { Ribbon } from '../ribbon/Ribbon';
 import { StatusBar } from './StatusBar';
 import { useCadRefresh } from './use-cad-refresh';
 import { isInspectorCollapsed, isRibbonCollapsed, setInspectorCollapsed } from './ui-state';
-import { getActiveToolActor } from '../state';
+import { getActiveToolActor, isBare } from '../state';
 import type { Tool } from '../tools';
 import { ViewControls } from './ViewControls';
 import { DropHint } from './DropHint';
@@ -26,21 +26,27 @@ export const Toolbar: FC = () => {
 	const ribbonCollapsed = isRibbonCollapsed();
 	// 좌측 패널 접힘 — 호스트(M02 미리보기)가 접힌 채로 실을 수 있게 ui-state 에 둔다
 	const panelCollapsed = isInspectorCollapsed();
+	// 캔버스만(B07 평면도 관리 모달) — 겉칸을 안 그리고 높이 · 폭 변수를 0 으로
+	const bare = isBare();
 
 	useEffect(() => {
 		// 편 상태의 폭은 App.css의 `--cad-panel-width` 기본값을 쓴다. 여기 숫자를 박아
 		// 두면 스타일에서 넓혀도 이 인라인 값이 덮는다(2026-09-01 실측: 300px 무시됨).
-		if (panelCollapsed) document.documentElement.style.setProperty('--cad-panel-width', '0px');
+		if (panelCollapsed || bare) document.documentElement.style.setProperty('--cad-panel-width', '0px');
 		else document.documentElement.style.removeProperty('--cad-panel-width');
 		document.documentElement.style.setProperty(
 			'--cad-command-height',
-			commandLineVisible ? '86px' : '0px'
+			commandLineVisible && !bare ? '86px' : '0px'
 		);
 		// 리본 접힘 — 탭 줄(26px)만 남기고 패널 줄 자리를 걷는다(`Ribbon.tsx` 가 안 그림).
-		if (ribbonCollapsed) document.documentElement.style.setProperty('--cad-ribbon-height', '26px');
+		if (bare) document.documentElement.style.setProperty('--cad-ribbon-height', '0px');
+		else if (ribbonCollapsed)
+			document.documentElement.style.setProperty('--cad-ribbon-height', '26px');
 		else document.documentElement.style.removeProperty('--cad-ribbon-height');
 		window.dispatchEvent(new Event('resize'));
-	}, [panelCollapsed, commandLineVisible, ribbonCollapsed]);
+	}, [panelCollapsed, commandLineVisible, ribbonCollapsed, bare]);
+
+	if (bare) return null;
 
 	return (
 		<>

B07_DesignDetail/openwebcad/src/integration/aislo-drawing-bridge.ts

@@ -27,6 +27,7 @@ import {
 	setLayers,
 	setOriginMarker,
 	setViewOnly,
+	setBare,
 } from '../state.ts';
 import { setInspectorCollapsed, setRibbonCollapsed } from '../components/ui-state.ts';
 import { toast } from 'react-toastify';
@@ -68,6 +69,8 @@ interface DrawingLoadMessage {
 	panelsCollapsed?: boolean;
 	/** 미리보기 — 왼쪽 끌기 = 화면 옮기기 · 두 번 누름 = 전체 맞춤 · 선택 · 명령 안내 없음. */
 	viewOnly?: boolean;
+	/** 캔버스만 — 제목줄 · 리본 · 패널 · 상태막대를 안 그림(B07 평면도 관리 모달). */
+	bare?: boolean;
 	originMarker?: boolean;
 }
 
@@ -227,6 +230,7 @@ export function registerAisloDrawingBridge() {
 			setRibbonCollapsed(event.data.ribbonCollapsed === true);
 			if (event.data.panelsCollapsed) setInspectorCollapsed(true);
 			setViewOnly(event.data.viewOnly === true);
+			setBare(event.data.bare === true);
 			setOriginMarker(event.data.originMarker === true);
 			if (event.data.frameEdit) applyFramePreview();
 			// 앞 도면에서 켜 둔 그리기 도구를 내린다. 안 내리면 **확정한 도면 위에도**

B07_DesignDetail/openwebcad/src/state.test.ts

@@ -7,9 +7,11 @@ import {
 	getEntities,
 	getHighlightedEntityIds,
 	isDrawingDirty,
+	isBare,
 	isDrawingReadOnly,
 	resetUndoBaseline,
 	setActiveLayerId,
+	setBare,
 	setDesignMeta,
 	setEntities,
 	setHighlightedEntityIds,
@@ -120,3 +122,23 @@ describe('isDrawingReadOnly', () => {
 		expect(isDrawingReadOnly()).toBe(false);
 	});
 });
+
+describe('setBare', () => {
+	it('캔버스만 — 켜면 뿌리에 cad-bare(제목줄 · 상태막대 0), 끄면 걷힌다', () => {
+		stubWindow();
+		const classes = new Set<string>();
+		(globalThis as { document?: unknown }).document = {
+			documentElement: {
+				classList: {
+					toggle: (name: string, on: boolean) => (on ? classes.add(name) : classes.delete(name)),
+				},
+			},
+		};
+		setBare(true);
+		expect(isBare()).toBe(true);
+		expect(classes.has('cad-bare')).toBe(true);
+		setBare(false);
+		expect(isBare()).toBe(false);
+		expect(classes.has('cad-bare')).toBe(false);
+	});
+});

B07_DesignDetail/openwebcad/src/state.ts

@@ -197,6 +197,8 @@ let viewOnly = false;
 let originMarker = false;
 let hostTitle = 'B07 상세 설계';
 let hostSave = false;
+/** 캔버스만(B07 평면도 관리 모달) — 제목줄 · 리본 · 패널 · 상태막대를 안 그린다. */
+let bare = false;
 
 /**
  * 실은 뒤로 실제 편집이 있었는가. 도면을 바꾸기 전에 부모가 물어보는 근거다 —
@@ -512,6 +514,13 @@ export const setHostSave = (enabled: boolean) => {
 	// 제목 줄이 없어지면 그 높이만큼 위로 당긴다(App.css `.cad-host-save`).
 	document.documentElement.classList.toggle('cad-host-save', enabled);
 };
+export const isBare = (): boolean => bare;
+export const setBare = (enabled: boolean) => {
+	bare = enabled;
+	// 제목 줄 · 상태막대 높이를 걷는다(App.css `.cad-bare`) — 리본 · 패널은 Toolbar 가 0 으로.
+	document.documentElement.classList.toggle('cad-bare', enabled);
+	notifyWindow(HtmlEvent.UPDATE_STATE);
+};
 export const getHostTitle = (): string => hostTitle;
 export const setHostTitle = (title: string) => {
 	hostTitle = title;