- 블록 이름 묻기 = 부품 글 묻기(askText) · 블록 지우기 = 위험 확인(showConfirmDialog) — CAD 창 안에 앱과 같은 확인창 꼴(injectBaseStyles) - 크기 단 — 리본 특성 칸 19 → 18 · 빠른 실행 24×20 → 20 · 상태막대 단추 21 → 22 · 명령 칸 26 → 28 · 왼쪽 판 탭 38 → 36 · Button 40 → 42 · 블록 · 자리표 단추 22 · 24 · 큰 리본 도구 66 · 리본 탭 줄은 꼴 그대로 - 마우스 바탕 = --color-hover · 켜짐 바탕 = --color-accent-soft(옛 보라 별칭 걷음) · 떠 있는 판 · 메뉴 둥글기 = 공통 값(날 2 · 3 · 5 px 11 곳 → 0) - 안 쓰는 DropdownButton 지움(grep 0) · 그림(캔버스 바탕 · --draw-*) 전후 같음 · B07 전후 촬영 CAD 안 배치 바뀜 = 빠른 실행 칸만 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
76 lines
2.2 KiB
TypeScript
76 lines
2.2 KiB
TypeScript
/** 블록 라이브러리 팔레트 — 저장한 블록을 고르면 삽입 도구가 켜진다 (INSERT/BLOCK) */
|
|
import type { FC } from 'react';
|
|
import { showConfirmDialog } from '../../../../ui_template/ui_template_modal';
|
|
import {
|
|
deleteBlock,
|
|
exportBlocksToFile,
|
|
getBlocks,
|
|
importBlocksFromFile,
|
|
} from '../blocks/block-library';
|
|
import { pickFile } from '../helpers/pick-file';
|
|
import { startBlockInsert } from '../tools/insert-block-tool';
|
|
import { isBlockLibraryVisible, setBlockLibraryVisible } from './ui-state';
|
|
|
|
export const BlockLibraryPanel: FC = () => {
|
|
if (!isBlockLibraryVisible()) return null;
|
|
|
|
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="닫기">
|
|
✕
|
|
</button>
|
|
</div>
|
|
|
|
{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={() => {
|
|
// 위험 확인 = 부품 확인창(553-6 · window.confirm 대신)
|
|
void showConfirmDialog(`블록 '${block.name}'을 삭제하시겠습니까?`, '삭제').then(
|
|
(ok) => ok && 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>
|
|
</div>
|
|
);
|
|
};
|