refactor(cad): CAD 앱 겉 자체 변종을 부품 상자 부품으로 — 상태막대 켜기 칩 · 패널 탭 · 떠 있는 판 · 메뉴 · 아이콘 단추 · 확인창 (PLAN 553-6)

- 부품 상자 CSS · 단추 기본 꼴을 CAD iframe 에 실음(integration/ui-kit.ts) · 자리 · 폭은 cad-* 그대로
- 상태막대 = ui-toggle--chip 22 · 특성/레이어 = ui-tabs 36 · ↶↷ · 리본 접기 · 탐색 막대 = ui-icon-btn 20 · 32
- 빠른 특성 · 블록 라이브러리 · 자리표 = ui-float-panel · 리본 넘침 · 스냅 · 명령 자동완성 = ui-ctx-menu
- window.confirm · window.prompt → askConfirm · askText · 빈 안내 = ui-empty 작은 꼴
- 높이 단: 리본 칸 19→18 · 명령 칸 26→28 · 레이어 줄 40→42 · 문서 탭 25→24 · 도각 편집 단추 24
- 마우스 바탕 = --color-hover · 켜짐 = --color-accent-soft · 도면 그림 색(--draw-*) 안 건드림
- 안 쓰는 DropdownButton 지움(쓰는 곳 0 · grep)

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

B07_DesignDetail/openwebcad/src/components/BlockLibraryPanel.tsx

@@ -1,4 +1,4 @@
-/** 블록 라이브러리 팔레트 — 저장한 블록을 고르면 삽입 도구가 켜진다 (INSERT/BLOCK) */
+/** 블록 라이브러리 팔레트 — 저장한 블록을 고르면 삽입 도구가 켜진다 (INSERT/BLOCK) · 떠 있는 판 부품 */
 import type { FC } from 'react';
 import {
 	deleteBlock,
@@ -7,6 +7,7 @@ import {
 	importBlocksFromFile,
 } from '../blocks/block-library';
 import { pickFile } from '../helpers/pick-file';
+import { askConfirm } from '../integration/ui-kit';
 import { startBlockInsert } from '../tools/insert-block-tool';
 import { isBlockLibraryVisible, setBlockLibraryVisible } from './ui-state';
 
@@ -16,57 +17,83 @@ export const BlockLibraryPanel: FC = () => {
 	const blocks = getBlocks();
 
 	return (
-		<div className="cad-block-library controls">
-			<div className="cad-quick-properties__header">
-				<span>블록 라이브러리</span>
-				<button type="button" onClick={() => setBlockLibraryVisible(false)} title="닫기">
+		<div className="ui-float-panel cad-block-library controls">
+			<div className="ui-float-panel__head">
+				<span className="ui-float-panel__title">블록 라이브러리</span>
+				<button
+					type="button"
+					className="ui-icon-btn ui-icon-btn--ghost"
+					data-size="24"
+					onClick={() => setBlockLibraryVisible(false)}
+					title="닫기"
+					aria-label="닫기"
+				>
 					✕
 				</button>
 			</div>
+			<div className="ui-float-panel__body">
+				{blocks.length === 0 ? (
+					<div className="ui-empty ui-empty--small">
+						<p className="ui-empty__text">객체를 선택하고 BLOCK 명령으로 저장하십시오.</p>
+					</div>
+				) : (
+					<ul className="cad-block-library__list">
+						{blocks.map((block) => (
+							<li key={block.name}>
+								<button
+									type="button"
+									className="ui-sidebar-row cad-block-library__name"
+									title={`객체 ${block.entities.length}개 — 클릭하면 삽입`}
+									onClick={() => {
+										setBlockLibraryVisible(false);
+										void startBlockInsert(block);
+									}}
+								>
+									{block.name}
+								</button>
+								<button
+									type="button"
+									className="ui-icon-btn ui-icon-btn--ghost"
+									data-size="20"
+									title="삭제"
+									aria-label="삭제"
+									onClick={async () => {
+										if (
+											await askConfirm({
+												message: `블록 '${block.name}'을 삭제하시겠습니까?`,
+												okLabel: '삭제',
+												danger: true,
+											})
+										) {
+											deleteBlock(block.name);
+										}
+									}}
+								>
+									✕
+								</button>
+							</li>
+						))}
+					</ul>
+				)}
 
-			{blocks.length === 0 ? (
-				<p className="cad-block-library__empty">객체를 선택하고 BLOCK 명령으로 저장하십시오.</p>
-			) : (
-				<ul className="cad-block-library__list">
-					{blocks.map((block) => (
-						<li key={block.name}>
-							<button
-								type="button"
-								className="cad-block-library__name"
-								title={`객체 ${block.entities.length}개 — 클릭하면 삽입`}
-								onClick={() => {
-									setBlockLibraryVisible(false);
-									void startBlockInsert(block);
-								}}
-							>
-								{block.name}
-							</button>
-							<button
-								type="button"
-								title="삭제"
-								onClick={() => {
-									if (window.confirm(`블록 '${block.name}'을 삭제하시겠습니까?`)) {
-										deleteBlock(block.name);
-									}
-								}}
-							>
-								✕
-							</button>
-						</li>
-					))}
-				</ul>
-			)}
-
-			<div className="cad-block-library__actions">
-				<button type="button" onClick={() => exportBlocksToFile()}>
-					파일로 내보내기
-				</button>
-				<button
-					type="button"
-					onClick={() => pickFile('application/json', (file) => importBlocksFromFile(file))}
-				>
-					파일에서 가져오기
-				</button>
+				<div className="cad-block-library__actions">
+					<button
+						type="button"
+						className="ui-btn ui-btn--ghost"
+						data-size="24"
+						onClick={() => exportBlocksToFile()}
+					>
+						파일로 내보내기
+					</button>
+					<button
+						type="button"
+						className="ui-btn ui-btn--ghost"
+						data-size="24"
+						onClick={() => pickFile('application/json', (file) => importBlocksFromFile(file))}
+					>
+						파일에서 가져오기
+					</button>
+				</div>
 			</div>
 		</div>
 	);