eomsangdonandClaude Opus 5.5
de250ab759
- 부품 상자 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>
71 lines
1.9 KiB
TypeScript
71 lines
1.9 KiB
TypeScript
/** 화면 우하단 탐색 막대 (줌 표시·전체 보기) — 제목줄이 없는 화면(M02)은 되돌리기 · 다시 하기도 */
|
||
import type { FC } from 'react';
|
||
import { runCommandInput } from '../commands/run-command';
|
||
import { redoCommand, undoCommand } from '../inputController/prompt-input';
|
||
import { zoomExtents } from '../inputController/zoom-prompt';
|
||
import { getScreenCanvasDrawController, isDrawingReadOnly, isHostSave, isViewOnly } from '../state';
|
||
|
||
/** 아이콘 단추 부품(단 32) */
|
||
const ICON_BUTTON = { className: 'ui-icon-btn ui-icon-btn--ghost', 'data-size': '32' } as const;
|
||
|
||
export const ViewControls: FC = () => {
|
||
const zoom = getScreenCanvasDrawController()?.getScreenScale() ?? 1;
|
||
// 제목줄(빠른 막대)이 없는 M02 양식 · 구조물 카드 — 고칠 수 있을 때만
|
||
const showUndo = isHostSave() && !isViewOnly() && !isDrawingReadOnly();
|
||
|
||
return (
|
||
<div className="cad-view-controls controls">
|
||
{showUndo && (
|
||
<>
|
||
<button
|
||
type="button"
|
||
{...ICON_BUTTON}
|
||
onClick={undoCommand}
|
||
title="실행 취소 (Ctrl+Z)"
|
||
aria-label="실행 취소"
|
||
>
|
||
↶
|
||
</button>
|
||
<button
|
||
type="button"
|
||
{...ICON_BUTTON}
|
||
onClick={redoCommand}
|
||
title="다시 실행 (Ctrl+Y)"
|
||
aria-label="다시 실행"
|
||
>
|
||
↷
|
||
</button>
|
||
</>
|
||
)}
|
||
<button
|
||
type="button"
|
||
{...ICON_BUTTON}
|
||
onClick={() => zoomExtents()}
|
||
title="범위 줌 (Z) — 도면 전체를 화면에 맞춘다"
|
||
aria-label="범위 줌"
|
||
>
|
||
⛶
|
||
</button>
|
||
<button
|
||
type="button"
|
||
{...ICON_BUTTON}
|
||
onClick={() => runCommandInput('ZOOMIN')}
|
||
title="확대"
|
||
aria-label="확대"
|
||
>
|
||
＋
|
||
</button>
|
||
<span>{Math.round(zoom * 100)}%</span>
|
||
<button
|
||
type="button"
|
||
{...ICON_BUTTON}
|
||
onClick={() => runCommandInput('ZOOMOUT')}
|
||
title="축소"
|
||
aria-label="축소"
|
||
>
|
||
－
|
||
</button>
|
||
</div>
|
||
);
|
||
};
|